Merge pull request #2352 from insectengine/typographyspec-adjustment

refactor h1-h6 & p tag sizes and line heights

Author: insectengine

_sass/quarkus.scss

@@ -18,11 +18,11 @@ body {
 
 h1 {
   font-size: 3rem;
-  line-height: 3.75rem;
+  line-height: 4.285rem;
   font-weight: 700;
   @media screen and (max-width: 1366px) {
     font-size: 2.5rem;
-    line-height: 2.75rem;
+    line-height: 3.571rem;
   }
   @media screen and (max-width: 768px) {
     font-size: 1.5rem;
@@ -31,62 +31,78 @@ h1 {
 }
 
 h2 {
-  font-size: 2rem;
-  line-height: 2.5rem;
+  font-size: 2.25rem;
+  line-height: 3.214rem;
   font-weight: 400;
   @media screen and (max-width: 1366px) {
     font-size: 1.75rem;
     line-height: 2.25rem;
   }
   @media screen and (max-width: 768px) {
     font-size: 1.5rem;
-    line-height: 2rem;
+    line-height: 2.142rem;
   }
 }
 
 h3 {
-  font-size: 1.5rem;
-  line-height: 1.8rem;
+  font-size: 1.875rem;
+  line-height: 2.678rem;
   font-weight: 400;
   @media screen and (max-width: 1366px) {
     font-size: 1.4rem;
-    line-height: 1.7rem;
+    line-height: 1.999rem;
   }
   @media screen and (max-width: 768px) {
     font-size: 1.2rem;
-    line-height: 1.5rem;
+    line-height: 1.714rem;
   }
 }
 
 h4 {
-  font-size: 1.125rem;
-  line-height: 1.6rem;
+  font-size: 1.5rem;
+  line-height: 2.142rem;
   font-weight: 400;
   @media screen and (max-width: 1366px) {
     font-size: 1.3rem;
-    line-height: 1.5rem;
+    line-height: 1.857rem;
   }
   @media screen and (max-width: 768px) {
     font-size: 1.125rem;
-    line-height: 1.4rem;
+    line-height: 1.607rem;
   }
 }
 
 h5 {
-  font-size: 1.125rem;
-  line-height: 1.5rem;
-  font-weight: 700;
+  font-size: 1.25rem;
+  line-height: 1.785rem;
+  font-weight: 400;
+    @media screen and (max-width: 1366px) {
+    font-size: 1.11rem;
+    line-height: 1.585rem;
+  }
+  @media screen and (max-width: 768px) {
+    font-size: 1.11rem;
+    line-height: 1.581rem;
+  }
 }
 
 h6 {
-  font-size: 1rem;
-  line-height: 1.25rem;
-  font-weight: 700;
+  font-size: 1.125rem;
+  line-height: 1.607rem;
+  font-weight: 400;
+      @media screen and (max-width: 1366px) {
+    font-size: 1.06rem;
+    line-height: 1.585rem;
+  }
+  @media screen and (max-width: 768px) {
+    font-size: 1.06rem;
+    line-height: 1.514rem;
+  }
 }
 
 p {
   font-size: 1rem;
-  line-height: 1.5rem;
+  line-height: 1.607rem;
   margin: 0 0 1.5rem;
   font-weight: 400;
   code {
@@ -117,8 +133,6 @@ ul li:last-child p:last-child {
 }
 
 a {
-  line-height: 1.5rem;
-  font-weight: 400;
   cursor: pointer;
   text-decoration: underline;
   color: var(--link-color);