From ad1ab12354671bf62e5fd81ba4954934c5534fd9 Mon Sep 17 00:00:00 2001
From: CJ Patoilo <cjpatoilo@gmail.com>
Date: Wed, 25 Jan 2017 05:58:14 -0300
Subject: [PATCH] Improvement in headings size

---
 src/_Typography.sass | 27 ++++++---------------------
 test/index.html      | 12 ++++++------
 2 files changed, 12 insertions(+), 27 deletions(-)

diff --git a/src/_Typography.sass b/src/_Typography.sass
index 4c3e05e..c87ab08 100644
--- a/src/_Typography.sass
+++ b/src/_Typography.sass
@@ -21,43 +21,28 @@ h6
 	margin-top: 0
 
 h1
+	font-size: 4.6rem
 	line-height: 1.2
 
 h2
+	font-size: 3.6rem
 	line-height: 1.25
 
 h3
+	font-size: 2.8rem
 	line-height: 1.3
 
 h4
+	font-size: 2.2rem
 	letter-spacing: -.08rem
 	line-height: 1.35
 
 h5
+	font-size: 1.8rem
 	letter-spacing: -.05rem
 	line-height: 1.5
 
 h6
+	font-size: 1.5rem
 	letter-spacing: 0
 	line-height: 1.4
-
-// Larger than mobile screen
-@media (min-width: 40.0rem) // Safari desktop has a bug using `rem`, but Safari mobile works
-
-	h1
-		font-size: 4.8rem
-
-	h2
-		font-size: 3.6rem
-
-	h3
-		font-size: 2.4rem
-
-	h4
-		font-size: 2.1rem
-
-	h5
-		font-size: 1.8rem
-
-	h6
-		font-size: 1.4rem
diff --git a/test/index.html b/test/index.html
index 7b1a2ee..f1f8e41 100644
--- a/test/index.html
+++ b/test/index.html
@@ -26,12 +26,12 @@
 				<div class="example">
 					<div class="row">
 						<div class="column">
-							<h1>Heading<span class="heading-font-size"> <code>&lt;h1&gt;</code> 5.0rem (50px)</span></h1>
-							<h2>Heading<span class="heading-font-size"> <code>&lt;h2&gt;</code> 4.2rem (42px)</span></h2>
-							<h3>Heading<span class="heading-font-size"> <code>&lt;h3&gt;</code> 3.6rem (36px)</span></h3>
-							<h4>Heading<span class="heading-font-size"> <code>&lt;h4&gt;</code> 3.0rem (30px)</span></h4>
-							<h5>Heading<span class="heading-font-size"> <code>&lt;h5&gt;</code> 2.4rem (24px)</span></h5>
-							<h6>Heading<span class="heading-font-size"> <code>&lt;h6&gt;</code> 1.5rem (15px)</span></h6>
+							<h1>Heading<span class="heading-font-size"> <code>&lt;h1&gt;</code> 4.6rem (46px)</span></h1>
+							<h2>Heading<span class="heading-font-size"> <code>&lt;h2&gt;</code> 3.6rem (36px)</span></h2>
+							<h3>Heading<span class="heading-font-size"> <code>&lt;h3&gt;</code> 2.8rem (28px)</span></h3>
+							<h4>Heading<span class="heading-font-size"> <code>&lt;h4&gt;</code> 2.2rem (22px)</span></h4>
+							<h5>Heading<span class="heading-font-size"> <code>&lt;h5&gt;</code> 1.8rem (18px)</span></h5>
+							<h6>Heading<span class="heading-font-size"> <code>&lt;h6&gt;</code> 1.6rem (16px)</span></h6>
 						</div>
 						<div class="column">
 							<p>Lorem ipsum dolor sit amet, <u>consectetur adipisicing elit</u>.</p>