vhad/wordpress-develop
1
0
Fork 0
mirror of https://github.com/gosticks/wordpress-develop.git synced 2026-06-28 22:30:04 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Editor: introduce dimensions.aspectRatio block support.

Browse Source 
Adds front end rendering logic for the `dimensions.aspectRatio` block support as well as the required logic in `WP_Theme_JSON` and the style engine.

Props andrewserong.
Fixes #60365.


git-svn-id: https://develop.svn.wordpress.org/trunk@57491 602fd350-edb4-49c9-b593-d223f7449a82
This commit is contained in:
Isabel Brison
2024-01-31 02:52:25 +00:00
parent 5a59dbed82
commit 5d3f66ac5b
6 changed files with 318 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

26
src/wp-includes/class-wp-theme-json.php
View File

@@ -204,10 +204,12 @@ class WP_Theme_JSON {
* @since 6.2.0 Added `outline-*`, and `min-height` properties.
* @since 6.3.0 Added `column-count` property.
* @since 6.4.0 Added `writing-mode` property.
* @since 6.5.0 Added `aspect-ratio` property.
*
* @var array
*/
const PROPERTIES_METADATA = array(
'aspect-ratio' => array( 'dimensions', 'aspectRatio' ),
'background' => array( 'color', 'gradient' ),
'background-color' => array( 'color', 'background' ),
'border-radius' => array( 'border', 'radius' ),
@@ -344,8 +346,8 @@ class WP_Theme_JSON {
* @since 6.3.0 Added support for `typography.textColumns`, removed `layout.definitions`.
* @since 6.4.0 Added support for `layout.allowEditing`, `background.backgroundImage`,
* `typography.writingMode`, `lightbox.enabled` and `lightbox.allowEditing`.
* @since 6.5.0 Added support for `layout.allowCustomContentAndWideSize` and
* `background.backgroundSize`.
* @since 6.5.0 Added support for `layout.allowCustomContentAndWideSize`,
* `background.backgroundSize` and `dimensions.aspectRatio`.
* @var array
*/
const VALID_SETTINGS = array(
@@ -380,7 +382,8 @@ class WP_Theme_JSON {
),
'custom' => null,
'dimensions' => array(
'minHeight' => null,
'aspectRatio' => null,
'minHeight' => null,
),
'layout' => array(
'contentSize' => null,
@@ -438,6 +441,7 @@ class WP_Theme_JSON {
* updated `blockGap` to be allowed at any level.
* @since 6.2.0 Added `outline`, and `minHeight` properties.
* @since 6.3.0 Added support for `typography.textColumns`.
* @since 6.5.0 Added support for `dimensions.aspectRatio`.
*
* @var array
*/
@@ -458,7 +462,8 @@ class WP_Theme_JSON {
'text' => null,
),
'dimensions' => array(
'minHeight' => null,
'aspectRatio' => null,
'minHeight' => null,
),
'filter' => array(
'duotone' => null,
@@ -575,7 +580,7 @@ class WP_Theme_JSON {
* @since 6.0.0
* @since 6.2.0 Added `dimensions.minHeight` and `position.sticky`.
* @since 6.4.0 Added `background.backgroundImage`.
* @since 6.5.0 Added `background.backgroundSize`.
* @since 6.5.0 Added `background.backgroundSize` and `dimensions.aspectRatio`.
* @var array
*/
const APPEARANCE_TOOLS_OPT_INS = array(
@@ -589,6 +594,7 @@ class WP_Theme_JSON {
array( 'color', 'heading' ),
array( 'color', 'button' ),
array( 'color', 'caption' ),
array( 'dimensions', 'aspectRatio' ),
array( 'dimensions', 'minHeight' ),
array( 'position', 'sticky' ),
array( 'spacing', 'blockGap' ),
@@ -1921,6 +1927,7 @@ class WP_Theme_JSON {
* @since 5.8.0
* @since 5.9.0 Added the `$settings` and `$properties` parameters.
* @since 6.1.0 Added `$theme_json`, `$selector`, and `$use_root_padding` parameters.
* @since 6.5.0 Output a `min-height: unset` rule when `aspect-ratio` is set.
*
* @param array $styles Styles to process.
* @param array $settings Theme settings.
@@ -1992,6 +1999,15 @@ class WP_Theme_JSON {
$value = wp_get_typography_font_size_value( array( 'size' => $value ) );
}
if ( 'aspect-ratio' === $css_property ) {
// For aspect ratio to work, other dimensions rules must be unset.
// This ensures that a fixed height does not override the aspect ratio.
$declarations[] = array(
'name' => 'min-height',
'value' => 'unset',
);
}
$declarations[] = array(
'name' => $css_property,
'value' => $value,