mirror of
https://github.com/gosticks/wordpress-develop.git
synced 2025-10-16 12:05:38 +00:00
Editor: Adds 'settings.typography.fluid.minFontSize' support to wp_get_typography_font_size_value().
In `wp_get_typography_font_size_value()`, adds support for using a minimum font size for fluid typography when defined in a theme's `theme.json` file. Reference: * Part of [https://github.com/WordPress/gutenberg/pull/42489 Gutenberg PR 42489] Follow-up to [54497], [54260]. Props andrewserong, ramonopoly, hellofromTonya, joen. Fixes #57529. git-svn-id: https://develop.svn.wordpress.org/trunk@55133 602fd350-edb4-49c9-b593-d223f7449a82
This commit is contained in:
Tonya Mork
parent
119ec3240e
commit
e4ccebf2d7
@ -453,6 +453,7 @@ function wp_get_computed_fluid_typography_value( $args = array() ) {
|
||||
*
|
||||
* @since 6.1.0
|
||||
* @since 6.1.1 Adjusted rules for min and max font sizes.
|
||||
* @since 6.2.0 Added 'settings.typography.fluid.minFontSize' support.
|
||||
*
|
||||
* @param array $preset {
|
||||
* Required. fontSizes preset value as seen in theme.json.
|
||||
@ -479,19 +480,29 @@ function wp_get_typography_font_size_value( $preset, $should_use_fluid_typograph
|
||||
}
|
||||
|
||||
// Checks if fluid font sizes are activated.
|
||||
$typography_settings = wp_get_global_settings( array( 'typography' ) );
|
||||
$should_use_fluid_typography = isset( $typography_settings['fluid'] ) && true === $typography_settings['fluid'] ? true : $should_use_fluid_typography;
|
||||
$typography_settings = wp_get_global_settings( array( 'typography' ) );
|
||||
if (
|
||||
isset( $typography_settings['fluid'] ) &&
|
||||
( true === $typography_settings['fluid'] || is_array( $typography_settings['fluid'] ) )
|
||||
) {
|
||||
$should_use_fluid_typography = true;
|
||||
}
|
||||
|
||||
if ( ! $should_use_fluid_typography ) {
|
||||
return $preset['size'];
|
||||
}
|
||||
|
||||
$fluid_settings = isset( $typography_settings['fluid'] ) && is_array( $typography_settings['fluid'] )
|
||||
? $typography_settings['fluid']
|
||||
: array();
|
||||
|
||||
// Defaults.
|
||||
$default_maximum_viewport_width = '1600px';
|
||||
$default_minimum_viewport_width = '768px';
|
||||
$default_minimum_font_size_factor = 0.75;
|
||||
$default_scale_factor = 1;
|
||||
$default_minimum_font_size_limit = '14px';
|
||||
$has_min_font_size = isset( $fluid_settings['minFontSize'] ) && ! empty( wp_get_typography_value_and_unit( $fluid_settings['minFontSize'] ) );
|
||||
$default_minimum_font_size_limit = $has_min_font_size ? $fluid_settings['minFontSize'] : '14px';
|
||||
|
||||
// Font sizes.
|
||||
$fluid_font_size_settings = isset( $preset['fluid'] ) ? $preset['fluid'] : null;
|
||||
|
||||
@ -0,0 +1,8 @@
|
||||
/*
|
||||
Theme Name: Block Theme Child Theme With Fluid Typography Config
|
||||
Theme URI: https://wordpress.org/
|
||||
Description: For testing purposes only.
|
||||
Template: block-theme
|
||||
Version: 1.0.0
|
||||
Text Domain: block-theme-child-with-fluid-typography
|
||||
*/
|
||||
@ -0,0 +1,11 @@
|
||||
{
|
||||
"version": 2,
|
||||
"settings": {
|
||||
"appearanceTools": true,
|
||||
"typography": {
|
||||
"fluid": {
|
||||
"minFontSize": "16px"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -567,21 +567,18 @@ class Tests_Block_Supports_Typography extends WP_UnitTestCase {
|
||||
*
|
||||
* @ticket 56467
|
||||
* @ticket 57065
|
||||
* @ticket 57529
|
||||
*
|
||||
* @covers ::wp_register_typography_support
|
||||
*
|
||||
* @dataProvider data_generate_block_supports_font_size_fixtures
|
||||
*
|
||||
* @param string $font_size_value The block supports custom font size value.
|
||||
* @param bool $should_use_fluid_typography An override to switch fluid typography "on". Can be used for unit testing.
|
||||
* @param string $expected_output Expected value of style property from wp_apply_typography_support().
|
||||
* @param string $font_size_value The block supports custom font size value.
|
||||
* @param string $theme_slug A theme slug corresponding to an available test theme.
|
||||
* @param string $expected_output Expected value of style property from wp_apply_typography_support().
|
||||
*/
|
||||
public function test_should_covert_font_sizes_to_fluid_values( $font_size_value, $should_use_fluid_typography, $expected_output ) {
|
||||
if ( $should_use_fluid_typography ) {
|
||||
switch_theme( 'block-theme-child-with-fluid-typography' );
|
||||
} else {
|
||||
switch_theme( 'default' );
|
||||
}
|
||||
public function test_should_covert_font_sizes_to_fluid_values( $font_size_value, $theme_slug, $expected_output ) {
|
||||
switch_theme( $theme_slug );
|
||||
|
||||
$this->test_block_name = 'test/font-size-fluid-value';
|
||||
register_block_type(
|
||||
@ -623,15 +620,30 @@ class Tests_Block_Supports_Typography extends WP_UnitTestCase {
|
||||
*/
|
||||
public function data_generate_block_supports_font_size_fixtures() {
|
||||
return array(
|
||||
'default_return_value' => array(
|
||||
'font_size_value' => '50px',
|
||||
'should_use_fluid_typography' => false,
|
||||
'expected_output' => 'font-size:50px;',
|
||||
'returns value when fluid typography is not active' => array(
|
||||
'font_size_value' => '15px',
|
||||
'theme_slug' => 'default',
|
||||
'expected_output' => 'font-size:15px;',
|
||||
),
|
||||
'return_value_with_fluid_typography' => array(
|
||||
'font_size_value' => '50px',
|
||||
'should_use_fluid_typography' => true,
|
||||
'expected_output' => 'font-size:clamp(37.5px, 2.344rem + ((1vw - 7.68px) * 1.502), 50px);',
|
||||
'returns clamp value using default config' => array(
|
||||
'font_size_value' => '15px',
|
||||
'theme_slug' => 'block-theme-child-with-fluid-typography',
|
||||
'expected_output' => 'font-size:clamp(14px, 0.875rem + ((1vw - 7.68px) * 0.12), 15px);',
|
||||
),
|
||||
'returns value when font size <= default min font size bound' => array(
|
||||
'font_size_value' => '13px',
|
||||
'theme_slug' => 'block-theme-child-with-fluid-typography',
|
||||
'expected_output' => 'font-size:13px;',
|
||||
),
|
||||
'returns clamp value using custom fluid config' => array(
|
||||
'font_size_value' => '17px',
|
||||
'theme_slug' => 'block-theme-child-with-fluid-typography-config',
|
||||
'expected_output' => 'font-size:clamp(16px, 1rem + ((1vw - 7.68px) * 0.12), 17px);',
|
||||
),
|
||||
'returns value when font size <= custom min font size bound' => array(
|
||||
'font_size_value' => '15px',
|
||||
'theme_slug' => 'block-theme-child-with-fluid-typography-config',
|
||||
'expected_output' => 'font-size:15px;',
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
@ -180,6 +180,7 @@ class Tests_Theme_ThemeDir extends WP_UnitTestCase {
|
||||
'Block Theme Child Theme',
|
||||
'Block Theme Child with no theme.json',
|
||||
'Block Theme Child Theme With Fluid Typography',
|
||||
'Block Theme Child Theme With Fluid Typography Config',
|
||||
'Block Theme [0.4.0]',
|
||||
'Block Theme [1.0.0] in subdirectory',
|
||||
'Block Theme Deprecated Path',
|
||||
|
||||
Loading…
Reference in New Issue
Block a user