From 671c340aa8eb94664ca1f501221bccd75b9ea0c6 Mon Sep 17 00:00:00 2001
From: Dominique Feyer <dfeyer@ttree.ch>
Date: Wed, 9 Jan 2019 17:46:03 +0100
Subject: [PATCH] Better header line height (#418)

This change also remote all units for line-height to have more consistent styles and better cascading support. This solve the too small line height for multi line header in article and also add styling for h1 to h6 (previously h3 to h6 was not styled at all)
---
 static/css/_article.scss |  4 ++--
 static/css/_forms.scss   |  2 +-
 static/css/_global.scss  | 28 ++++++++++++++++++++++------
 3 files changed, 25 insertions(+), 9 deletions(-)

diff --git a/static/css/_article.scss b/static/css/_article.scss
index b28de36b..dd268aaf 100644
--- a/static/css/_article.scss
+++ b/static/css/_article.scss
@@ -16,7 +16,7 @@ main article {
  	margin: 2.5em auto;
  	font-family: $lora;
  	font-size: 1.2em;
- 	line-height: 1.7em;
+ 	line-height: 1.7;
 
  	a:hover {
  	  text-decoration: underline;
@@ -260,7 +260,7 @@ main .article-meta {
        	padding: 1.25em 0;
        	font-family: $lora;
        	font-size: 1.1em;
-       	line-height: 1.4em;
+       	line-height: 1.4;
        	text-align: left;
       }
     }
diff --git a/static/css/_forms.scss b/static/css/_forms.scss
index ecc43beb..52e264b7 100644
--- a/static/css/_forms.scss
+++ b/static/css/_forms.scss
@@ -34,7 +34,7 @@ textarea {
 
  	font-family: $lora;
  	font-size: 1.1em;
- 	line-height: 1.5em;
+ 	line-height: 1.5;
 }
 
 input[type="checkbox"] {
diff --git a/static/css/_global.scss b/static/css/_global.scss
index a4f8f242..c48bf4c5 100644
--- a/static/css/_global.scss
+++ b/static/css/_global.scss
@@ -55,13 +55,20 @@ body > main > .h-entry, .h-feed {
 }
 
 main {
+  h1, h2, h3, h4, h5, h6 {
+      font-family: $route159;
+      line-height: 1.15;
+      font-weight: 300;
+
+      &.article {
+          max-width: 40rem;
+      }
+  }
   h1 {
-    font-family: $route159;
     font-size: 2.5em;
-    font-weight: 300;
+    margin-top: 1em;
 
     &.article {
-      max-width: 40rem;
      	margin: 1em auto 0.5em;
      	font-family: $playfair;
      	font-size: 2.5em;
@@ -70,18 +77,27 @@ main {
   }
 
   h2 {
-    font-family: $route159;
    	font-size: 1.75em;
    	font-weight: 300;
 
    	&.article {
-      max-width: 40rem;
       margin: auto;
       font-size: 1.25em;
       margin-bottom: 0.5em;
     }
   }
 
+  h3, h4, h5, h6 {
+      font-size: 1.5em;
+      font-weight: 300;
+
+      &.article {
+          margin: auto;
+          font-size: 1.1em;
+          margin-bottom: 0.5em;
+      }
+  }
+
   .cover {
     padding: 0px;
     margin: 0px;
@@ -175,7 +191,7 @@ p.error {
 
    	font-family: $lora;
    	font-size: 1em;
-   	line-height: 1.25em;
+   	line-height: 1.25;
    	text-align: left;
    	overflow: hidden;
   }