add line heights to typography

Author: anattzlil

styles/typography.scss

@@ -2,60 +2,79 @@
 
 //based on 1rem = 16px
 
+//font sizes
 $fontsize-1: 2.25rem; //36px
 $fontsize-2: 2rem; //32px
 $fontsize-3: 1.5rem; //24px
 $fontsize-4: 1.25rem; //20px
 $fontsize-5: 1rem; //16px
 $fontsize-6: 0.875rem; //14px
 
+//line heights
+$lineheight-1: 3rem; //48px
+$lineheight-2: 2.625rem; //42px
+$lineheight-3: 2rem; //32px
+$lineheight-4: 1.625rem; //26px
+$lineheight-5: 1.3125rem; //21px
+$lineheight-6: 1.125rem; //18px
+
 .heading-one {
   font-size: $fontsize-1;
+  line-height: $lineheight-1;
   font-weight: 800;
 }
 
 .heading-two {
   font-size: $fontsize-2;
+  line-height: $lineheight-2;
   font-weight: 800;
 }
 
 .heading-three {
   font-size: $fontsize-3;
+  line-height: $lineheight-3;
   font-weight: 700;
 }
 
 .heading-four {
   font-size: $fontsize-4;
+  line-height: $lineheight-4;
   font-weight: 700;
 }
 
 .subheading-one {
   font-size: $fontsize-1;
+  line-height: $lineheight-1;
   font-weight: 400;
 }
 
 .subheading-two {
   font-size: $fontsize-2;
+  line-height: $lineheight-2;
   font-weight: 400;
 }
 
 .body-one {
   font-size: $fontsize-4;
+  line-height: $lineheight-4;
   font-weight: 400;
 }
 
 .body-two {
   font-size: $fontsize-3;
+  line-height: $lineheight-3;
   font-weight: 400;
 }
 
 .small-text {
   font-size: $fontsize-5;
+  line-height: $lineheight-5;
   font-weight: 400;
 }
 
 .overline {
   font-size: $fontsize-6;
+  line-height: $lineheight-6;
   font-weight: 700;
   text-transform: uppercase;
 }