Skip to content

Commit 820714a

Browse files
zbroxDylan-DPC
authored andcommitted
Use only relative font sizes (#894)
This replaces the only use of px for font-sizes by setting up a base rem size on the root element in a way that is easy to calculate (1 rem = 10px) and scaling up according to browser settings.
1 parent d5535d1 commit 820714a

File tree

2 files changed

+7
-2
lines changed

2 files changed

+7
-2
lines changed

src/theme/css/chrome.css

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -87,7 +87,7 @@ html:not(.sidebar-visible) #menu-bar:not(:hover).folded > #menu-bar-sticky-conta
8787
.menu-title {
8888
display: inline-block;
8989
font-weight: 200;
90-
font-size: 20px;
90+
font-size: 2rem;
9191
line-height: var(--menu-bar-height);
9292
text-align: center;
9393
margin: 0;

src/theme/css/general.css

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,11 @@
22

33
@import 'variables.css';
44

5+
:root {
6+
/* Browser default font-size is 16px, this way 1 rem = 10px */
7+
font-size: 62.5%;
8+
}
9+
510
html {
611
font-family: "Open Sans", sans-serif;
712
color: var(--fg);
@@ -11,7 +16,7 @@ html {
1116

1217
body {
1318
margin: 0;
14-
font-size: 1rem;
19+
font-size: 1.6rem;
1520
overflow-x: hidden;
1621
}
1722

0 commit comments

Comments
 (0)