Adjusted menu CSS to match recent changes in the block (#4822)

* Adjusted menu CSS to match recent changes in the block

* Adjusted mobile menu styling to fit recent changes to navigation block

* Style social nav on mobile only

* Made the same menu changes in Geologist as in Quadrat

* Corrected blockbase classes due to recent changes to navigation block

* Adjusted skatepark's navigation classes

* corrected videomaker classes

* Improved mobile navigation alignment for Seedlet Blocks

* Further addressed Seedlet's mobile stylings.  Better addressed Blockbase mobile submenu spacing.

* Remove the margins on the social links block when in the nav

* Add a block style for 'clean mobile navigation block' and cleaned up base navigation block styles polyfill

* moved social menu location of styled mobile menu

* Renamed block style to improved responsive navigation

Co-authored-by: Ben Dwyer <ben@scruffian.com>
This commit is contained in:
Jason Crist 2021-10-15 03:27:27 -04:00 committed by GitHub
parent 5a04d5706a
commit 0d08de6d60
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
20 changed files with 188 additions and 114 deletions

View file

@ -460,17 +460,46 @@ ol {
padding-left: var(--wp--custom--list--spacing--padding--left);
}
.wp-block-navigation.is-responsive .wp-block-navigation__responsive-container.is-menu-open {
.wp-block-navigation .has-child .wp-block-navigation__submenu-container {
background-color: var(--wp--custom--color--background);
border: var(--wp--custom--form--border--width) var(--wp--custom--form--border--style) var(--wp--preset--color--primary);
}
.wp-block-navigation.is-responsive:not(.has-background) .wp-block-navigation__responsive-container.is-menu-open {
background-color: var(--wp--custom--color--background);
color: var(--wp--custom--color--foreground);
}
.wp-block-navigation.is-responsive .wp-block-navigation-link__content {
color: var(--wp--custom--color--foreground) !important;
.wp-block-navigation.is-responsive ul.wp-block-social-links {
margin: 0;
gap: var(--wp--custom--gap--baseline);
}
.wp-block-navigation.is-responsive .has-child .wp-block-navigation-link__container {
display: revert;
.wp-block-navigation.is-style-blockbase-navigation-improved-responsive.is-responsive .is-menu-open {
font-size: var(--wp--preset--font-size--medium) !important;
}
.wp-block-navigation.is-style-blockbase-navigation-improved-responsive.is-responsive .is-menu-open .wp-block-navigation__container {
row-gap: 0.5rem !important;
align-items: flex-start !important;
flex: unset;
padding-bottom: 0;
}
.wp-block-navigation.is-style-blockbase-navigation-improved-responsive.is-responsive .is-menu-open .wp-block-navigation-item {
align-items: flex-start !important;
}
.wp-block-navigation.is-style-blockbase-navigation-improved-responsive.is-responsive .is-menu-open .wp-block-navigation__submenu-container {
font-size: var(--wp--preset--font-size--normal) !important;
padding-bottom: 0;
padding-left: var(--wp--custom--gap--horizontal) !important;
padding-top: 0.5rem;
row-gap: 0.5rem !important;
}
.wp-block-navigation.is-style-blockbase-navigation-improved-responsive.is-responsive .is-menu-open ul.wp-block-social-links {
justify-content: flex-start;
}
p.has-drop-cap:not(:focus):first-letter {

View file

@ -159,3 +159,8 @@ add_action(
);
}
);
/**
* Block Styles.
*/
require get_template_directory() . '/inc/block-styles.php';

View file

@ -0,0 +1,31 @@
<?php
/**
* Blockbase Theme: Block Styles
*
* @package Blockbase
* @since 1.2.8
*/
if ( ! function_exists( 'blockbase_register_block_styles' ) ) :
function blockbase_register_block_styles() {
if ( function_exists( 'register_block_style' ) ) {
/**
* Register block styles
*/
register_block_style(
'core/navigation',
array(
'name' => 'blockbase-navigation-improved-responsive',
'label' => __( 'Improved Responsive Navigation', 'blockbase' ),
'style_handle' => 'blockbase-navigation-improved-responsive',
)
);
}
}
endif;
add_action( 'after_setup_theme', 'blockbase_register_block_styles' );

View file

@ -1,13 +1,43 @@
// See https://github.com/WordPress/gutenberg/issues/34648
.wp-block-navigation.is-responsive {
.wp-block-navigation__responsive-container.is-menu-open {
.wp-block-navigation {
// See https://github.com/WordPress/gutenberg/issues/34648
.has-child .wp-block-navigation__submenu-container {
background-color: var(--wp--custom--color--background);
color: var(--wp--custom--color--foreground);
border: var(--wp--custom--form--border--width) var(--wp--custom--form--border--style) var(--wp--preset--color--primary);
}
.wp-block-navigation-link__content {
color: var(--wp--custom--color--foreground) !important;
}
.has-child .wp-block-navigation-link__container{
display: revert;
&.is-responsive {
&:not(.has-background) .wp-block-navigation__responsive-container.is-menu-open {
background-color: var(--wp--custom--color--background);
color: var(--wp--custom--color--foreground);
}
ul.wp-block-social-links {
margin: 0;
gap: var(--wp--custom--gap--baseline);
}
}
}
.wp-block-navigation.is-style-blockbase-navigation-improved-responsive {
&.is-responsive .is-menu-open {
font-size: var(--wp--preset--font-size--medium) !important;
.wp-block-navigation__container {
row-gap: 0.5rem !important;
align-items: flex-start !important;
flex: unset;
padding-bottom: 0;
}
.wp-block-navigation-item {
align-items: flex-start !important;
}
.wp-block-navigation__submenu-container {
font-size: var(--wp--preset--font-size--normal) !important;
padding-bottom: 0;
padding-left: var(--wp--custom--gap--horizontal) !important;
padding-top: 0.5rem;
row-gap: 0.5rem !important;
}
ul.wp-block-social-links {
justify-content: flex-start;
}
}
}

View file

@ -118,8 +118,7 @@ ul ul {
text-decoration: underline;
}
.wp-block-navigation:not(.has-background) .wp-block-navigation__container .submenu-container,
.wp-block-navigation:not(.has-background) .wp-block-navigation__container .wp-block-navigation-link__container {
.wp-block-navigation:not(.has-background) .wp-block-navigation__submenu-container {
background-color: var(--wp--custom--color--background);
border-color: var(--wp--custom--color--tertiary);
}
@ -147,31 +146,31 @@ ul ul {
margin-right: 0;
}
.wp-block-navigation.is-responsive .wp-block-navigation__responsive-container.is-menu-open.has-modal-open .wp-block-pages-list__item.has-child .submenu-container,
.wp-block-navigation.is-responsive .wp-block-navigation__responsive-container.is-menu-open.has-modal-open .wp-block-pages-list__item.has-child .wp-block-navigation-link__container,
.wp-block-navigation.is-responsive .wp-block-navigation__responsive-container.is-menu-open.has-modal-open .wp-block-navigation-link.has-child .submenu-container,
.wp-block-navigation.is-responsive .wp-block-navigation__responsive-container.is-menu-open.has-modal-open .wp-block-navigation-link.has-child .wp-block-navigation-link__container {
margin-right: -19px;
.wp-block-navigation.is-responsive .wp-block-navigation__responsive-container.is-menu-open.has-modal-open .wp-block-pages-list__item.has-child .wp-block-navigation__submenu-container,
.wp-block-navigation.is-responsive .wp-block-navigation__responsive-container.is-menu-open.has-modal-open .wp-block-navigation-link.has-child .wp-block-navigation__submenu-container {
gap: 0;
padding: 0 19px 0 0;
border-right: 1px solid var(--wp--custom--color--foreground);
}
.wp-block-navigation.is-responsive .wp-block-navigation__responsive-container.is-menu-open.has-modal-open .wp-block-pages-list__item.has-child .submenu-container .wp-block-pages-list__item__link,
.wp-block-navigation.is-responsive .wp-block-navigation__responsive-container.is-menu-open.has-modal-open .wp-block-pages-list__item.has-child .submenu-container .wp-block-navigation-link__content,
.wp-block-navigation.is-responsive .wp-block-navigation__responsive-container.is-menu-open.has-modal-open .wp-block-pages-list__item.has-child .wp-block-navigation-link__container .wp-block-pages-list__item__link,
.wp-block-navigation.is-responsive .wp-block-navigation__responsive-container.is-menu-open.has-modal-open .wp-block-pages-list__item.has-child .wp-block-navigation-link__container .wp-block-navigation-link__content,
.wp-block-navigation.is-responsive .wp-block-navigation__responsive-container.is-menu-open.has-modal-open .wp-block-navigation-link.has-child .submenu-container .wp-block-pages-list__item__link,
.wp-block-navigation.is-responsive .wp-block-navigation__responsive-container.is-menu-open.has-modal-open .wp-block-navigation-link.has-child .submenu-container .wp-block-navigation-link__content,
.wp-block-navigation.is-responsive .wp-block-navigation__responsive-container.is-menu-open.has-modal-open .wp-block-navigation-link.has-child .wp-block-navigation-link__container .wp-block-pages-list__item__link,
.wp-block-navigation.is-responsive .wp-block-navigation__responsive-container.is-menu-open.has-modal-open .wp-block-navigation-link.has-child .wp-block-navigation-link__container .wp-block-navigation-link__content {
.wp-block-navigation.is-responsive .wp-block-navigation__responsive-container.is-menu-open.has-modal-open .wp-block-pages-list__item.has-child .wp-block-navigation__submenu-container .wp-block-pages-list__item__link,
.wp-block-navigation.is-responsive .wp-block-navigation__responsive-container.is-menu-open.has-modal-open .wp-block-pages-list__item.has-child .wp-block-navigation__submenu-container .wp-block-navigation-item__content,
.wp-block-navigation.is-responsive .wp-block-navigation__responsive-container.is-menu-open.has-modal-open .wp-block-navigation-link.has-child .wp-block-navigation__submenu-container .wp-block-pages-list__item__link,
.wp-block-navigation.is-responsive .wp-block-navigation__responsive-container.is-menu-open.has-modal-open .wp-block-navigation-link.has-child .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
padding: 0;
font-size: var(--wp--custom--font-sizes--tiny);
line-height: 40px;
}
.wp-block-navigation.is-responsive .wp-block-navigation__responsive-container.is-menu-open.has-modal-open .wp-block-navigation__container {
padding-top: 50px;
align-items: flex-end;
gap: 0;
}
.wp-block-navigation.is-responsive .wp-block-navigation__responsive-container.is-menu-open .wp-block-social-links {
position: absolute;
flex-direction: column;
padding-top: 36px;
}
.wp-block-post-comments form input:not([type=submit]):not([type=checkbox]),

View file

@ -10,12 +10,9 @@
}
}
&:not(.has-background) {
.wp-block-navigation__container {
.submenu-container,
.wp-block-navigation-link__container {
background-color: var(--wp--custom--color--background);
border-color: var(--wp--custom--color--tertiary);
}
.wp-block-navigation__submenu-container {
background-color: var(--wp--custom--color--background);
border-color: var(--wp--custom--color--tertiary);
}
}
@ -37,13 +34,12 @@
.wp-block-navigation-link__content {
margin-right: 0;
}
.submenu-container,
.wp-block-navigation-link__container{
margin-right: -19px;
.wp-block-navigation__submenu-container{
gap: 0;
padding: 0 19px 0 0;
border-right: 1px solid var(--wp--custom--color--foreground);
.wp-block-pages-list__item__link,
.wp-block-navigation-link__content {
.wp-block-navigation-item__content {
padding: 0;
font-size: var(--wp--custom--font-sizes--tiny);
line-height: 40px;
@ -52,9 +48,14 @@
}
}
.wp-block-navigation__container{
padding-top: 50px;
align-items: flex-end;
gap: 0;
}
}
.wp-block-social-links {
position: absolute;
flex-direction: column;
padding-top: 36px;
}
}
}

View file

@ -3,6 +3,6 @@
<!-- wp:site-logo /-->
<!-- wp:site-title /-->
<!-- wp:site-tagline {"style":{"typography":{"fontSize":"var(--wp--custom--font-sizes--tiny)"}}} /-->
<!-- wp:navigation {"textColor":"foreground-light","fontSize":"small","itemsJustification":"right","isResponsive":true,"__unstableLocation":"primary","__unstableSocialLinks":"social"} /-->
<!-- wp:navigation {"className":"is-style-blockbase-navigation-improved-responsive","itemsJustification":"right","isResponsive":true,"__unstableLocation":"primary","__unstableSocialLinks":"social"} /-->
</div>
<!-- /wp:group -->

View file

@ -307,8 +307,7 @@ ul ul {
text-decoration: underline;
}
.wp-block-navigation:not(.has-background) .wp-block-navigation__container .submenu-container,
.wp-block-navigation:not(.has-background) .wp-block-navigation__container .wp-block-navigation-link__container {
.wp-block-navigation:not(.has-background) .wp-block-navigation__submenu-container {
background-color: var(--wp--custom--color--background);
border-color: var(--wp--custom--color--tertiary);
}
@ -336,31 +335,31 @@ ul ul {
margin-right: 0;
}
.wp-block-navigation.is-responsive .wp-block-navigation__responsive-container.is-menu-open.has-modal-open .wp-block-pages-list__item.has-child .submenu-container,
.wp-block-navigation.is-responsive .wp-block-navigation__responsive-container.is-menu-open.has-modal-open .wp-block-pages-list__item.has-child .wp-block-navigation-link__container,
.wp-block-navigation.is-responsive .wp-block-navigation__responsive-container.is-menu-open.has-modal-open .wp-block-navigation-link.has-child .submenu-container,
.wp-block-navigation.is-responsive .wp-block-navigation__responsive-container.is-menu-open.has-modal-open .wp-block-navigation-link.has-child .wp-block-navigation-link__container {
margin-right: -19px;
.wp-block-navigation.is-responsive .wp-block-navigation__responsive-container.is-menu-open.has-modal-open .wp-block-pages-list__item.has-child .wp-block-navigation__submenu-container,
.wp-block-navigation.is-responsive .wp-block-navigation__responsive-container.is-menu-open.has-modal-open .wp-block-navigation-link.has-child .wp-block-navigation__submenu-container {
gap: 0;
padding: 0 19px 0 0;
border-right: 1px solid var(--wp--custom--color--foreground);
}
.wp-block-navigation.is-responsive .wp-block-navigation__responsive-container.is-menu-open.has-modal-open .wp-block-pages-list__item.has-child .submenu-container .wp-block-pages-list__item__link,
.wp-block-navigation.is-responsive .wp-block-navigation__responsive-container.is-menu-open.has-modal-open .wp-block-pages-list__item.has-child .submenu-container .wp-block-navigation-link__content,
.wp-block-navigation.is-responsive .wp-block-navigation__responsive-container.is-menu-open.has-modal-open .wp-block-pages-list__item.has-child .wp-block-navigation-link__container .wp-block-pages-list__item__link,
.wp-block-navigation.is-responsive .wp-block-navigation__responsive-container.is-menu-open.has-modal-open .wp-block-pages-list__item.has-child .wp-block-navigation-link__container .wp-block-navigation-link__content,
.wp-block-navigation.is-responsive .wp-block-navigation__responsive-container.is-menu-open.has-modal-open .wp-block-navigation-link.has-child .submenu-container .wp-block-pages-list__item__link,
.wp-block-navigation.is-responsive .wp-block-navigation__responsive-container.is-menu-open.has-modal-open .wp-block-navigation-link.has-child .submenu-container .wp-block-navigation-link__content,
.wp-block-navigation.is-responsive .wp-block-navigation__responsive-container.is-menu-open.has-modal-open .wp-block-navigation-link.has-child .wp-block-navigation-link__container .wp-block-pages-list__item__link,
.wp-block-navigation.is-responsive .wp-block-navigation__responsive-container.is-menu-open.has-modal-open .wp-block-navigation-link.has-child .wp-block-navigation-link__container .wp-block-navigation-link__content {
.wp-block-navigation.is-responsive .wp-block-navigation__responsive-container.is-menu-open.has-modal-open .wp-block-pages-list__item.has-child .wp-block-navigation__submenu-container .wp-block-pages-list__item__link,
.wp-block-navigation.is-responsive .wp-block-navigation__responsive-container.is-menu-open.has-modal-open .wp-block-pages-list__item.has-child .wp-block-navigation__submenu-container .wp-block-navigation-item__content,
.wp-block-navigation.is-responsive .wp-block-navigation__responsive-container.is-menu-open.has-modal-open .wp-block-navigation-link.has-child .wp-block-navigation__submenu-container .wp-block-pages-list__item__link,
.wp-block-navigation.is-responsive .wp-block-navigation__responsive-container.is-menu-open.has-modal-open .wp-block-navigation-link.has-child .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
padding: 0;
font-size: var(--wp--custom--font-sizes--tiny);
line-height: 40px;
}
.wp-block-navigation.is-responsive .wp-block-navigation__responsive-container.is-menu-open.has-modal-open .wp-block-navigation__container {
padding-top: 50px;
align-items: flex-end;
gap: 0;
}
.wp-block-navigation.is-responsive .wp-block-navigation__responsive-container.is-menu-open .wp-block-social-links {
position: absolute;
flex-direction: column;
padding-top: 36px;
}
.wp-block-post-comments form input:not([type=submit]):not([type=checkbox]),

View file

@ -10,12 +10,9 @@
}
}
&:not(.has-background) {
.wp-block-navigation__container {
.submenu-container,
.wp-block-navigation-link__container {
background-color: var(--wp--custom--color--background);
border-color: var(--wp--custom--color--tertiary);
}
.wp-block-navigation__submenu-container {
background-color: var(--wp--custom--color--background);
border-color: var(--wp--custom--color--tertiary);
}
}
@ -37,13 +34,12 @@
.wp-block-navigation-link__content {
margin-right: 0;
}
.submenu-container,
.wp-block-navigation-link__container{
margin-right: -19px;
.wp-block-navigation__submenu-container{
gap: 0;
padding: 0 19px 0 0;
border-right: 1px solid var(--wp--custom--color--foreground);
.wp-block-pages-list__item__link,
.wp-block-navigation-link__content {
.wp-block-navigation-item__content {
padding: 0;
font-size: var(--wp--custom--font-sizes--tiny);
line-height: 40px;
@ -52,9 +48,14 @@
}
}
.wp-block-navigation__container{
padding-top: 50px;
align-items: flex-end;
gap: 0;
}
}
.wp-block-social-links {
position: absolute;
flex-direction: column;
padding-top: 36px;
}
}
}

View file

@ -158,7 +158,7 @@
}
.wp-block-navigation__responsive-container.has-modal-open .wp-block-navigation-link {
font-family: var(--wp--preset--font-family--headings);
font-family: var(--wp--preset--font-family--playfair-display);
font-size: 32px;
font-weight: 400;
line-height: 60px;
@ -170,16 +170,6 @@
line-height: 30px;
}
.wp-block-navigation__responsive-container:not(.has-modal-open) .wp-block-social-links {
flex-basis: 100%;
}
/* NOTE: This can be removed when the rendering of the Navigation block, rendered with a Classic data source (by way of __unstableLocation),
is passed all of the block attributes on the block definition in the template. */
.wp-block-navigation__container {
justify-content: center;
}
.wp-block-post-comments #comments,
.wp-block-post-comments #reply-title {
font-style: italic;

View file

@ -8,7 +8,7 @@
<!-- wp:site-tagline {"textAlign":"center","fontSize":"small"} /-->
<!-- wp:navigation {"itemsJustification":"center","isResponsive":true,"__unstableLocation":"primary","__unstableSocialLinks":"social"} /-->
<!-- wp:navigation {"className":"is-style-blockbase-navigation-improved-responsive","itemsJustification":"center","isResponsive":true,"__unstableLocation":"primary","__unstableSocialLinks":"social"} /-->
<!-- wp:spacer {"height":60} -->
<div style="height:60px" aria-hidden="true" class="wp-block-spacer"></div>

View file

@ -1,9 +1,7 @@
.wp-block-navigation__responsive-container {
&.has-modal-open {
.wp-block-navigation-link {
//NOTE: For reasons I cannot explain... if I set this to use the --wp--preset--font-family--headings
//these values (which are what are set) are not respected in the modal.
font-family: var(--wp--preset--font-family--headings);
font-family: var(--wp--preset--font-family--playfair-display);
font-size: 32px;
font-weight: 400;
line-height: 60px;
@ -16,14 +14,4 @@
}
}
}
&:not(.has-modal-open) .wp-block-social-links {
flex-basis: 100%;
}
}
/* NOTE: This can be removed when the rendering of the Navigation block, rendered with a Classic data source (by way of __unstableLocation),
is passed all of the block attributes on the block definition in the template. */
.wp-block-navigation__container {
justify-content: center;
}

View file

@ -126,9 +126,8 @@
padding-left: calc( max( 0.5 * ( 100% - var(--wp--custom--layout--wide-size) ) + var(--wp--custom--gap--horizontal), var(--wp--custom--gap--horizontal) ));
}
.wp-block-navigation.is-responsive .has-child .wp-block-navigation-link__container {
background-color: var(--wp--custom--color--background);
border: var(--wp--custom--form--border--width) var(--wp--custom--form--border--style) var(--wp--preset--color--primary);
.wp-block-navigation {
font-size: var(--wp--preset--font-size--small);
}
.wp-block-post-comments .reply a {

View file

@ -9,7 +9,7 @@
<!-- wp:group {"className":"nav-links"} -->
<div class="wp-block-group nav-links">
<!-- wp:navigation {"orientation":"horizontal","itemsJustification":"right","isResponsive":true,"__unstableLocation":"primary","style":{"typography":{"fontStyle":"normal","fontWeight":"900","textTransform":"uppercase"}},"fontSize":"small","__unstableSocialLinks":"social"} /-->
<!-- wp:navigation {"className":"is-style-blockbase-navigation-improved-responsive","orientation":"horizontal","itemsJustification":"right","isResponsive":true,"__unstableLocation":"primary","style":{"typography":{"fontStyle":"normal","fontWeight":"900","textTransform":"uppercase"}},"__unstableSocialLinks":"social"} /-->
</div>
<!-- /wp:group -->
</div>

View file

@ -1,7 +1,5 @@
// See https://github.com/WordPress/gutenberg/issues/34648
.wp-block-navigation.is-responsive {
.has-child .wp-block-navigation-link__container {
background-color: var(--wp--custom--color--background);
border: var(--wp--custom--form--border--width) var(--wp--custom--form--border--style) var(--wp--preset--color--primary);
}
//NOTE: Setting the font size as a block attributes forces ALL elements to have that font size
//preventing mobile menu items (and sub-menu items) from having a different size value
.wp-block-navigation {
font-size: var(--wp--preset--font-size--small);
}

View file

@ -64,7 +64,7 @@ div.post-meta a {
align-items: flex-end;
}
.wp-block-navigation.is-responsive .has-child .wp-block-navigation-link__container {
.wp-block-navigation.is-responsive .has-child .wp-block-navigation__submenu-container {
background-color: var(--wp--custom--color--background);
border: var(--wp--custom--form--border--width) var(--wp--custom--form--border--style) var(--wp--preset--color--primary);
}

View file

@ -3,6 +3,6 @@
<!-- wp:site-logo /-->
<!-- wp:site-title /-->
<!-- wp:site-tagline /-->
<!-- wp:navigation {"itemsJustification":"right","isResponsive":true,"__unstableLocation":"primary","__unstableSocialLinks":"social"} /-->
<!-- wp:navigation {"className":"is-style-blockbase-navigation-improved-responsive","itemsJustification":"right","isResponsive":true,"__unstableLocation":"primary","__unstableSocialLinks":"social"} /-->
</header>
<!-- /wp:group -->

View file

@ -160,6 +160,12 @@
"textTransform": "uppercase"
}
},
"core/navigation-link": {
"color": {
"background": "transparent",
"text": "var(--wp--custom--color--foreground)"
}
},
"core/post-date": {
"typography": {
"fontSize": "var(--wp--preset--font-size--small)"

View file

@ -1,12 +1,4 @@
// Needed until this is merged: https://github.com/WordPress/gutenberg/issues/35040
.is-vertical.items-justified-right ul.wp-block-navigation__container {
align-items: flex-end;
}
// See https://github.com/WordPress/gutenberg/issues/34648
.wp-block-navigation.is-responsive {
.has-child .wp-block-navigation-link__container {
background-color: var(--wp--custom--color--background);
border: var(--wp--custom--form--border--width) var(--wp--custom--form--border--style) var(--wp--preset--color--primary);
}
}
}

View file

@ -494,6 +494,12 @@
"textTransform": "uppercase"
}
},
"core/navigation-link": {
"color": {
"background": "transparent",
"text": "var(--wp--custom--color--foreground)"
}
},
"core/post-terms": {
"typography": {
"fontSize": "var(--wp--preset--font-size--small)"