Make WordPress Core


Ignore:
Timestamp:
02/13/2023 02:31:06 PM (16 months ago)
Author:
hellofromTonya
Message:

Themes: Remove local() from @font-face styles in _wp_theme_json_webfonts_handler().

Removes adding local() as a @font-face src within _wp_theme_json_webfonts_handler().

Why?

To fix font incompatibilities when a user has the font-family locally installed on their viewing computer or device. It's unknown if all of the font-face variations specified by theme.json and/or global styles are:

  • installed on the user's computer/device.
  • and in one file or multiple files.

The previous implementation used the src specified when registering the font with the API. That src will likely vary from user computer/device to user computer/device.

To avoid these unknowns which could cause incompatibilities or styling issues, this changeset removes adding local() to the generated font-face CSS styles.

References:

Follow-up to [53282].

Props luehrsen, aristath, ehtmlu, hellofromTonya, wetah.
Fixes #57430.

File:
1 edited

Legend:

Unmodified
Added
Removed
  • trunk/tests/phpunit/tests/webfonts/wpThemeJsonWebfontsHandler.php

    r55086 r55314  
    7777     * @ticket 55567
    7878     * @ticket 46370
     79     * @ticket 57430
    7980     */
    8081    public function test_font_face_generated_from_themejson() {
     
    8384        $expected = <<<EOF
    8485<style id='wp-webfonts-inline-css' type='text/css'>
    85 @font-face{font-family:"Source Serif Pro";font-style:normal;font-weight:200 900;font-display:fallback;src:local("Source Serif Pro"), url('THEME_ROOT_URL/assets/fonts/SourceSerif4Variable-Roman.ttf.woff2') format('woff2');font-stretch:normal;}@font-face{font-family:"Source Serif Pro";font-style:italic;font-weight:200 900;font-display:fallback;src:local("Source Serif Pro"), url('THEME_ROOT_URL/assets/fonts/SourceSerif4Variable-Italic.ttf.woff2') format('woff2');font-stretch:normal;}
     86@font-face{font-family:"Source Serif Pro";font-style:normal;font-weight:200 900;font-display:fallback;src:url('THEME_ROOT_URL/assets/fonts/SourceSerif4Variable-Roman.ttf.woff2') format('woff2');font-stretch:normal;}@font-face{font-family:"Source Serif Pro";font-style:italic;font-weight:200 900;font-display:fallback;src:url('THEME_ROOT_URL/assets/fonts/SourceSerif4Variable-Italic.ttf.woff2') format('woff2');font-stretch:normal;}
    8687</style>
    8788EOF;
Note: See TracChangeset for help on using the changeset viewer.