Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fix styles for previews and patterns #37296

Merged
merged 1 commit into from
Dec 12, 2021

Conversation

oandregal
Copy link
Member

Fixes #37292

#36851 introduced a change to how Gutenberg loads some styles: the CSS Custom Properties for the presets. We removed them from the editor settings' style and added them via the enqueue_block_editor_assets filter so that they were in the scope of both the content and the sidebar.

While this change fixed the issue we had gradients, it introduced a regression described at #37292 by which some styles were missing for the previews and patterns. The reason for this appears to be that they load through iframe the styles in editor settings, hence, the CSS Custom Properties were defined in the iframes.

This PR adds back the CSS vars in the editor settings.

How to test

See #37292

The reason is that there's a couple of places in which we render
styles coming from the block editor settings in a iframe
(media query previews, block patterns).
@oandregal oandregal self-assigned this Dec 10, 2021
@oandregal oandregal added [Feature] Patterns A collection of blocks that can be synced (previously reusable blocks) or unsynced [Type] Bug An existing feature does not function as intended Global Styles Anything related to the broader Global Styles efforts, including Styles Engine and theme.json Backport to WP 6.7 Beta/RC Pull request that needs to be backported to the WordPress major release that's currently in beta labels Dec 10, 2021
Copy link
Contributor

@jffng jffng left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Tested in tt1-blocks and twentytwentytwo, and this fixes the issue. Thanks @oandregal for the fast work!

@noisysocks noisysocks merged commit 23543d1 into trunk Dec 12, 2021
@noisysocks noisysocks deleted the fix/styles-in-preview-and-patterns branch December 12, 2021 23:39
@github-actions github-actions bot added this to the Gutenberg 12.2 milestone Dec 12, 2021
@noisysocks noisysocks removed the Backport to WP 6.7 Beta/RC Pull request that needs to be backported to the WordPress major release that's currently in beta label Dec 13, 2021
noisysocks pushed a commit that referenced this pull request Dec 13, 2021
…gs (#37296)

The reason is that there's a couple of places in which we render
styles coming from the block editor settings in a iframe
(media query previews, block patterns).
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
[Feature] Patterns A collection of blocks that can be synced (previously reusable blocks) or unsynced Global Styles Anything related to the broader Global Styles efforts, including Styles Engine and theme.json [Type] Bug An existing feature does not function as intended
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Previews appear un-styled when using a block theme
3 participants