From 9a1466d10f4d1bb708481f6ef65bc820abc68354 Mon Sep 17 00:00:00 2001
From: Marcel Schneider <marcel@webschneider.org>
Date: Wed, 29 Mar 2017 13:22:05 +0200
Subject: [PATCH] Make font sizes relative

---
 static/css/style.css | 38 ++++++++++++++++++--------------------
 1 file changed, 18 insertions(+), 20 deletions(-)

diff --git a/static/css/style.css b/static/css/style.css
index ad0c7bd..ddd926c 100644
--- a/static/css/style.css
+++ b/static/css/style.css
@@ -69,14 +69,14 @@ body {
 }
 
 h1 {
-    font-size: 30px;
+    font-size: 300%;
     letter-spacing: -1px;
     color: #222;
     font-weight: bold;
 }
 
 h2 {
-    font: italic 19px/1.3em Georgia,serif;
+    font: italic 200%/1.3em Georgia,serif;
     color: #bbb;
 }
 
@@ -135,7 +135,7 @@ nav.main-nav a {
     right: 6px;
     padding: 8px 12px;
     color: #5badf0;
-    font-size: 13px;
+    font-size: 80%;
     /*font-weight: bold;*/
     line-height: 1.35;
     border-radius: 3px;
@@ -219,7 +219,6 @@ em, i { font-style: italic; }
 
 
 .home h1 {
-    font-size: 30px;
     letter-spacing: -1px;
     color: #222;
     font-weight: bold;
@@ -239,7 +238,6 @@ em, i { font-style: italic; }
     margin-bottom: 20px;
     color: #222;
     font-weight: 300;
-    font-size: 200%;
 }
 
 .post h2 {
@@ -250,17 +248,17 @@ em, i { font-style: italic; }
 
 
 .post h2.headline {
-    /*font: italic 22px/1.3em Georgia,serif;*/
-    font: normal 13px/1.5em -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
     margin: -5px 0 40px 0;
     color: #b2b9be;
-    font-size: 13px;
-    text-transform: uppercase;
+    font-variant: small-caps;
+    font-size: 120%;
     letter-spacing: 2px;
-    /*margin-top: 15px;*/
     display: inline-block;
 }
 
+h2.headline > a { display: inline-block; }
+h2.headline > a:first-letter { text-transform: capitalize; }
+
 #post-list h2 {
     font: normal 17px/1.5em -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
     color: #aaa;
@@ -402,14 +400,14 @@ Post List
 #post-list a {
     color: #333;
     display: block;
-    font: bold 19px/1.7 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
+    font: bold 150%/1.7 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
 }
 
 #post-list .dates {
     float: right;
     position: relative;
     top: 1px;
-    font: 300 17px/1.8 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
+    font: 300 70%/1.8 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
     color: #bbb;
 }
 
@@ -450,7 +448,7 @@ Post List
 }
 
 #post-meta {
-    font-size: 13px;
+    font-size: 80%;
     font-weight: bold;
     line-height: 1.4;
     border-top: 1px solid #eee;
@@ -593,12 +591,12 @@ h2.month {
 
 #post-list.archive.readmore h3{
 
-    font: 400 20px -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
+    font: 400 140% -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
     margin-bottom: 30px;
 }
 
 #post-list.archive.readmore a{
-    font: 400 16px/1.6 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
+    font: 400 100%/1.6 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
     color: #5694f1;
 }
 
@@ -607,7 +605,7 @@ h2.month {
 }
 
 #post-list.archive.readmore .dates{
-    font: 300 16px/1.6 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
+    font: 300 100%/1.6 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
 }
 #sharing a.facebook {
     background: #4361b3;
@@ -639,10 +637,10 @@ h2.month {
 
     #post-list-footer { margin-top: 20px; padding-top: 40px; }
 
-    h1 { font-size: 26px; }
-    .post h2.headline { font-size: 13px; }
-    .post h1 { font-size:24px; }
-    .post h2 { font-size:20px; }
+    h1 { font-size: 180%; }
+    .post h2.headline { font-size: 100%; }
+    .post h1 { font-size:200%; }
+    .post h2 { font-size:130%; }
 }