@wordpress/block-editor 13.2.0 → 13.4.0

package/src/components/global-styles/test/typography-utils.js

@@ -4,6 +4,10 @@
 import {
 	getTypographyFontSizeValue,
 	getFluidTypographyOptionsFromSettings,
+	getMergedFontFamiliesAndFontFamilyFaces,
+	findNearestFontWeight,
+	findNearestFontStyle,
+	findNearestStyleAndWeight,
 } from '../typography-utils';
 
 describe( 'typography utils', () => {
@@ -682,6 +686,596 @@ describe( 'typography utils', () => {
 		} );
 	} );
 
+	describe( 'getMergedFontFamiliesAndFontFamilyFaces', () => {
+		[
+			{
+				message:
+					'should return empty arrays when settings and fontFamily are empty',
+				settings: {},
+				fontFamily: '',
+				expected: {
+					fontFamilies: [],
+					fontFamilyFaces: [],
+				},
+			},
+
+			{
+				message:
+					'should return empty arrays when only settings is `undefined`',
+				settings: undefined,
+				fontFamily: 'ABeeZee, sans-serif',
+				expected: {
+					fontFamilies: [],
+					fontFamilyFaces: [],
+				},
+			},
+
+			{
+				message:
+					'should return fontFamilies array and an empty fontFamilyFaces array when fontfamily is empty',
+				settings: {
+					typography: {
+						fontFamilies: {
+							custom: [
+								{
+									name: 'ABeeZee',
+									slug: 'abeezee',
+									fontFamily: 'ABeeZee, sans-serif',
+									fontFace: [
+										{
+											src: 'http://www.wordpress.org/wp-content/uploads/fonts/esDT31xSG-6AGleN2tCkkJUCGpG-GQ.woff2',
+											fontWeight: '400',
+											fontStyle: 'italic',
+											fontFamily: 'ABeeZee',
+										},
+									],
+								},
+							],
+						},
+					},
+				},
+				fontFamily: '',
+				expected: {
+					fontFamilies: [
+						{
+							fontFace: [
+								{
+									fontFamily: 'ABeeZee',
+									fontStyle: 'italic',
+									fontWeight: '400',
+									src: 'http://www.wordpress.org/wp-content/uploads/fonts/esDT31xSG-6AGleN2tCkkJUCGpG-GQ.woff2',
+								},
+							],
+							fontFamily: 'ABeeZee, sans-serif',
+							name: 'ABeeZee',
+							slug: 'abeezee',
+						},
+					],
+					fontFamilyFaces: [],
+				},
+			},
+
+			{
+				message:
+					'should return font families and font faces when both settings and fontFamily are defined',
+				settings: {
+					typography: {
+						fontFamilies: {
+							theme: [
+								{
+									fontFace: [
+										{
+											fontFamily: 'PT Sans',
+											fontStyle: 'normal',
+											fontWeight: '400',
+											src: [
+												'file:./assets/fonts/pt-sans_normal_400.ttf',
+											],
+										},
+										{
+											fontFamily: 'PT Sans',
+											fontStyle: 'normal',
+											fontWeight: '700',
+											src: [
+												'file:./assets/fonts/pt-sans_normal_700.ttf',
+											],
+										},
+										{
+											fontFamily: 'PT Sans',
+											fontStyle: 'italic',
+											fontWeight: '400',
+											src: [
+												'file:./assets/fonts/pt-sans_italic_400.ttf',
+											],
+										},
+										{
+											fontFamily: 'PT Sans',
+											fontStyle: 'italic',
+											fontWeight: '700',
+											src: [
+												'file:./assets/fonts/pt-sans_italic_700.ttf',
+											],
+										},
+									],
+									fontFamily: 'PT Sans',
+									name: 'PT Sans',
+									slug: 'pt-sans',
+								},
+							],
+							custom: [
+								{
+									name: 'ABeeZee',
+									slug: 'abeezee',
+									fontFamily: 'ABeeZee, sans-serif',
+									fontFace: [
+										{
+											src: 'http://www.wordpress.org/wp-content/uploads/fonts/esDT31xSG-6AGleN2tCkkJUCGpG-GQ.woff2',
+											fontWeight: '400',
+											fontStyle: 'italic',
+											fontFamily: 'ABeeZee',
+										},
+									],
+								},
+							],
+						},
+					},
+				},
+				fontFamily: 'ABeeZee, sans-serif',
+				expected: {
+					fontFamilyFaces: [
+						{
+							fontFamily: 'ABeeZee',
+							fontStyle: 'italic',
+							fontWeight: '400',
+							src: 'http://www.wordpress.org/wp-content/uploads/fonts/esDT31xSG-6AGleN2tCkkJUCGpG-GQ.woff2',
+						},
+					],
+					fontFamilies: [
+						{
+							fontFace: [
+								{
+									fontFamily: 'PT Sans',
+									fontStyle: 'normal',
+									fontWeight: '400',
+									src: [
+										'file:./assets/fonts/pt-sans_normal_400.ttf',
+									],
+								},
+								{
+									fontFamily: 'PT Sans',
+									fontStyle: 'normal',
+									fontWeight: '700',
+									src: [
+										'file:./assets/fonts/pt-sans_normal_700.ttf',
+									],
+								},
+								{
+									fontFamily: 'PT Sans',
+									fontStyle: 'italic',
+									fontWeight: '400',
+									src: [
+										'file:./assets/fonts/pt-sans_italic_400.ttf',
+									],
+								},
+								{
+									fontFamily: 'PT Sans',
+									fontStyle: 'italic',
+									fontWeight: '700',
+									src: [
+										'file:./assets/fonts/pt-sans_italic_700.ttf',
+									],
+								},
+							],
+							fontFamily: 'PT Sans',
+							name: 'PT Sans',
+							slug: 'pt-sans',
+						},
+						{
+							fontFace: [
+								{
+									fontFamily: 'ABeeZee',
+									fontStyle: 'italic',
+									fontWeight: '400',
+									src: 'http://www.wordpress.org/wp-content/uploads/fonts/esDT31xSG-6AGleN2tCkkJUCGpG-GQ.woff2',
+								},
+							],
+							fontFamily: 'ABeeZee, sans-serif',
+							name: 'ABeeZee',
+							slug: 'abeezee',
+						},
+					],
+				},
+			},
+		].forEach( ( { message, settings, fontFamily, expected } ) => {
+			it( `${ message }`, () => {
+				expect(
+					getMergedFontFamiliesAndFontFamilyFaces(
+						settings,
+						fontFamily
+					)
+				).toEqual( expected );
+			} );
+		} );
+	} );
+
+	describe( 'findNearestFontWeight', () => {
+		[
+			{
+				message:
+					'should return empty string when newFontWeightValue is `undefined`',
+				availableFontWeights: undefined,
+				newFontWeightValue: undefined,
+				expected: '',
+			},
+			{
+				message:
+					'should return newFontWeightValue value when availableFontWeights is empty',
+				availableFontWeights: [],
+				newFontWeightValue: '300',
+				expected: '300',
+			},
+			{
+				message: 'should return correct nearest higher font weight',
+				availableFontWeights: [
+					{ name: 'Regular', value: '400' },
+					{ name: 'Bold', value: '700' },
+					{ name: 'Black', value: '900' },
+				],
+				newFontWeightValue: '300',
+				expected: '400',
+			},
+			{
+				message: 'should return correct nearest lower font weight',
+				availableFontWeights: [
+					{ name: 'Thin', value: '100' },
+					{ name: 'Light', value: '300' },
+					{ name: 'Regular', value: '400' },
+				],
+				newFontWeightValue: '900',
+				expected: '400',
+			},
+		].forEach(
+			( {
+				message,
+				availableFontWeights,
+				newFontWeightValue,
+				expected,
+			} ) => {
+				it( `${ message }`, () => {
+					expect(
+						findNearestFontWeight(
+							availableFontWeights,
+							newFontWeightValue
+						)
+					).toEqual( expected );
+				} );
+			}
+		);
+	} );
+
+	describe( 'findNearestFontStyle', () => {
+		[
+			{
+				message:
+					'should return empty string when newFontStyleValue is `undefined`',
+				availableFontStyles: undefined,
+				newFontStyleValue: undefined,
+				expected: '',
+			},
+			{
+				message:
+					'should return newFontStyleValue value when availableFontStyles is empty',
+				availableFontStyles: [],
+				newFontStyleValue: 'italic',
+				expected: 'italic',
+			},
+			{
+				message:
+					'should return empty string if there is no new font style available',
+				availableFontStyles: [ { name: 'Normal', value: 'normal' } ],
+				newFontStyleValue: 'italic',
+				expected: '',
+			},
+			{
+				message:
+					'should return empty string if the new font style is invalid',
+				availableFontStyles: [
+					{ name: 'Regular', value: 'normal' },
+					{ name: 'Italic', value: 'italic' },
+				],
+				newFontStyleValue: 'not-valid',
+				expected: '',
+			},
+			{
+				message: 'should return italic if oblique is not available',
+				availableFontStyles: [
+					{ name: 'Regular', value: 'normal' },
+					{ name: 'Italic', value: 'italic' },
+				],
+				newFontStyleValue: 'oblique',
+				expected: 'italic',
+			},
+			{
+				message: 'should return normal if normal is available',
+				availableFontStyles: [
+					{ name: 'Regular', value: 'normal' },
+					{ name: 'Italic', value: 'italic' },
+				],
+				newFontStyleValue: 'normal',
+				expected: 'normal',
+			},
+		].forEach(
+			( {
+				message,
+				availableFontStyles,
+				newFontStyleValue,
+				expected,
+			} ) => {
+				it( `${ message }`, () => {
+					expect(
+						findNearestFontStyle(
+							availableFontStyles,
+							newFontStyleValue
+						)
+					).toEqual( expected );
+				} );
+			}
+		);
+	} );
+
+	describe( 'findNearestStyleAndWeight', () => {
+		[
+			{
+				message: 'should return empty object when all values are empty',
+				fontFamilyFaces: [],
+				fontStyle: undefined,
+				fontWeight: undefined,
+				expected: {},
+			},
+			{
+				message:
+					'should return original fontStyle and fontWeight when fontFamilyFaces is empty',
+				fontFamilyFaces: [],
+				fontStyle: 'italic',
+				fontWeight: '700',
+				expected: {
+					nearestFontStyle: 'italic',
+					nearestFontWeight: '700',
+				},
+			},
+			{
+				message:
+					'should return undefined values if both fontStyle and fontWeight are not available',
+				fontFamilyFaces: [
+					{
+						fontFamily: 'ABeeZee',
+						fontStyle: 'italic',
+						fontWeight: '400',
+						src: [
+							'file:./assets/fonts/esDT31xSG-6AGleN2tCkkJUCGpG-GQ.woff2',
+						],
+					},
+				],
+				fontStyle: undefined,
+				fontWeight: undefined,
+				expected: {
+					nearestFontStyle: undefined,
+					nearestFontWeight: undefined,
+				},
+			},
+			{
+				message:
+					'should return nearest fontStyle and fontWeight for normal/400',
+				fontFamilyFaces: [
+					{
+						fontFamily: 'IBM Plex Mono',
+						fontStyle: 'normal',
+						fontWeight: '400',
+						src: [
+							'file:./assets/fonts/ibm-plex-mono/IBMPlexMono-Regular.woff2',
+						],
+					},
+					{
+						fontFamily: 'IBM Plex Mono',
+						fontStyle: 'italic',
+						fontWeight: '400',
+						src: [
+							'file:./assets/fonts/ibm-plex-mono/IBMPlexMono-Italic.woff2',
+						],
+					},
+					{
+						fontFamily: 'IBM Plex Mono',
+						fontStyle: 'normal',
+						fontWeight: '700',
+						src: [
+							'file:./assets/fonts/ibm-plex-mono/IBMPlexMono-Bold.woff2',
+						],
+					},
+				],
+				fontStyle: 'normal',
+				fontWeight: '400',
+				expected: {
+					nearestFontStyle: 'normal',
+					nearestFontWeight: '400',
+				},
+			},
+			{
+				message:
+					'should return nearest fontStyle and fontWeight for normal/100',
+				fontFamilyFaces: [
+					{
+						fontFamily: 'IBM Plex Mono',
+						fontStyle: 'normal',
+						fontWeight: '400',
+						src: [
+							'file:./assets/fonts/ibm-plex-mono/IBMPlexMono-Regular.woff2',
+						],
+					},
+					{
+						fontFamily: 'IBM Plex Mono',
+						fontStyle: 'italic',
+						fontWeight: '400',
+						src: [
+							'file:./assets/fonts/ibm-plex-mono/IBMPlexMono-Italic.woff2',
+						],
+					},
+					{
+						fontFamily: 'IBM Plex Mono',
+						fontStyle: 'normal',
+						fontWeight: '700',
+						src: [
+							'file:./assets/fonts/ibm-plex-mono/IBMPlexMono-Bold.woff2',
+						],
+					},
+				],
+				fontStyle: 'normal',
+				fontWeight: '100',
+				expected: {
+					nearestFontStyle: 'normal',
+					nearestFontWeight: '400',
+				},
+			},
+			{
+				message:
+					'should return nearest fontStyle and fontWeight for italic/900',
+				fontFamilyFaces: [
+					{
+						fontFamily: 'IBM Plex Mono',
+						fontStyle: 'normal',
+						fontWeight: '400',
+						src: [
+							'file:./assets/fonts/ibm-plex-mono/IBMPlexMono-Regular.woff2',
+						],
+					},
+					{
+						fontFamily: 'IBM Plex Mono',
+						fontStyle: 'italic',
+						fontWeight: '400',
+						src: [
+							'file:./assets/fonts/ibm-plex-mono/IBMPlexMono-Italic.woff2',
+						],
+					},
+					{
+						fontFamily: 'IBM Plex Mono',
+						fontStyle: 'normal',
+						fontWeight: '700',
+						src: [
+							'file:./assets/fonts/ibm-plex-mono/IBMPlexMono-Bold.woff2',
+						],
+					},
+				],
+				fontStyle: 'italic',
+				fontWeight: '900',
+				expected: {
+					nearestFontStyle: 'italic',
+					nearestFontWeight: '700',
+				},
+			},
+			{
+				message:
+					'should return nearest fontStyle and fontWeight for oblique/600',
+				fontFamilyFaces: [
+					{
+						fontFamily: 'IBM Plex Mono',
+						fontStyle: 'normal',
+						fontWeight: '400',
+						src: [
+							'file:./assets/fonts/ibm-plex-mono/IBMPlexMono-Regular.woff2',
+						],
+					},
+					{
+						fontFamily: 'IBM Plex Mono',
+						fontStyle: 'italic',
+						fontWeight: '700',
+						src: [
+							'file:./assets/fonts/ibm-plex-mono/IBMPlexMono-Bold.woff2',
+						],
+					},
+				],
+				fontStyle: 'oblique',
+				fontWeight: '600',
+				expected: {
+					nearestFontStyle: 'italic',
+					nearestFontWeight: '700',
+				},
+			},
+			{
+				message:
+					'should return nearest fontStyle and fontWeight for 300 font weight and empty font style',
+				fontFamilyFaces: [
+					{
+						fontFamily: 'IBM Plex Mono',
+						fontStyle: 'normal',
+						fontWeight: '400',
+						src: [
+							'file:./assets/fonts/ibm-plex-mono/IBMPlexMono-Regular.woff2',
+						],
+					},
+					{
+						fontFamily: 'IBM Plex Mono',
+						fontStyle: 'italic',
+						fontWeight: '700',
+						src: [
+							'file:./assets/fonts/ibm-plex-mono/IBMPlexMono-Bold.woff2',
+						],
+					},
+				],
+				fontStyle: undefined,
+				fontWeight: '300',
+				expected: {
+					nearestFontStyle: 'normal',
+					nearestFontWeight: '400',
+				},
+			},
+			{
+				message:
+					'should return nearest fontStyle and fontWeight for oblique font style and empty font weight',
+				fontFamilyFaces: [
+					{
+						fontFamily: 'IBM Plex Mono',
+						fontStyle: 'normal',
+						fontWeight: '400',
+						src: [
+							'file:./assets/fonts/ibm-plex-mono/IBMPlexMono-Regular.woff2',
+						],
+					},
+					{
+						fontFamily: 'IBM Plex Mono',
+						fontStyle: 'italic',
+						fontWeight: '700',
+						src: [
+							'file:./assets/fonts/ibm-plex-mono/IBMPlexMono-Bold.woff2',
+						],
+					},
+				],
+				fontStyle: 'oblique',
+				fontWeight: undefined,
+				expected: {
+					nearestFontStyle: 'italic',
+					nearestFontWeight: '400',
+				},
+			},
+		].forEach(
+			( {
+				message,
+				fontFamilyFaces,
+				fontStyle,
+				fontWeight,
+				expected,
+			} ) => {
+				it( `${ message }`, () => {
+					expect(
+						findNearestStyleAndWeight(
+							fontFamilyFaces,
+							fontStyle,
+							fontWeight
+						)
+					).toEqual( expected );
+				} );
+			}
+		);
+	} );
+
 	describe( 'typography utils', () => {
 		[
 			{

package/src/components/global-styles/test/use-global-styles-output.js

@@ -107,6 +107,7 @@ describe( 'global styles renderer', () => {
 						},
 					},
 					selector: ROOT_BLOCK_SELECTOR,
+					skipSelectorWrapper: true,
 				},
 				{
 					styles: {
@@ -128,6 +129,7 @@ describe( 'global styles renderer', () => {
 						},
 					},
 					selector: ELEMENTS.link,
+					skipSelectorWrapper: true,
 				},
 				{
 					styles: {
@@ -480,7 +482,7 @@ describe( 'global styles renderer', () => {
 			};
 
 			expect( toStyles( tree, blockSelectors ) ).toEqual(
-				':where(body) {margin: 0;}.is-layout-flow > .alignleft { float: left; margin-inline-start: 0; margin-inline-end: 2em; }.is-layout-flow > .alignright { float: right; margin-inline-start: 2em; margin-inline-end: 0; }.is-layout-flow > .aligncenter { margin-left: auto !important; margin-right: auto !important; }.is-layout-constrained > .alignleft { float: left; margin-inline-start: 0; margin-inline-end: 2em; }.is-layout-constrained > .alignright { float: right; margin-inline-start: 2em; margin-inline-end: 0; }.is-layout-constrained > .aligncenter { margin-left: auto !important; margin-right: auto !important; }.is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)) { max-width: var(--wp--style--global--content-size); margin-left: auto !important; margin-right: auto !important; }.is-layout-constrained > .alignwide { max-width: var(--wp--style--global--wide-size); }body .is-layout-flex { display:flex; }.is-layout-flex { flex-wrap: wrap; align-items: center; }.is-layout-flex > :is(*, div) { margin: 0; }body .is-layout-grid { display:grid; }.is-layout-grid > :is(*, div) { margin: 0; }:root :where(body){background-color: red;margin: 10px;padding: 10px;}:root :where(a:where(:not(.wp-element-button))){color: blue;}a:where(:not(.wp-element-button)):hover{color: orange;}a:where(:not(.wp-element-button)):focus{color: orange;}:root :where(h1){font-size: 42px;}:root :where(.wp-block-group){margin-top: 10px;margin-right: 20px;margin-bottom: 30px;margin-left: 40px;padding-top: 11px;padding-right: 22px;padding-bottom: 33px;padding-left: 44px;}:root :where(h1,h2,h3,h4,h5,h6){color: orange;}:root :where(h1 a:where(:not(.wp-element-button)),h2 a:where(:not(.wp-element-button)),h3 a:where(:not(.wp-element-button)),h4 a:where(:not(.wp-element-button)),h5 a:where(:not(.wp-element-button)),h6 a:where(:not(.wp-element-button))){color: hotpink;}h1 a:where(:not(.wp-element-button)):hover,h2 a:where(:not(.wp-element-button)):hover,h3 a:where(:not(.wp-element-button)):hover,h4 a:where(:not(.wp-element-button)):hover,h5 a:where(:not(.wp-element-button)):hover,h6 a:where(:not(.wp-element-button)):hover{color: red;}h1 a:where(:not(.wp-element-button)):focus,h2 a:where(:not(.wp-element-button)):focus,h3 a:where(:not(.wp-element-button)):focus,h4 a:where(:not(.wp-element-button)):focus,h5 a:where(:not(.wp-element-button)):focus,h6 a:where(:not(.wp-element-button)):focus{color: red;}:root :where(.wp-block-image img, .wp-block-image .wp-crop-area){border-radius: 9999px;}:root :where(.wp-block-image){color: red;}.wp-site-blocks > .alignleft { float: left; margin-right: 2em; }.wp-site-blocks > .alignright { float: right; margin-left: 2em; }.wp-site-blocks > .aligncenter { justify-content: center; margin-left: auto; margin-right: auto; }.has-white-color{color: var(--wp--preset--color--white) !important;}.has-white-background-color{background-color: var(--wp--preset--color--white) !important;}.has-white-border-color{border-color: var(--wp--preset--color--white) !important;}.has-black-color{color: var(--wp--preset--color--black) !important;}.has-black-background-color{background-color: var(--wp--preset--color--black) !important;}.has-black-border-color{border-color: var(--wp--preset--color--black) !important;}h1.has-blue-color,h2.has-blue-color,h3.has-blue-color,h4.has-blue-color,h5.has-blue-color,h6.has-blue-color{color: var(--wp--preset--color--blue) !important;}h1.has-blue-background-color,h2.has-blue-background-color,h3.has-blue-background-color,h4.has-blue-background-color,h5.has-blue-background-color,h6.has-blue-background-color{background-color: var(--wp--preset--color--blue) !important;}h1.has-blue-border-color,h2.has-blue-border-color,h3.has-blue-border-color,h4.has-blue-border-color,h5.has-blue-border-color,h6.has-blue-border-color{border-color: var(--wp--preset--color--blue) !important;}'
+				':where(body) {margin: 0;}.is-layout-flow > .alignleft { float: left; margin-inline-start: 0; margin-inline-end: 2em; }.is-layout-flow > .alignright { float: right; margin-inline-start: 2em; margin-inline-end: 0; }.is-layout-flow > .aligncenter { margin-left: auto !important; margin-right: auto !important; }.is-layout-constrained > .alignleft { float: left; margin-inline-start: 0; margin-inline-end: 2em; }.is-layout-constrained > .alignright { float: right; margin-inline-start: 2em; margin-inline-end: 0; }.is-layout-constrained > .aligncenter { margin-left: auto !important; margin-right: auto !important; }.is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)) { max-width: var(--wp--style--global--content-size); margin-left: auto !important; margin-right: auto !important; }.is-layout-constrained > .alignwide { max-width: var(--wp--style--global--wide-size); }body .is-layout-flex { display:flex; }.is-layout-flex { flex-wrap: wrap; align-items: center; }.is-layout-flex > :is(*, div) { margin: 0; }body .is-layout-grid { display:grid; }.is-layout-grid > :is(*, div) { margin: 0; }body{background-color: red;margin: 10px;padding: 10px;}a:where(:not(.wp-element-button)){color: blue;}:root :where(a:where(:not(.wp-element-button)):hover){color: orange;}:root :where(a:where(:not(.wp-element-button)):focus){color: orange;}h1{font-size: 42px;}:root :where(.wp-block-group){margin-top: 10px;margin-right: 20px;margin-bottom: 30px;margin-left: 40px;padding-top: 11px;padding-right: 22px;padding-bottom: 33px;padding-left: 44px;}:root :where(h1,h2,h3,h4,h5,h6){color: orange;}:root :where(h1 a:where(:not(.wp-element-button)),h2 a:where(:not(.wp-element-button)),h3 a:where(:not(.wp-element-button)),h4 a:where(:not(.wp-element-button)),h5 a:where(:not(.wp-element-button)),h6 a:where(:not(.wp-element-button))){color: hotpink;}:root :where(h1 a:where(:not(.wp-element-button)):hover,h2 a:where(:not(.wp-element-button)):hover,h3 a:where(:not(.wp-element-button)):hover,h4 a:where(:not(.wp-element-button)):hover,h5 a:where(:not(.wp-element-button)):hover,h6 a:where(:not(.wp-element-button)):hover){color: red;}:root :where(h1 a:where(:not(.wp-element-button)):focus,h2 a:where(:not(.wp-element-button)):focus,h3 a:where(:not(.wp-element-button)):focus,h4 a:where(:not(.wp-element-button)):focus,h5 a:where(:not(.wp-element-button)):focus,h6 a:where(:not(.wp-element-button)):focus){color: red;}:root :where(.wp-block-image img, .wp-block-image .wp-crop-area){border-radius: 9999px;}:root :where(.wp-block-image){color: red;}.wp-site-blocks > .alignleft { float: left; margin-right: 2em; }.wp-site-blocks > .alignright { float: right; margin-left: 2em; }.wp-site-blocks > .aligncenter { justify-content: center; margin-left: auto; margin-right: auto; }.has-white-color{color: var(--wp--preset--color--white) !important;}.has-white-background-color{background-color: var(--wp--preset--color--white) !important;}.has-white-border-color{border-color: var(--wp--preset--color--white) !important;}.has-black-color{color: var(--wp--preset--color--black) !important;}.has-black-background-color{background-color: var(--wp--preset--color--black) !important;}.has-black-border-color{border-color: var(--wp--preset--color--black) !important;}h1.has-blue-color,h2.has-blue-color,h3.has-blue-color,h4.has-blue-color,h5.has-blue-color,h6.has-blue-color{color: var(--wp--preset--color--blue) !important;}h1.has-blue-background-color,h2.has-blue-background-color,h3.has-blue-background-color,h4.has-blue-background-color,h5.has-blue-background-color,h6.has-blue-background-color{background-color: var(--wp--preset--color--blue) !important;}h1.has-blue-border-color,h2.has-blue-border-color,h3.has-blue-border-color,h4.has-blue-border-color,h5.has-blue-border-color,h6.has-blue-border-color{border-color: var(--wp--preset--color--blue) !important;}'
 			);
 		} );