From 820714a560e68532b45dd65fb2a0ff31f8032003 Mon Sep 17 00:00:00 2001 From: Rostislav Date: Sun, 27 Oct 2019 15:51:32 +0100 Subject: [PATCH] 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. --- src/theme/css/chrome.css | 2 +- src/theme/css/general.css | 7 ++++++- 2 files changed, 7 insertions(+), 2 deletions(-) diff --git a/src/theme/css/chrome.css b/src/theme/css/chrome.css index 02d0dced..3ff59926 100644 --- a/src/theme/css/chrome.css +++ b/src/theme/css/chrome.css @@ -87,7 +87,7 @@ html:not(.sidebar-visible) #menu-bar:not(:hover).folded > #menu-bar-sticky-conta .menu-title { display: inline-block; font-weight: 200; - font-size: 20px; + font-size: 2rem; line-height: var(--menu-bar-height); text-align: center; margin: 0; diff --git a/src/theme/css/general.css b/src/theme/css/general.css index 336b5a5d..e0bb8514 100644 --- a/src/theme/css/general.css +++ b/src/theme/css/general.css @@ -2,6 +2,11 @@ @import 'variables.css'; +:root { + /* Browser default font-size is 16px, this way 1 rem = 10px */ + font-size: 62.5%; +} + html { font-family: "Open Sans", sans-serif; color: var(--fg); @@ -11,7 +16,7 @@ html { body { margin: 0; - font-size: 1rem; + font-size: 1.6rem; overflow-x: hidden; }