Explorar o código

Refactor Blockbase font definitions (#4077)

* Refactor Blockbase Font Family Handling

Refactor Blockbase so that the font family provided is
DESCRIPTIVE instead of semantic.

Leverated SEMANTIC font family variables defined in custom
to assign to blocks.

(In this way USERS will see DESCRIPTIVE font family values to choose
from and theme configuration can use semantic values that can be
overridden by things such as the WP.com Font Picker)

* standardized line-height usage in quadrat and blockbase

* Refactored mayland configuration with font family and line height changes from blockbase

* Changes to Seedlet-blocks to support the font-face refactor
Jason Crist %!s(int64=4) %!d(string=hai) anos
pai
achega
d23f690a26

+ 3 - 3
blockbase/assets/ponyfill.css

@@ -176,7 +176,7 @@ textarea {
 	border-radius: var(--wp--custom--form--border--radius);
 	box-shadow: var(--wp--custom--form--color--box-shadow);
 	color: var(--wp--custom--form--color--text);
-	font-family: var(--wp--preset--font-family--base);
+	font-family: var(--wp--custom--body--typography--font-family);
 	padding: var(--wp--custom--form--padding);
 }
 
@@ -334,8 +334,8 @@ input[type=checkbox] + label {
 
 ul,
 ol {
-	font-family: var(--wp--custom--list--font-family);
-	padding-left: var(--wp--custom--list--padding--left);
+	font-family: var(--wp--custom--list--typography--font-family);
+	padding-left: var(--wp--custom--list--spacing--padding--left);
 }
 
 .wp-block-navigation.is-responsive .wp-block-navigation__responsive-container.is-menu-open {

+ 2 - 2
blockbase/sass/blocks/_list.scss

@@ -1,5 +1,5 @@
 ul,
 ol {
-	font-family: var(--wp--custom--list--font-family);
-	padding-left: var(--wp--custom--list--padding--left);
+	font-family: var(--wp--custom--list--typography--font-family);
+	padding-left: var(--wp--custom--list--spacing--padding--left);
 }

+ 1 - 1
blockbase/sass/elements/_forms.scss

@@ -19,7 +19,7 @@ textarea {
 	border-radius: var(--wp--custom--form--border--radius);
 	box-shadow: var(--wp--custom--form--color--box-shadow);
 	color: var(--wp--custom--form--color--text);
-	font-family: var(--wp--preset--font-family--base);
+	font-family: var(--wp--custom--body--typography--font-family);
 	padding: var(--wp--custom--form--padding);
 
 	&:focus {

+ 23 - 16
blockbase/theme.json

@@ -98,7 +98,7 @@
 					}
 				},
 				"typography": {
-					"fontFamily": "var(--wp--preset--font-family--base)",
+					"fontFamily": "var(--wp--custom--body--typography--font-family)",
 					"fontSize": "var(--wp--preset--font-size--normal)",
 					"fontWeight": "normal",
 					"lineHeight": 2
@@ -143,16 +143,27 @@
 					"fontSize": "var(--wp--preset--font-size--small)"
 				}
 			},
+			"body": {
+				"typography": {
+					"fontFamily": "var(--wp--preset--font-family--segoe-ui)",
+					"lineHeight": 1.6
+				}
+			},
 			"heading": {
 				"typography": {
+					"fontFamily": "var(--wp--preset--font-family--segoe-ui)",
 					"fontWeight": 400,
 					"lineHeight": 1.125
 				}
 			},
 			"list": {
-				"fontFamily": "var(--wp--custom--font-family--base)",
-				"padding": {
-					"left": "calc( 2 * var(--wp--custom--margin--horizontal) )"
+				"typography": {
+					"fontFamily": "var(--wp--custom--body--typography--font-family)"
+				},
+				"spacing": {
+					"padding": {
+						"left": "calc( 2 * var(--wp--custom--margin--horizontal) )"
+					}
 				}
 			},
 			"margin": {
@@ -164,7 +175,7 @@
 				"dropcap": {
 					"margin": ".1em .1em 0 0",
 					"typography": {
-						"fontFamily": "var(--wp--preset--font-family--base)",
+						"fontFamily": "var(--wp--custom--body--typography--font-family)",
 						"fontSize": "110px",
 						"fontWeight": "400"
 					}
@@ -248,14 +259,9 @@
 			"customLineHeight": true,
 			"fontFamilies": [
 				{
-					"fontFamily": "var(--font-base, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen-Sans, Ubuntu, Cantarell, 'Helvetica Neue', sans-serif)",
-					"slug": "base",
-					"name": "Base"
-				},
-				{
-					"fontFamily": "var(--font-headings, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen-Sans, Ubuntu, Cantarell, 'Helvetica Neue', sans-serif)",
-					"slug": "headings",
-					"name": "Headings"
+					"fontFamily": "-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen-Sans, Ubuntu, Cantarell, 'Helvetica Neue', sans-serif",
+					"slug": "segoe-ui",
+					"name": "Segoe UI"
 				}
 			],
 			"fontSizes": [
@@ -322,7 +328,7 @@
 			},
 			"core/heading": {
 				"typography": {
-					"fontFamily": "var(--wp--preset--font-family--headings)",
+					"fontFamily": "var(--wp--custom--heading--typography--font-family)",
 					"fontWeight": "var(--wp--custom--heading--typography--font-weight)",
 					"lineHeight": "var(--wp--custom--heading--typography--line-height)"
 				}
@@ -347,6 +353,7 @@
 			},
 			"core/post-title": {
 				"typography": {
+					"fontFamily": "var(--wp--custom--heading--typography--font-family)",
 					"fontSize": "var(--wp--preset--font-size--huge)",
 					"lineHeight": "var(--wp--custom--heading--typography--line-height)"
 				}
@@ -453,8 +460,8 @@
 			}
 		},
 		"typography": {
-			"lineHeight": 1.6,
-			"fontFamily": "var(--wp--preset--font-family--base)",
+			"lineHeight": "var(--wp--custom--body--typography--line-height)",
+			"fontFamily": "var(--wp--custom--body--typography--font-family)",
 			"fontSize": "var(--wp--preset--font-size--normal)"
 		}
 	}

+ 13 - 23
mayland-blocks/child-theme.json

@@ -56,7 +56,7 @@
 				},
 				"color": {
 					"text": "var(--wp--custom--color--background)",
-					"background": "var(--wp--custom--color--foreground)"
+					"background": "var(--wp--custom--color--primary)"
 				},
 				"spacing": {
 					"padding": {
@@ -81,15 +81,17 @@
 			"fontsToLoadFromGoogle": [
 				"family=Poppins:ital,wght@0,400;0,600;1,400"
 			],
+			"body": {
+				"typography": {
+					"fontFamily": "var(--wp--preset--font-family--poppins)"
+				}
+			},
 			"heading": {
 				"typography": {
+					"fontFamily": "var(--wp--preset--font-family--poppins)",
 					"fontWeight": 600
 				}
 			},
-			"line-height": {
-				"body": 1.6,
-				"headings": 1.125
-			},
 			"margin": {
 				"horizontal": "32px"
 			},
@@ -112,7 +114,7 @@
 			"fontFamilies": [
 				{
 					"fontFamily": "\"Poppins\", sans-serif",
-					"slug": "base",
+					"slug": "poppins",
 					"name": "Poppins"
 				},
 				{
@@ -163,23 +165,16 @@
 	},
 	"styles": {
 		"blocks": {
-			"core/button": {
-				"color": {
-					"background": "var(--wp--custom--color--primary)"
-				}
-			},
-			"core/heading": {
-				"typography": {
-					"fontFamily": "var(--wp--preset--font-family--base)",
-					"lineHeight": "var(--wp--custom--line-height--headings)"
-				}
-			},
 			"core/navigation": {
 				"typography": {
 					"fontSize": "var(--wp--preset--font-size--small)"
 				}
 			},
 			"core/post-date": {
+				"color": {
+					"link": null,
+					"text": null 
+				},
 				"typography": {
 					"fontSize": "var(--wp--preset--font-size--small)"
 				}
@@ -187,7 +182,7 @@
 			"core/post-title": {
 				"typography": {
 					"fontSize": "var(--wp--preset--font-size--huge)",
-					"lineHeight": "var(--wp--custom--line-height--headings)"
+					"lineHeight": "var(--wp--custom--heading--typography--line-height)"
 				}
 			},
 			"core/site-title": {
@@ -236,11 +231,6 @@
 					"text": "var(--wp--custom--color--foreground)"
 				}
 			}
-		},
-		"typography": {
-			"fontFamily": "var(--wp--preset--font-family--base)",
-			"fontSize": "var(--wp--preset--font-size--normal)",
-			"lineHeight": "var(--wp--custom--line-height--body)"
 		}
 	}
 }

+ 27 - 19
mayland-blocks/theme.json

@@ -85,7 +85,7 @@
 					"width": "2px"
 				},
 				"color": {
-					"background": "var(--wp--custom--color--foreground)",
+					"background": "var(--wp--custom--color--primary)",
 					"text": "var(--wp--custom--color--background)"
 				},
 				"hover": {
@@ -106,7 +106,7 @@
 					}
 				},
 				"typography": {
-					"fontFamily": "var(--wp--preset--font-family--base)",
+					"fontFamily": "var(--wp--custom--body--typography--font-family)",
 					"fontSize": "var(--wp--preset--font-size--small)",
 					"fontWeight": 600,
 					"lineHeight": 2
@@ -151,16 +151,27 @@
 					"fontSize": "var(--wp--preset--font-size--small)"
 				}
 			},
+			"body": {
+				"typography": {
+					"fontFamily": "var(--wp--preset--font-family--poppins)",
+					"lineHeight": 1.6
+				}
+			},
 			"heading": {
 				"typography": {
+					"fontFamily": "var(--wp--preset--font-family--poppins)",
 					"fontWeight": 600,
 					"lineHeight": 1.125
 				}
 			},
 			"list": {
-				"fontFamily": "var(--wp--custom--font-family--base)",
-				"padding": {
-					"left": "calc( 2 * var(--wp--custom--margin--horizontal) )"
+				"typography": {
+					"fontFamily": "var(--wp--custom--body--typography--font-family)"
+				},
+				"spacing": {
+					"padding": {
+						"left": "calc( 2 * var(--wp--custom--margin--horizontal) )"
+					}
 				}
 			},
 			"margin": {
@@ -172,7 +183,7 @@
 				"dropcap": {
 					"margin": ".1em .1em 0 0",
 					"typography": {
-						"fontFamily": "var(--wp--preset--font-family--base)",
+						"fontFamily": "var(--wp--custom--body--typography--font-family)",
 						"fontSize": "110px",
 						"fontWeight": "400"
 					}
@@ -239,10 +250,6 @@
 			"fontsToLoadFromGoogle": [
 				"family=Poppins:ital,wght@0,400;0,600;1,400"
 			],
-			"line-height": {
-				"body": 1.6,
-				"headings": 1.125
-			},
 			"width": {
 				"default": "750px",
 				"wide": "1022px"
@@ -268,7 +275,7 @@
 			"fontFamilies": [
 				{
 					"fontFamily": "\"Poppins\", sans-serif",
-					"slug": "base",
+					"slug": "poppins",
 					"name": "Poppins"
 				},
 				{
@@ -324,7 +331,7 @@
 					"radius": "var(--wp--custom--button--border--radius)"
 				},
 				"color": {
-					"background": "var(--wp--custom--color--primary)",
+					"background": "var(--wp--custom--button--color--background)",
 					"text": "var(--wp--custom--button--color--text)"
 				},
 				"typography": {
@@ -352,9 +359,9 @@
 			},
 			"core/heading": {
 				"typography": {
-					"fontFamily": "var(--wp--preset--font-family--base)",
+					"fontFamily": "var(--wp--custom--heading--typography--font-family)",
 					"fontWeight": "var(--wp--custom--heading--typography--font-weight)",
-					"lineHeight": "var(--wp--custom--line-height--headings)"
+					"lineHeight": "var(--wp--custom--heading--typography--line-height)"
 				}
 			},
 			"core/navigation": {
@@ -377,14 +384,15 @@
 			},
 			"core/post-title": {
 				"typography": {
+					"fontFamily": "var(--wp--custom--heading--typography--font-family)",
 					"fontSize": "var(--wp--preset--font-size--huge)",
-					"lineHeight": "var(--wp--custom--line-height--headings)"
+					"lineHeight": "var(--wp--custom--heading--typography--line-height)"
 				}
 			},
 			"core/post-date": {
 				"color": {
-					"link": "var(--wp--custom--color--foreground)",
-					"text": "var(--wp--custom--color--foreground)"
+					"link": null,
+					"text": null
 				},
 				"typography": {
 					"fontSize": "var(--wp--preset--font-size--small)"
@@ -483,8 +491,8 @@
 			}
 		},
 		"typography": {
-			"lineHeight": "var(--wp--custom--line-height--body)",
-			"fontFamily": "var(--wp--preset--font-family--base)",
+			"lineHeight": "var(--wp--custom--body--typography--line-height)",
+			"fontFamily": "var(--wp--custom--body--typography--font-family)",
 			"fontSize": "var(--wp--preset--font-size--normal)"
 		}
 	}

+ 2 - 2
quadrat/assets/theme.css

@@ -211,7 +211,7 @@ ul ul {
 
 .wp-block-post-comments {
 	font-size: var(--wp--preset--font-size--normal);
-	line-height: var(--wp--custom--line-height--body);
+	line-height: var(--wp--custom--body--typography--line-height);
 }
 
 .wp-block-post-comments .reply a {
@@ -344,7 +344,7 @@ ul ul {
 
 .wp-block-post-comments .commentlist .comment p {
 	font-size: var(--wp--preset--font-size--normal);
-	line-height: var(--wp--custom--line-height--body);
+	line-height: var(--wp--custom--body--typography--line-height);
 }
 
 .wp-block-post-comments .comment-body > p > a,

+ 17 - 35
quadrat/child-theme.json

@@ -62,8 +62,15 @@
 				},
 				"padding": "20px"
 			},
+			"body": {
+				"typography": {
+					"fontFamily": "var(--wp--preset--font-family--dm-sans)",
+					"lineHeight": 1.7
+				}
+			},
 			"heading": {
 				"typography": {
+					"fontFamily": "var(--wp--preset--font-family--dm-sans)",
 					"fontWeight": "500"
 				},
 				"h1": {
@@ -74,20 +81,7 @@
 				}
 			},
 			"line-height": {
-				"body": 1.7,
-				"headings": {
-					"h1": 1.2,
-					"h2": 1.2,
-					"h3": 1.2,
-					"h4": 1.4,
-					"h5": 1.4,
-					"h6": 1.4
-				}
-			},
-			"list": {
-				"padding": {
-					"left": "calc( 2 * var(--wp--custom--margin--horizontal) )"
-				}
+				"body": 1.7
 			},
 			"margin": {
 				"horizontal": "20px",
@@ -146,13 +140,8 @@
 			"fontFamilies": [
 				{
 					"fontFamily": "\"DM Sans\", sans-serif",
-					"slug": "base",
+					"slug": "dm-sans",
 					"name": "DM Sans"
-				},
-				{
-					"fontFamily": "-apple-system,BlinkMacSystemFont,\"Segoe UI\",Roboto,Oxygen-Sans,Ubuntu,Cantarell,\"Helvetica Neue\",sans-serif",
-					"slug": "system-font",
-					"name": "System Font"
 				}
 			],
 			"fontSizes": [
@@ -214,11 +203,6 @@
 					"lineHeight": "1.6"
 				}
 			},
-			"core/heading": {
-				"typography": {
-					"fontFamily": "var(--wp--preset--font-family--base)"
-				}
-			},
 			"core/navigation": {
 				"typography": {
 					"fontSize": "18px"
@@ -234,7 +218,7 @@
 				"typography": {
 					"fontSize": "var(--wp--custom--heading--h1--font-size)",
 					"fontWeight": "var(--wp--custom--heading--typography--font-weight)",
-					"lineHeight": "var(--wp--custom--line-height--headings--h1)"
+					"lineHeight": 1.2
 				}
 			},
 			"list": {
@@ -300,37 +284,37 @@
 			"h1": {
 				"typography": {
 					"fontSize": "var(--wp--custom--heading--h1--font-size)",
-					"lineHeight": "var(--wp--custom--line-height--headings--h1)"
+					"lineHeight": 1.2
 				}
 			},
 			"h2": {
 				"typography": {
 					"fontSize": "min(max(36px, 6vw), 65px)",
-					"lineHeight": "var(--wp--custom--line-height--headings--h2)"
+					"lineHeight": 1.2
 				}
 			},
 			"h3": {
 				"typography": {
 					"fontSize": "var(--wp--custom--heading--h3--font-size)",
-					"lineHeight": "var(--wp--custom--line-height--headings--h3)"
+					"lineHeight": 1.2
 				}
 			},
 			"h4": {
 				"typography": {
 					"fontSize": "20px",
-					"lineHeight": "var(--wp--custom--line-height--headings--h4)"
+					"lineHeight": 1.4
 				}
 			},
 			"h5": {
 				"typography": {
 					"fontSize": "18px",
-					"lineHeight": "var(--wp--custom--line-height--headings--h5)"
+					"lineHeight": 1.4
 				}
 			},
 			"h6": {
 				"typography": {
 					"fontSize": "16px",
-					"lineHeight": "var(--wp--custom--line-height--headings--h6)"
+					"lineHeight": 1.4
 				}
 			},
 			"link": {
@@ -340,9 +324,7 @@
 			}
 		},
 		"typography": {
-			"fontSize": "var(--wp--preset--font-size--normal)",
-			"fontWeight": "400",
-			"lineHeight": "var(--wp--custom--line-height--body)"
+			"fontWeight": "400"
 		},
 		"core/site-logo": {
 			"spacing": {

+ 2 - 2
quadrat/sass/blocks/_post-comments.scss

@@ -3,7 +3,7 @@
 .wp-block-post-comments {
 
 	font-size: var(--wp--preset--font-size--normal);
-	line-height: var(--wp--custom--line-height--body);
+	line-height: var(--wp--custom--body--typography--line-height);
 
 	.reply a {
 		--wp--custom--button--typography--font-size: var(--wp--preset--font-size--normal);
@@ -127,7 +127,7 @@
 		.comment {
 			p {
 				font-size: var(--wp--preset--font-size--normal);
-				line-height: var(--wp--custom--line-height--body);
+				line-height: var(--wp--custom--body--typography--line-height);
 			}
 		}
 	}

+ 29 - 30
quadrat/theme.json

@@ -88,7 +88,7 @@
 					}
 				},
 				"typography": {
-					"fontFamily": "var(--wp--preset--font-family--base)",
+					"fontFamily": "var(--wp--custom--body--typography--font-family)",
 					"fontSize": "20px",
 					"fontWeight": "700",
 					"lineHeight": 2
@@ -133,8 +133,15 @@
 					"fontSize": "var(--wp--preset--font-size--small)"
 				}
 			},
+			"body": {
+				"typography": {
+					"fontFamily": "var(--wp--preset--font-family--dm-sans)",
+					"lineHeight": 1.7
+				}
+			},
 			"heading": {
 				"typography": {
+					"fontFamily": "var(--wp--preset--font-family--dm-sans)",
 					"fontWeight": "500",
 					"lineHeight": 1.125
 				},
@@ -146,9 +153,13 @@
 				}
 			},
 			"list": {
-				"fontFamily": "var(--wp--custom--font-family--base)",
-				"padding": {
-					"left": "calc( 2 * var(--wp--custom--margin--horizontal) )"
+				"typography": {
+					"fontFamily": "var(--wp--custom--body--typography--font-family)"
+				},
+				"spacing": {
+					"padding": {
+						"left": "calc( 2 * var(--wp--custom--margin--horizontal) )"
+					}
 				}
 			},
 			"margin": {
@@ -160,7 +171,7 @@
 				"dropcap": {
 					"margin": "0 .2em .2em 0",
 					"typography": {
-						"fontFamily": "var(--wp--preset--font-family--base)",
+						"fontFamily": "var(--wp--custom--body--typography--font-family)",
 						"fontSize": "var(--wp--preset--font-size--huge)",
 						"fontWeight": "400"
 					}
@@ -229,15 +240,7 @@
 				"family=DM+Sans:ital,wght@0,400;0,500;0,700;1,400;1,500;1,700"
 			],
 			"line-height": {
-				"body": 1.7,
-				"headings": {
-					"h1": 1.2,
-					"h2": 1.2,
-					"h3": 1.2,
-					"h4": 1.4,
-					"h5": 1.4,
-					"h6": 1.4
-				}
+				"body": 1.7
 			}
 		},
 		"layout": {
@@ -260,13 +263,8 @@
 			"fontFamilies": [
 				{
 					"fontFamily": "\"DM Sans\", sans-serif",
-					"slug": "base",
+					"slug": "dm-sans",
 					"name": "DM Sans"
-				},
-				{
-					"fontFamily": "-apple-system,BlinkMacSystemFont,\"Segoe UI\",Roboto,Oxygen-Sans,Ubuntu,Cantarell,\"Helvetica Neue\",sans-serif",
-					"slug": "system-font",
-					"name": "System Font"
 				}
 			],
 			"fontSizes": [
@@ -346,7 +344,7 @@
 			},
 			"core/heading": {
 				"typography": {
-					"fontFamily": "var(--wp--preset--font-family--base)",
+					"fontFamily": "var(--wp--custom--heading--typography--font-family)",
 					"fontWeight": "var(--wp--custom--heading--typography--font-weight)",
 					"lineHeight": "var(--wp--custom--heading--typography--line-height)"
 				}
@@ -372,8 +370,9 @@
 			},
 			"core/post-title": {
 				"typography": {
+					"fontFamily": "var(--wp--custom--heading--typography--font-family)",
 					"fontSize": "var(--wp--custom--heading--h1--font-size)",
-					"lineHeight": "var(--wp--custom--line-height--headings--h1)",
+					"lineHeight": 1.2,
 					"fontWeight": "var(--wp--custom--heading--typography--font-weight)"
 				}
 			},
@@ -469,37 +468,37 @@
 			"h1": {
 				"typography": {
 					"fontSize": "var(--wp--custom--heading--h1--font-size)",
-					"lineHeight": "var(--wp--custom--line-height--headings--h1)"
+					"lineHeight": 1.2
 				}
 			},
 			"h2": {
 				"typography": {
 					"fontSize": "min(max(36px, 6vw), 65px)",
-					"lineHeight": "var(--wp--custom--line-height--headings--h2)"
+					"lineHeight": 1.2
 				}
 			},
 			"h3": {
 				"typography": {
 					"fontSize": "var(--wp--custom--heading--h3--font-size)",
-					"lineHeight": "var(--wp--custom--line-height--headings--h3)"
+					"lineHeight": 1.2
 				}
 			},
 			"h4": {
 				"typography": {
 					"fontSize": "20px",
-					"lineHeight": "var(--wp--custom--line-height--headings--h4)"
+					"lineHeight": 1.4
 				}
 			},
 			"h5": {
 				"typography": {
 					"fontSize": "18px",
-					"lineHeight": "var(--wp--custom--line-height--headings--h5)"
+					"lineHeight": 1.4
 				}
 			},
 			"h6": {
 				"typography": {
 					"fontSize": "16px",
-					"lineHeight": "var(--wp--custom--line-height--headings--h6)"
+					"lineHeight": 1.4
 				}
 			},
 			"link": {
@@ -509,8 +508,8 @@
 			}
 		},
 		"typography": {
-			"lineHeight": "var(--wp--custom--line-height--body)",
-			"fontFamily": "var(--wp--preset--font-family--base)",
+			"lineHeight": "var(--wp--custom--body--typography--line-height)",
+			"fontFamily": "var(--wp--custom--body--typography--font-family)",
 			"fontSize": "var(--wp--preset--font-size--normal)",
 			"fontWeight": "400"
 		},

+ 18 - 8
seedlet-blocks/child-theme.json

@@ -82,6 +82,11 @@
 			]
 		},
 		"custom": {
+			"body": {
+				"typography": {
+					"fontFamily": "var(--wp--preset--font-family--fira-sans)"
+				}
+			},
 			"button": {
 				"border": {
 					"color": "var(--wp--custom--color--primary)"
@@ -99,6 +104,11 @@
 				"family=Fira+Sans:ital,wght@0,400;0,500;1,400",
 				"family=Playfair+Display:ital,wght@0,400;0,700;1,400"
 			],
+			"heading": {
+				"typography": {
+					"fontFamily": "var(--wp--preset--font-family--playfair-display)"
+				}	
+			},
 			"margin": {
 				"horizontal": "25px",
 				"vertical": "30px"
@@ -106,7 +116,7 @@
 			"pullquote": {
 				"citation": {
 					"typography": {
-						"fontFamily": "var(--wp--preset--font-family--base)"
+						"fontFamily": "var(--wp--custom--body--typography--font-family)"
 					},
 					"spacing": {
 						"margin": {
@@ -128,14 +138,14 @@
 			"customLineHeight": true,
 			"fontFamilies": [
 				{
-					"fontFamily": "var(--font-base, 'Fira Sans', Helvetica, Arial, sans-serif)",
-					"slug": "base",
-					"name": "Base"
+					"fontFamily": "'Fira Sans', Helvetica, Arial, sans-serif",
+					"slug": "fira-sans",
+					"name": "Fira Sans"
 				},
 				{
-					"fontFamily": "var(--font-headings, 'Playfair Display', Georgia, Times, serif)",
-					"slug": "headings",
-					"name": "Headings"
+					"fontFamily": "'Playfair Display', Georgia, Times, serif",
+					"slug": "playfair-display",
+					"name": "Playfair Display"
 				}
 			],
 			"fontSizes": [
@@ -189,7 +199,7 @@
 					"fontSize": "32px",
 					"fontStyle": "italic",
 					"lineHeight": "1.3",
-					"fontFamily": "var(--wp--preset--font-family--headings)"
+					"fontFamily": "var(--wp--custom--heading--typography--font-family)"
 				}
 			},
 			"core/separator": {

+ 28 - 16
seedlet-blocks/theme.json

@@ -139,7 +139,7 @@
 					}
 				},
 				"typography": {
-					"fontFamily": "var(--wp--preset--font-family--base)",
+					"fontFamily": "var(--wp--custom--body--typography--font-family)",
 					"fontSize": "var(--wp--preset--font-size--normal)",
 					"fontWeight": "normal",
 					"lineHeight": 2
@@ -184,16 +184,27 @@
 					"fontSize": "var(--wp--preset--font-size--small)"
 				}
 			},
+			"body": {
+				"typography": {
+					"fontFamily": "var(--wp--preset--font-family--fira-sans)",
+					"lineHeight": 1.6
+				}
+			},
 			"heading": {
 				"typography": {
+					"fontFamily": "var(--wp--preset--font-family--playfair-display)",
 					"fontWeight": 400,
 					"lineHeight": 1.125
 				}
 			},
 			"list": {
-				"fontFamily": "var(--wp--custom--font-family--base)",
-				"padding": {
-					"left": "calc( 2 * var(--wp--custom--margin--horizontal) )"
+				"typography": {
+					"fontFamily": "var(--wp--custom--body--typography--font-family)"
+				},
+				"spacing": {
+					"padding": {
+						"left": "calc( 2 * var(--wp--custom--margin--horizontal) )"
+					}
 				}
 			},
 			"margin": {
@@ -205,7 +216,7 @@
 				"dropcap": {
 					"margin": ".1em .1em 0 0",
 					"typography": {
-						"fontFamily": "var(--wp--preset--font-family--base)",
+						"fontFamily": "var(--wp--custom--body--typography--font-family)",
 						"fontSize": "110px",
 						"fontWeight": "400"
 					}
@@ -226,7 +237,7 @@
 				"citation": {
 					"typography": {
 						"fontSize": "var(--wp--preset--font-size--tiny)",
-						"fontFamily": "var(--wp--preset--font-family--base)",
+						"fontFamily": "var(--wp--custom--body--typography--font-family)",
 						"fontStyle": "italic"
 					},
 					"spacing": {
@@ -293,14 +304,14 @@
 			"customLineHeight": true,
 			"fontFamilies": [
 				{
-					"fontFamily": "var(--font-base, 'Fira Sans', Helvetica, Arial, sans-serif)",
-					"slug": "base",
-					"name": "Base"
+					"fontFamily": "'Fira Sans', Helvetica, Arial, sans-serif",
+					"slug": "fira-sans",
+					"name": "Fira Sans"
 				},
 				{
-					"fontFamily": "var(--font-headings, 'Playfair Display', Georgia, Times, serif)",
-					"slug": "headings",
-					"name": "Headings"
+					"fontFamily": "'Playfair Display', Georgia, Times, serif",
+					"slug": "playfair-display",
+					"name": "Playfair Display"
 				}
 			],
 			"fontSizes": [
@@ -377,7 +388,7 @@
 			},
 			"core/heading": {
 				"typography": {
-					"fontFamily": "var(--wp--preset--font-family--headings)",
+					"fontFamily": "var(--wp--custom--heading--typography--font-family)",
 					"fontWeight": "var(--wp--custom--heading--typography--font-weight)",
 					"lineHeight": "var(--wp--custom--heading--typography--line-height)"
 				}
@@ -402,6 +413,7 @@
 			},
 			"core/post-title": {
 				"typography": {
+					"fontFamily": "var(--wp--custom--heading--typography--font-family)",
 					"fontSize": "var(--wp--preset--font-size--huge)",
 					"lineHeight": "var(--wp--custom--heading--typography--line-height)"
 				}
@@ -424,7 +436,7 @@
 					"fontStyle": "italic",
 					"fontSize": "32px",
 					"lineHeight": "1.3",
-					"fontFamily": "var(--wp--preset--font-family--headings)"
+					"fontFamily": "var(--wp--custom--heading--typography--font-family)"
 				},
 				"spacing": {
 					"padding": {
@@ -513,8 +525,8 @@
 			}
 		},
 		"typography": {
-			"lineHeight": 1.6,
-			"fontFamily": "var(--wp--preset--font-family--base)",
+			"lineHeight": "var(--wp--custom--body--typography--line-height)",
+			"fontFamily": "var(--wp--custom--body--typography--font-family)",
 			"fontSize": "var(--wp--preset--font-size--normal)"
 		}
 	}