From 2f488b22501f9ce2d54d1d571496415494bd484d Mon Sep 17 00:00:00 2001
From: Rostislav Raykov <z@zbrox.org>
Date: Thu, 28 Mar 2019 11:47:54 +0100
Subject: [PATCH] Use only relative font sizes

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  | 4 ++--
 src/theme/css/general.css | 7 ++++++-
 2 files changed, 8 insertions(+), 3 deletions(-)

diff --git a/src/theme/css/chrome.css b/src/theme/css/chrome.css
index 0ab1686960..086301539d 100644
--- a/src/theme/css/chrome.css
+++ b/src/theme/css/chrome.css
@@ -85,8 +85,8 @@ html:not(.sidebar-visible) #menu-bar:not(:hover).folded > #menu-bar-sticky-conta
 .menu-title {
     display: inline-block;
     font-weight: 200;
-    font-size: 20px;
-    line-height: 50px;
+    font-size: 2rem;
+    line-height: 5rem;
     text-align: center;
     margin: 0;
     flex: 1;
diff --git a/src/theme/css/general.css b/src/theme/css/general.css
index aedfb332b7..c98898714d 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;
 }