Upstream/WordPress
1
0
Fork 0
mirror of https://github.com/WordPress/WordPress.git synced 2024-09-27 14:53:08 +02:00
Code Issues Projects Releases Wiki Activity

Editor: Improve how min/max font sizes are calculated for fluid typography.

Browse Source 
- Where no fluid max values are set (e.g., single or custom font size values), the "size" value will act as the maximum value in a `clamp()` function.
- In the absence of any fluid `min`/`max` values, the lower bound rule of `>16px` will be enforced. This applies to custom values from the editor or single-value `theme.json` styles. Font sizes below this will not be clamped.
- In a preset, if a `fluid.min` value has been specified, the lower bound rule of `>16px` won't be enforced on this value. Presets with a fluid object therefore, give precedence to theme author's values.
- In a preset, if there is NOT a `fluid.max` but there is `fluid.min`, use the incoming "size" value as the `max`.
- In a preset, if there is NOT a `fluid.min` but there is a `fluid.max`, use `size * min_size_factor` as the `min`. The lower bound rule of `>16px` is enforced here, because the block editor is computing the `min` value. This is consistent with the way minimum sizes are calculated for single or custom values.


Props ramonopoly, mamaduka, andrewserong, aristath, joen, desrosj.
Fixes #57075.
Built from https://develop.svn.wordpress.org/trunk@54823


git-svn-id: http://core.svn.wordpress.org/trunk@54375 1a063a9b-81f0-0310-95a4-ce76da25c4cd
This commit is contained in:
desrosj 2022-11-11 17:48:12 +00:00
parent 39f1141e78
commit face84c028
2 changed files with 34 additions and 32 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

64
wp-includes/block-supports/typography.php
View File

@ -452,6 +452,7 @@ function wp_get_computed_fluid_typography_value( $args = array() ) {
* formula depending on available, valid values.
*
* @since 6.1.0
* @since 6.1.1 Adjusted rules for min and max font sizes.
*
* @param array $preset {
* Required. fontSizes preset value as seen in theme.json.
@ -489,7 +490,6 @@ function wp_get_typography_font_size_value( $preset, $should_use_fluid_typograph
$default_maximum_viewport_width = '1600px';
$default_minimum_viewport_width = '768px';
$default_minimum_font_size_factor = 0.75;
$default_maximum_font_size_factor = 1.5;
$default_scale_factor = 1;
$default_minimum_font_size_limit = '14px';
@ -508,22 +508,15 @@ function wp_get_typography_font_size_value( $preset, $should_use_fluid_typograph
// Font sizes.
$preferred_size = wp_get_typography_value_and_unit( $preset['size'] );
// Protect against unsupported units.
// Protects against unsupported units.
if ( empty( $preferred_size['unit'] ) ) {
return $preset['size'];
}
// If no fluid max font size is available, create one using max font size factor.
if ( ! $maximum_font_size_raw ) {
$maximum_font_size_raw = round( $preferred_size['value'] * $default_maximum_font_size_factor, 3 ) . $preferred_size['unit'];
}
// If no fluid min font size is available, create one using min font size factor.
if ( ! $minimum_font_size_raw ) {
$minimum_font_size_raw = round( $preferred_size['value'] * $default_minimum_font_size_factor, 3 ) . $preferred_size['unit'];
}
// Normalizes the minimum font size limit according to the incoming unit, so we can perform checks using it.
/*
* Normalizes the minimum font size limit according to the incoming unit,
* in order to perform comparative checks.
*/
$minimum_font_size_limit = wp_get_typography_value_and_unit(
$default_minimum_font_size_limit,
array(
@ -531,29 +524,38 @@ function wp_get_typography_font_size_value( $preset, $should_use_fluid_typograph
)
);
if ( ! empty( $minimum_font_size_limit ) ) {
// Don't enforce minimum font size if a font size has explicitly set a min and max value.
if ( ! empty( $minimum_font_size_limit ) && ( ! $minimum_font_size_raw && ! $maximum_font_size_raw ) ) {
/*
* If a minimum size was not passed to this function
* and the user-defined font size is lower than $minimum_font_size_limit,
* then use the user-defined font size as the minimum font-size.
* do not calculate a fluid value.
*/
if ( ! isset( $fluid_font_size_settings['min'] ) && $preferred_size['value'] < $minimum_font_size_limit['value'] ) {
$minimum_font_size_raw = implode( '', $preferred_size );
} else {
$minimum_font_size_parsed = wp_get_typography_value_and_unit(
$minimum_font_size_raw,
array(
'coerce_to' => $preferred_size['unit'],
)
);
if ( $preferred_size['value'] <= $minimum_font_size_limit['value'] ) {
return $preset['size'];
}
}
/*
* If the passed or calculated minimum font size is lower than $minimum_font_size_limit
* use $minimum_font_size_limit instead.
*/
if ( ! empty( $minimum_font_size_parsed ) && $minimum_font_size_parsed['value'] < $minimum_font_size_limit['value'] ) {
$minimum_font_size_raw = implode( '', $minimum_font_size_limit );
}
// If no fluid max font size is available use the incoming value.
if ( ! $maximum_font_size_raw ) {
$maximum_font_size_raw = $preferred_size['value'] . $preferred_size['unit'];
}
/*
* If no minimumFontSize is provided, create one using
* the given font size multiplied by the min font size scale factor.
*/
if ( ! $minimum_font_size_raw ) {
$calculated_minimum_font_size = round(
$preferred_size['value'] * $default_minimum_font_size_factor,
3
);
// Only use calculated min font size if it's > $minimum_font_size_limit value.
if ( ! empty( $minimum_font_size_limit ) && $calculated_minimum_font_size <= $minimum_font_size_limit['value'] ) {
$minimum_font_size_raw = $minimum_font_size_limit['value'] . $minimum_font_size_limit['unit'];
} else {
$minimum_font_size_raw = $calculated_minimum_font_size . $preferred_size['unit'];
}
}

2
wp-includes/version.php
View File

@ -16,7 +16,7 @@
*
* @global string $wp_version
*/
$wp_version = '6.2-alpha-54821';
$wp_version = '6.2-alpha-54823';
/**
* Holds the WordPress DB revision, increments when changes are made to the WordPress DB schema.