typography fixes

pages/markdown.md

@@ -6,6 +6,11 @@ page-header: Markdown
 
 # Who's that then?
 
+Payment providers  
+Enable and manage your store's  
+payment providers
+
+
 Well, she turned me into a newt. Burn her! We want a shrubbery!! Well, I got better. Listen. Strange women lying in ponds distributing swords is no basis for a system of government. Supreme executive power derives from a mandate from the masses, not from some farcical aquatic ceremony.
 
 Listen. __Strange women lying in ponds distributing swords is no basis for a system of government.__ *Supreme executive power derives from a mandate from the masses, not from some farcical aquatic ceremony.* The swallow may fly south with the sun, and the house martin or the plover may seek warmer climes in winter, yet these are not strangers to our land.
@@ -34,6 +39,26 @@ Shut up! …Are you suggesting that coconuts migrate? I'm not a witch. Well, we
 
 Well, how'd you become king, then? Shut up! Ni! Ni! Ni! Ni! Well, Mercia's a temperate zone! I don't want to talk to you no more, you empty-headed animal food trough water! I fart in your general direction! Your mother was a hamster and your father smelt of elderberries! Now leave before I am forced to taunt you a second time!
 
+```scss
+$colors: (
+  "blue": $blue,
+  "azure": $azure,
+  "indigo": $indigo,
+  "purple": $purple,
+  "pink": $pink,
+  "red": $red,
+  "orange": $orange,
+  "yellow": $yellow,
+  "lime": $lime,
+  "green": $green,
+  "teal": $teal,
+  "cyan": $cyan,
+  "gray": $gray-600,
+  "gray-dark": $gray-800,
+  "dark": $dark
+) !default;
+```
+
 You can't expect to wield supreme power just 'cause some watery tart threw a sword at you! You don't frighten us, English pig-dogs! Go and boil your bottoms, sons of a silly person! I blow my nose at you, so-called Ah-thoor Keeng, you and all your silly English K-n-n-n-n-n-n-n-niggits!
 
 What do you mean? Listen. Strange women lying in ponds distributing swords is no basis for a system of government. Supreme executive power derives from a mandate from the masses, not from some farcical aquatic ceremony.

scss/_variables.scss

@@ -143,15 +143,28 @@ $headings-font-weight: $font-weight-bold !default;
 $small-font-size: 87.5% !default;
 
 $h1-font-size: (28rem / 16) !default;
-$h2-font-size: (22rem / 16) !default;
-$h3-font-size: (18rem / 16) !default;
+$h1-line-height: (2rem/$h1-font-size) !default;
+
+$h2-font-size: (20rem / 16) !default;
+$h2-line-height: (2rem/$h2-font-size) !default;
+
+$h3-font-size: (16rem / 16) !default;
+$h3-line-height: (1.5rem/$h3-font-size) !default;
+
 $h4-font-size: $font-size-base !default;
+$h4-line-height: (1.25rem/$h4-font-size) !default;
+
 $h5-font-size: (12rem / 16) !default;
+$h5-line-height: (1rem/$h5-font-size) !default;
+
 $h6-font-size: (10rem / 16) !default;
+$h6-line-height: (.75rem/$h6-font-size) !default;
+
 
 $blockquote-font-size: $font-size-base !default;
 
-$code-font-size: $h6-font-size !default;
+$code-font-size: $h5-font-size !default;
+$code-line-height: 1.25rem !default;
 $code-color: $primary !default;
 
 $lead-font-size: $font-size-base !default;

scss/ui/_markdown.scss

@@ -17,17 +17,6 @@ Markdown
     }
   }
 
-  >h2 {
-    margin-bottom: 1rem;
-
-    &:before {
-      content: '';
-      padding-top: 1em;
-      margin-top: -1em;
-      display: block;
-    }
-  }
-
   >hr {
     @include media-breakpoint-up(md) {
       margin-top: 3em;

scss/ui/_type.scss

@@ -20,12 +20,35 @@ h6,
 .h4,
 .h5,
 .h6 {
-
   a {
     color: inherit;
   }
 }
 
+h1 {
+  line-height: $h1-line-height;
+}
+
+h2 {
+  line-height: $h2-line-height;
+}
+
+h3 {
+  line-height: $h3-line-height;
+}
+
+h4 {
+  line-height: $h4-line-height;
+}
+
+h5 {
+  line-height: $h5-line-height;
+}
+
+h6 {
+  line-height: $h6-line-height;
+}
+
 strong,
 .strong,
 b {
@@ -76,7 +99,7 @@ pre {
   overflow: auto;
   font-size: $code-font-size;
   hyphens: none;
-  line-height: $line-height-base;
+  line-height: $code-line-height;
   tab-size: 3;
   border-radius: $border-radius;
   white-space: pre-wrap;