Make WordPress Core

Changeset 57253


Ignore:
Timestamp:
01/09/2024 02:43:48 AM (3 months ago)
Author:
isabel_brison
Message:

Editor: add CSS var parsing for fontSize and fontFamily.

Adds capability to parse CSS custom properties for fontSize and fontFamily in WP_Style_Engine.

Props ramonopoly.
Fixes #59982.

Location:
trunk
Files:
2 edited

Legend:

Unmodified
Added
Removed
  • trunk/src/wp-includes/style-engine/class-wp-style-engine.php

    r56640 r57253  
    216216                ),
    217217                'path'          => array( 'typography', 'fontSize' ),
     218                'css_vars'      => array(
     219                    'font-size' => '--wp--preset--font-size--$slug',
     220                ),
    218221                'classnames'    => array(
    219222                    'has-$slug-font-size' => 'font-size',
     
    223226                'property_keys' => array(
    224227                    'default' => 'font-family',
     228                ),
     229                'css_vars'      => array(
     230                    'font-family' => '--wp--preset--font-family--$slug',
    225231                ),
    226232                'path'          => array( 'typography', 'fontFamily' ),
  • trunk/tests/phpunit/tests/style-engine/styleEngine.php

    r56614 r57253  
    253253            'elements_with_css_var_value'                  => array(
    254254                'block_styles'    => array(
    255                     'color' => array(
     255                    'color'      => array(
    256256                        'text' => 'var:preset|color|my-little-pony',
     257                    ),
     258                    'typography' => array(
     259                        'fontSize'   => 'var:preset|font-size|cabbage-patch',
     260                        'fontFamily' => 'var:preset|font-family|transformers',
    257261                    ),
    258262                ),
     
    261265                ),
    262266                'expected_output' => array(
    263                     'css'          => '.wp-selector{color:var(--wp--preset--color--my-little-pony);}',
    264                     'declarations' => array(
    265                         'color' => 'var(--wp--preset--color--my-little-pony)',
    266                     ),
    267                     'classnames'   => 'has-text-color has-my-little-pony-color',
     267                    'css'          => '.wp-selector{color:var(--wp--preset--color--my-little-pony);font-size:var(--wp--preset--font-size--cabbage-patch);font-family:var(--wp--preset--font-family--transformers);}',
     268                    'declarations' => array(
     269                        'color'       => 'var(--wp--preset--color--my-little-pony)',
     270                        'font-size'   => 'var(--wp--preset--font-size--cabbage-patch)',
     271                        'font-family' => 'var(--wp--preset--font-family--transformers)',
     272
     273                    ),
     274                    'classnames'   => 'has-text-color has-my-little-pony-color has-cabbage-patch-font-size has-transformers-font-family',
    268275                ),
    269276            ),
Note: See TracChangeset for help on using the changeset viewer.