fix (blocksy): add support for CSS custom property font family (#3436)

Co-authored-by: [email protected] <>
gambitph · Feb 14, 2025 · f4b9f6a · f4b9f6a
1 parent f65d27e
commit f4b9f6a
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 0 deletions.
diff --git a/src/global-settings.php b/src/global-settings.php
@@ -688,6 +688,11 @@ public function get_font_family( $font_name ) {
 				return '-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"';
 			}
 
+			// If the font is a CSS custom property, return it directly.
+			if ( strpos( $font_name, 'var(' ) === 0 ) {
+				return $font_name;
+			}
+
 			// Google font.
 			return '"' . $font_name . '", sans-serif';
 		}

diff --git a/src/util/font.js b/src/util/font.js
@@ -89,6 +89,11 @@ export const isGoogleFontEnqueued = ( fontName, head = document.querySelector( '
 }
 
 export const getFontFamily = fontName => {
+	// If the font is a CSS custom property, return it directly.
+	if ( fontName.match( /^\s*var\(--/ ) ) {
+		return fontName
+	}
+
 	// Google Font.
 	if ( isWebFont( fontName ) ) {
 		return `"${ fontName }", Sans-serif`