Adjust heading font sizes (#687)

Author: reakaleek

docs/syntax/headings.md

@@ -6,34 +6,34 @@ You create a heading by adding number signs `#` in front of a word or phrase. Th
 
 ::::{tab-set}
 
-:::{tab-item} Markdown
+:::{tab-item} Output
 
-```markdown
 # Heading 1
+
 ## Heading 2
+
 ### Heading 3
+
 #### Heading 4
+
 ##### Heading 5
-###### Heading 6
 
-```
+###### Heading 6
 
 :::
 
-:::{tab-item} Output
+:::{tab-item} Markdown
 
+```markdown
 # Heading 1
-
 ## Heading 2
-
 ### Heading 3
-
 #### Heading 4
-
 ##### Heading 5
-
 ###### Heading 6
 
+```
+
 :::
 
 ::::
@@ -56,20 +56,20 @@ You will get a hyphened, lowercase, alphanumeric version of any string you pleas
 
 ::::{tab-set}
 
-:::{tab-item} Markdown
-
-```markdown
+:::{tab-item} Output
 
 #### Hello-World
 
-```
-
 :::
 
-:::{tab-item} Output
+:::{tab-item} Markdown
+
+```markdown
 
 #### Hello-World
 
+```
+
 :::
 
 ::::
@@ -81,20 +81,20 @@ You can also specify a custom anchor link using the following syntax.
 
 ::::{tab-set}
 
-:::{tab-item} Markdown
-
-```markdown
+:::{tab-item} Output
 
 #### Heading [custom-anchor]
 
-```
-
 :::
 
-:::{tab-item} Output
+:::{tab-item} Markdown
+
+```markdown
 
 #### Heading [custom-anchor]
 
+```
+
 :::
 
 ::::

src/Elastic.Markdown/Assets/markdown/typography.css

@@ -3,40 +3,39 @@
 	@apply text-ink text-base font-body;
 
 	h1 {
-		@apply text-4xl text-ink-dark font-semibold;
+		@apply text-5xl text-ink-dark font-semibold;
 		line-height: 1.2em;
-		letter-spacing: -0.04em;
 	}
 
 	h2 {
 
-		@apply text-2xl text-ink-dark font-bold mt-10;
+		@apply text-4xl text-ink-dark font-bold mt-10;
 		line-height: 1.2em;
-		letter-spacing: -0.02em;
+		letter-spacing: -0.04em;
 	}
 
 	h3 {
-		@apply text-xl text-ink-dark font-bold mt-8;
+		@apply text-2xl text-ink-dark font-bold mt-8;
 		line-height: 1.2em;
-		letter-spacing: -0.02em;
+		letter-spacing: -0.04em;
 	}
 
 	h4 {
-		@apply text-base text-ink-dark font-bold mt-8;
+		@apply text-xl text-ink-dark font-bold mt-8;
 		line-height: 1.2em;
-		letter-spacing: -0.02em;
+		letter-spacing: -0.04em;
 	}
 
 	h5 {
-		@apply text-sm text-ink-dark font-bold mt-8;
+		@apply text-base text-ink-dark font-bold mt-8;
 		line-height: 1.2em;
-		letter-spacing: -0.02em;
+		letter-spacing: -0.04em;
 	}
 
 	h6 {
-		@apply text-xs text-ink-dark font-bold mt-8;
+		@apply text-sm text-ink-dark font-bold mt-8;
 		line-height: 1.2em;
-		letter-spacing: -0.02em;
+		letter-spacing: -0.04em;
 	}
 
 	h1, h2, h3, h4, h5, h6 {