Skip to content

Separator Block: user colors styles are not merged with base theme.json correctly, style book CSS overrides user margin values #57297

@creativecoder

Description

@creativecoder

Description

Where a theme has defined a border color for the core/separator block, changing the colors in the Separator Block global style settings does not appear to update the block.

Themes:

I think this is because if a theme defines a value for styles.blocks.core/separator.border.color, updating the global styles for the block will only change the background color.

It appears to be a bug with updateConfigWithSeparator() introduced in #44943

In the style book, changing the margins won't take effect for the separator block because the style book has rules that overrides them:

https://github.com/WordPress/gutenberg/blob/trunk/packages/edit-site/src/components/style-book/constants.ts#L258-L263

Step-by-step reproduction instructions

  1. In TT4 or TT5, open the Site editor and insert a Seperator block
  2. Change background color
  3. See that the block preview does not update correctly
  4. Open the style book and view the separator block
  5. Change the margins for the separator block in global styles
  6. The margin styles are overridden by the style book's CSS

Screenshots, screen recording, code snippet

image

Environment info

  • WP: 6.5-alpha-56966-src
  • Gutenberg: 17.3.0

Please confirm that you have searched existing issues in the repo.

Yes

Please confirm that you have tested with all plugins deactivated except Gutenberg.

Yes

Metadata

Metadata

Labels

Global StylesAnything related to the broader Global Styles efforts, including Styles Engine and theme.json[Block] SeparatorAffects the Separator Block[Feature] Style Book[Type] BugAn existing feature does not function as intended

Type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions