Change header sizes

+ Remove header size adjustment on mobile
+ Header sizes follow the traditional typographic scale, making larger heading sizes easier to differentiate visually.
This commit is contained in:
Nate Berkopec 2016-12-14 14:16:09 -07:00 committed by GitHub
parent 7830ade726
commit 4bdd426775

View File

@ -21,29 +21,23 @@ h6
margin-top: 0
h1
font-size: 4.0rem
line-height: 1.2
h2
font-size: 3.6rem
line-height: 1.25
h3
font-size: 3.0rem
line-height: 1.3
h4
font-size: 2.4rem
letter-spacing: -.08rem
line-height: 1.35
h5
font-size: 1.8rem
letter-spacing: -.05rem
line-height: 1.5
h6
font-size: 1.6rem
letter-spacing: 0
line-height: 1.4
@ -51,19 +45,19 @@ h6
@media (min-width: 40.0rem) // Safari desktop has a bug using `rem`, but Safari mobile works
h1
font-size: 5.0rem
font-size: 4.8rem
h2
font-size: 4.2rem
h3
font-size: 3.6rem
h4
font-size: 3.0rem
h5
h3
font-size: 2.4rem
h4
font-size: 2.1rem
h5
font-size: 1.8rem
h6
font-size: 1.5rem
font-size: 1.4rem