Skip to content

Commit

Permalink
Try allow CSS order to determine applied styles
Browse files Browse the repository at this point in the history
  • Loading branch information
getdave committed Nov 29, 2021
1 parent 61c8ea6 commit ad82e53
Showing 1 changed file with 18 additions and 5 deletions.
23 changes: 18 additions & 5 deletions lib/class-wp-theme-json-gutenberg.php
Original file line number Diff line number Diff line change
Expand Up @@ -1049,6 +1049,23 @@ private function get_block_classes( $style_nodes ) {
}
}

// Set a default margin on the root selector before generating the ruleset
// from the `theme.json`. This is to ensure that if the `theme.json` declares
// `margin` in its `spacing` declaration for the `body` element then these
// user-generated values take precedence in the CSS cascade.
// See: https://github.com/WordPress/gutenberg/issues/36147.
if ( self::ROOT_BLOCK_SELECTOR === $selector ) {
$block_rules .= self::to_ruleset(
self::ROOT_BLOCK_SELECTOR,
array(
array(
'name' => 'margin',
'value' => '0',
),
)
);
}

// 2. Generate the rules that use the general selector.
$block_rules .= self::to_ruleset( $selector, $declarations );

Expand All @@ -1059,11 +1076,7 @@ private function get_block_classes( $style_nodes ) {
}

if ( self::ROOT_BLOCK_SELECTOR === $selector ) {
// If the root body node has margin set in its spacing property
// then avoid setting a default margin.
if ( ! isset( $node['spacing']['margin'] ) ) {
$block_rules .= 'body { margin: 0; }';
}

$block_rules .= '.wp-site-blocks > .alignleft { float: left; margin-right: 2em; }';
$block_rules .= '.wp-site-blocks > .alignright { float: right; margin-left: 2em; }';
$block_rules .= '.wp-site-blocks > .aligncenter { justify-content: center; margin-left: auto; margin-right: auto; }';
Expand Down

0 comments on commit ad82e53

Please sign in to comment.