diff --git a/wp-includes/block-supports/layout.php b/wp-includes/block-supports/layout.php index 22fe6d7b7a..98b44079ba 100644 --- a/wp-includes/block-supports/layout.php +++ b/wp-includes/block-supports/layout.php @@ -312,6 +312,7 @@ function wp_get_layout_style( $selector, $layout, $has_block_gap_support = false * Renders the layout config to the block wrapper. * * @since 5.8.0 + * @since 6.3.0 Adds compound class to layout wrapper for global spacing styles. * @access private * * @param string $block_content Rendered block content. @@ -474,6 +475,10 @@ function wp_render_layout_support_flag( $block_content, $block ) { } } + // Add combined layout and block classname for global styles to hook onto. + $block_name = explode( '/', $block['blockName'] ); + $class_names[] = 'wp-block-' . end( $block_name ) . '-' . $layout_classname; + $content_with_outer_classnames = ''; if ( ! empty( $outer_class_names ) ) { diff --git a/wp-includes/class-wp-theme-json.php b/wp-includes/class-wp-theme-json.php index 74f3971bf2..afff53f9da 100644 --- a/wp-includes/class-wp-theme-json.php +++ b/wp-includes/class-wp-theme-json.php @@ -1246,6 +1246,7 @@ class WP_Theme_JSON { * Gets the CSS layout rules for a particular block from theme.json layout definitions. * * @since 6.1.0 + * @since 6.3.0 Reduced specificity for layout margin rules. * * @param array $block_metadata Metadata about the block to get styles for. * @return string Layout styles for the block. @@ -1342,7 +1343,7 @@ class WP_Theme_JSON { $spacing_rule['selector'] ); } else { - $format = static::ROOT_BLOCK_SELECTOR === $selector ? '%s .%s%s' : '%s.%s%s'; + $format = static::ROOT_BLOCK_SELECTOR === $selector ? ':where(%s .%s) %s' : '%s-%s%s'; $layout_selector = sprintf( $format, $selector, @@ -2560,8 +2561,9 @@ class WP_Theme_JSON { $has_block_gap_support = _wp_array_get( $this->theme_json, array( 'settings', 'spacing', 'blockGap' ) ) !== null; if ( $has_block_gap_support ) { $block_gap_value = static::get_property_value( $this->theme_json, array( 'styles', 'spacing', 'blockGap' ) ); - $css .= '.wp-site-blocks > * { margin-block-start: 0; margin-block-end: 0; }'; - $css .= ".wp-site-blocks > * + * { margin-block-start: $block_gap_value; }"; + $css .= ":where(.wp-site-blocks) > * { margin-block-start: $block_gap_value; margin-block-end: 0; }"; + $css .= ':where(.wp-site-blocks) > :first-child:first-child { margin-block-start: 0; }'; + $css .= ':where(.wp-site-blocks) > :last-child:last-child { margin-block-end: 0; }'; // For backwards compatibility, ensure the legacy block gap CSS variable is still available. $css .= "$selector { --wp--style--block-gap: $block_gap_value; }"; diff --git a/wp-includes/theme.json b/wp-includes/theme.json index af44799060..581bdb0b32 100644 --- a/wp-includes/theme.json +++ b/wp-includes/theme.json @@ -219,14 +219,19 @@ ], "spacingStyles": [ { - "selector": " > *", + "selector": " > :first-child:first-child", + "rules": { + "margin-block-start": "0" + } + }, + { + "selector": " > :last-child:last-child", "rules": { - "margin-block-start": "0", "margin-block-end": "0" } }, { - "selector": " > * + *", + "selector": " > *", "rules": { "margin-block-start": null, "margin-block-end": "0" @@ -279,14 +284,19 @@ ], "spacingStyles": [ { - "selector": " > *", + "selector": " > :first-child:first-child", + "rules": { + "margin-block-start": "0" + } + }, + { + "selector": " > :last-child:last-child", "rules": { - "margin-block-start": "0", "margin-block-end": "0" } }, { - "selector": " > * + *", + "selector": " > *", "rules": { "margin-block-start": null, "margin-block-end": "0" diff --git a/wp-includes/version.php b/wp-includes/version.php index 90950e1dd0..3b4b08b8ee 100644 --- a/wp-includes/version.php +++ b/wp-includes/version.php @@ -16,7 +16,7 @@ * * @global string $wp_version */ -$wp_version = '6.3-alpha-55955'; +$wp_version = '6.3-alpha-55956'; /** * Holds the WordPress DB revision, increments when changes are made to the WordPress DB schema.