Theme.json: Add custom properties for Inter Heading font sizes (#164)

* Theme.json: Add custom properties for Inter Heading font sizes * Use new small sizes
WordPress · Dec 5, 2024 · 412f17d · 412f17d
1 parent 69b84e2
commit 412f17d
Show file tree

Hide file tree

Showing 2 changed files with 56 additions and 0 deletions.
diff --git a/source/wp-content/themes/wporg-parent-2021/sass/base/_normalize.scss b/source/wp-content/themes/wporg-parent-2021/sass/base/_normalize.scss
@@ -48,6 +48,10 @@ body[class] {
 		--wp--preset--font-size--heading-4: var(--wp--custom--heading--level-4--breakpoint--small-only--typography--font-size);
 		--wp--preset--font-size--heading-5: var(--wp--custom--heading--level-5--breakpoint--small-only--typography--font-size);
 		--wp--preset--font-size--heading-6: var(--wp--custom--heading--level-6--breakpoint--small-only--typography--font-size);
+		--wp--custom--heading--level-3--inter--typography--font-size: var(--wp--custom--heading--level-3--inter--breakpoint--small-only--typography--font-size);
+		--wp--custom--heading--level-4--inter--typography--font-size: var(--wp--custom--heading--level-4--inter--breakpoint--small-only--typography--font-size);
+		--wp--custom--heading--level-5--inter--typography--font-size: var(--wp--custom--heading--level-5--inter--breakpoint--small-only--typography--font-size);
+		--wp--custom--heading--level-6--inter--typography--font-size: var(--wp--custom--heading--level-6--inter--breakpoint--small-only--typography--font-size);
 		--wp--preset--font-size--extra-large: var(--wp--custom--body--extra-large--breakpoint--small-only--typography--font-size);
 
 		--wp--custom--heading--cta--typography--line-height: var(--wp--custom--heading--cta--breakpoint--small-only--typography--line-height);

diff --git a/source/wp-content/themes/wporg-parent-2021/theme.json b/source/wp-content/themes/wporg-parent-2021/theme.json
@@ -395,6 +395,19 @@
 								"lineHeight": 1.15
 							}
 						}
+					},
+					"inter": {
+						"typography": {
+							"fontSize": "29px",
+							"lineHeight": 1.4
+						},
+						"breakpoint": {
+							"small-only": {
+								"typography": {
+									"fontSize": "21px"
+								}
+							}
+						}
 					}
 				},
 				"level-4": {
@@ -408,6 +421,19 @@
 								"lineHeight": 1.09
 							}
 						}
+					},
+					"inter": {
+						"typography": {
+							"fontSize": "24px",
+							"lineHeight": 1.4
+						},
+						"breakpoint": {
+							"small-only": {
+								"typography": {
+									"fontSize": "19px"
+								}
+							}
+						}
 					}
 				},
 				"level-5": {
@@ -421,6 +447,19 @@
 								"lineHeight": 1.2
 							}
 						}
+					},
+					"inter": {
+						"typography": {
+							"fontSize": "20px",
+							"lineHeight": 1.4
+						},
+						"breakpoint": {
+							"small-only": {
+								"typography": {
+									"fontSize": "17px"
+								}
+							}
+						}
 					}
 				},
 				"level-6": {
@@ -434,6 +473,19 @@
 								"lineHeight": 1.22
 							}
 						}
+					},
+					"inter": {
+						"typography": {
+							"fontSize": "18px",
+							"lineHeight": 1.4
+						},
+						"breakpoint": {
+							"small-only": {
+								"typography": {
+									"fontSize": "16px"
+								}
+							}
+						}
 					}
 				}
 			},