Style book: reduce margin selector specificity so that it doesn't override global block styles

[ramonjd]

What? How? Why?

Fixes the margin issue reported in

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

Reducing specificity of style book margin rules so that they don't override user-defined styles.

Testing Instructions

1. Fire up the style book
2. Edit the styles for any block that has top/bottom margin controls, e.g., gallery, separator
3. Ensure that the margin values are not overridden and are reflected in the style book preview

Before

2024-11-11.11.54.59.mp4

After

2024-11-11.11.55.50.mp4

[github-actions]

The following accounts have interacted with this PR and/or linked issues. I will continue to update these lists as activity occurs. You can also manually ask me to refresh this list by adding the props-bot label.

If you're merging code through a pull request on GitHub, copy and paste the following into the bottom of the merge commit message.

Co-authored-by: ramonjd <[email protected]>
Co-authored-by: aaronrobertshaw <[email protected]>

To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook.

[aaronrobertshaw]

LGTM 👍

This is testing as advertised.

My only question is how hard would it be to display the spacing visualizers in the Style Book? The default spacing between Style Book examples makes the "bottom margin" visually look off to me.

I appreciate our spacing visualizers are a bit clunky at the moment so this thought bubble definitely shouldn't block this fix.

🚢

Screen.Recording.2024-11-11.at.6.03.42.pm.mp4

[ramonjd]

My only question is how hard would it be to display the spacing visualizers in the Style Book? The default spacing between Style Book examples makes the "bottom margin" visually look off to me.

That's a good question. It would be a cool feature to have the visualizers there. It would be a neat experiment to wrap the example blocks and just see what happens. I guess we'd need to check for spacing support. Not sure.

Thanks for testing!