My personal blog
hauleth.dev
blog
chore: scale font size relatively to the screen width
+12
-9
+12
-9
sass/_main.scss
+12
-9
sass/_main.scss
···
1
1
@import "variables";
2
2
3
+
:root {
4
+
font-size: calc(1rem + 0.1vw);
5
+
line-height: 1.54;
6
+
color: var(--color);
7
+
8
+
@media print {
9
+
color: #000;
10
+
line-height: 1.2;
11
+
font-size: 10pt;
12
+
}
13
+
}
14
+
3
15
html {
4
16
box-sizing: border-box;
5
17
}
···
14
26
margin: 0;
15
27
padding: 0;
16
28
font-family: ui-monospace, monospace;
17
-
font-size: 12pt;
18
-
line-height: 1.54;
19
29
background-color: var(--background);
20
-
color: var(--color);
21
30
// text-shadow: 0 0 3px currentcolor;
22
31
text-rendering: optimizeLegibility;
23
32
-webkit-font-smoothing: antialiased;
24
33
-webkit-overflow-scrolling: touch;
25
34
-webkit-text-size-adjust: 100%;
26
-
27
-
@media print {
28
-
color: #000;
29
-
line-height: 1.2;
30
-
font-size: 10pt;
31
-
}
32
35
}
33
36
34
37
h1, h2, h3, h4, h5, h6 {