vhad/wordpress-develop
1
0
Fork 0
mirror of https://github.com/gosticks/wordpress-develop.git synced 2026-03-31 18:54:29 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Themes: Add internal-only theme.json's webfonts handler (stopgap).

Browse Source 
Adds `_wp_theme_json_webfonts_handler()` for handling `fontFace` declarations in a theme's `theme.json` file to generate the `@font-face` styles for both the editor and front-end.

Design notes:
* It is not a public API, but rather an internal, Core-only handler.
* It is a stopgap implementation that will be replaced when the public Webfonts API is introduced in Core.
* The code design is intentional, albeit funky, with the purpose of avoiding backwards-compatibility issues when the public Webfonts API is introduced in Core.
   * It hides the inter-workings.
   * Does not exposing API ins and outs for external consumption.
   * Only works for `theme.json`.
   * Does not provide registration or enqueuing access for plugins.

For more context on the decision to include this stopgap and the Webfonts API, see:
* Core's PR 40493 https://github.com/WordPress/gutenberg/pull/40493
* Gutenberg's tracking issue 40472 https://github.com/WordPress/gutenberg/issues/40472

Props aristath, hellofromTonya, peterwilsoncc, costdev, jffng, zieladam, gziolo, bph, jonoaldersonwp, desrosj.

See #55567, #46370.

git-svn-id: https://develop.svn.wordpress.org/trunk@53282 602fd350-edb4-49c9-b593-d223f7449a82
This commit is contained in:
Tonya Mork
2022-04-26 14:46:37 +00:00
parent 60cb20c4cc
commit 02414638ce
14 changed files with 855 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
tests/phpunit/data/themedir1/empty-fontface-theme/functions.php Normal file
View File

@@ -0,0 +1 @@
<?php

4
tests/phpunit/data/themedir1/empty-fontface-theme/index.php Normal file
View File

@@ -0,0 +1,4 @@
<?php
/**
* Block theme.
*/

7
tests/phpunit/data/themedir1/empty-fontface-theme/style.css Normal file
View File

@@ -0,0 +1,7 @@
/*
Theme Name: Empty `fontFace` in theme.json - no webfonts defined
Theme URI: https://wordpress.org/
Description: For testing purposes only.
Version: 1.0.0
Text Domain: empty-fontface-theme
*/

3
tests/phpunit/data/themedir1/empty-fontface-theme/templates/index.html Normal file
View File

@@ -0,0 +1,3 @@
<!-- wp:paragraph -->
<p>Index Template</p>
<!-- /wp:paragraph -->

88
tests/phpunit/data/themedir1/empty-fontface-theme/theme.json Normal file
View File

@@ -0,0 +1,88 @@
{
"version": 2,
"customTemplates": [
{
"name": "blank",
"title": "Blank",
"postTypes": [
"page",
"post"
]
}
],
"settings": {
"appearanceTools": true,
"color": {
"duotone": [],
"gradients": [],
"palette": []
},
"custom": {},
"spacing": {
"units": [
"%",
"px",
"em",
"rem",
"vh",
"vw"
]
},
"typography": {
"dropCap": false,
"fontFamilies": [
{
"fontFamily": "Roboto",
"name": "Roboto",
"slug": "roboto",
"fontFace": []
}
],
"fontSizes": [
{
"size": "1rem",
"slug": "small"
},
{
"size": "1.125rem",
"slug": "medium"
},
{
"size": "1.75rem",
"slug": "large"
},
{
"size": "clamp(1.75rem, 3vw, 2.25rem)",
"slug": "x-large"
}
]
},
"layout": {
"contentSize": "650px",
"wideSize": "1000px"
}
},
"styles": {
"blocks": {},
"color": {
"background": "var(--wp--preset--color--background)",
"text": "var(--wp--preset--color--foreground)"
},
"elements": {},
"spacing": {
"blockGap": "1.5rem"
},
"typography": {
"fontFamily": "var(--wp--preset--font-family--system-font)",
"lineHeight": "var(--wp--custom--typography--line-height--normal)",
"fontSize": "var(--wp--preset--font-size--medium)"
}
},
"templateParts": [
{
"name": "header",
"title": "Header",
"area": "header"
}
]
}

1
tests/phpunit/data/themedir1/webfonts-theme/functions.php Normal file
View File

@@ -0,0 +1 @@
<?php

4
tests/phpunit/data/themedir1/webfonts-theme/index.php Normal file
View File

@@ -0,0 +1,4 @@
<?php
/**
* Block theme.
*/

7
tests/phpunit/data/themedir1/webfonts-theme/style.css Normal file
View File

@@ -0,0 +1,7 @@
/*
Theme Name: Webfonts theme
Theme URI: https://wordpress.org/
Description: For testing purposes only.
Version: 1.0.0
Text Domain: webfonts-theme
*/

3
tests/phpunit/data/themedir1/webfonts-theme/templates/index.html Normal file
View File

@@ -0,0 +1,3 @@
<!-- wp:paragraph -->
<p>Index Template</p>
<!-- /wp:paragraph -->

103
tests/phpunit/data/themedir1/webfonts-theme/theme.json Normal file
View File

@@ -0,0 +1,103 @@
{
"version": 2,
"customTemplates": [
{
"name": "blank",
"title": "Blank",
"postTypes": [
"page",
"post"
]
}
],
"settings": {
"appearanceTools": true,
"color": {
"duotone": [],
"gradients": [],
"palette": []
},
"custom": {},
"spacing": {
"units": [
"%",
"px",
"em",
"rem",
"vh",
"vw"
]
},
"typography": {
"dropCap": false,
"fontFamilies": [
{
"fontFamily": "\"Source Serif Pro\", serif",
"name": "Source Serif Pro",
"slug": "source-serif-pro",
"fontFace": [
{
"fontFamily": "Source Serif Pro",
"fontWeight": "200 900",
"fontStyle": "normal",
"fontStretch": "normal",
"src": [ "file:./assets/fonts/SourceSerif4Variable-Roman.ttf.woff2" ]
},
{
"fontFamily": "Source Serif Pro",
"fontWeight": "200 900",
"fontStyle": "italic",
"fontStretch": "normal",
"src": [ "file:./assets/fonts/SourceSerif4Variable-Italic.ttf.woff2" ]
}
]
}
],
"fontSizes": [
{
"size": "1rem",
"slug": "small"
},
{
"size": "1.125rem",
"slug": "medium"
},
{
"size": "1.75rem",
"slug": "large"
},
{
"size": "clamp(1.75rem, 3vw, 2.25rem)",
"slug": "x-large"
}
]
},
"layout": {
"contentSize": "650px",
"wideSize": "1000px"
}
},
"styles": {
"blocks": {},
"color": {
"background": "var(--wp--preset--color--background)",
"text": "var(--wp--preset--color--foreground)"
},
"elements": {},
"spacing": {
"blockGap": "1.5rem"
},
"typography": {
"fontFamily": "var(--wp--preset--font-family--system-font)",
"lineHeight": "var(--wp--custom--typography--line-height--normal)",
"fontSize": "var(--wp--preset--font-size--medium)"
}
},
"templateParts": [
{
"name": "header",
"title": "Header",
"area": "header"
}
]
}