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

Layout: Ensure defaultEditorStyles are still output in Classic themes #42906

Merged

Conversation

andrewserong
Copy link
Contributor

@andrewserong andrewserong commented Aug 3, 2022

What?

Fixes #42902

When outputting base layout styles in a theme that otherwise does not output theme global styles, ensure the type of the base layout styles is not set to theme so that it isn't considered as theme styles by the check in

: defaultEditorStyles;

Why?

As of #40875, base layout styles are output as part of the Theme JSON class — in order to support Classic themes using the default editor styles, we need to ensure that the base layout styles are not considered "theme" styles by the above check. Otherwise themes that do not provide their own editor styles will not have default editor styles to ensure elements in the editor look pleasing.

How?

When outputting base layout styles for Classic themes, use a different __unstableType so that it isn't treated as theme styles. These styles get appended into the presets styles as part of the following line, which is the desired behaviour:

Testing Instructions

  1. In an older Classic theme like Dara (https://wordpress.org/themes/dara/), test that the editor styles now look correct
  2. Test that Social Icons and Columns blocks render correctly
  3. In a Blocks-based theme, smoke test that Layout styles for Columns, Group, and Buttons still work as expected

Screenshots or screencast

With Dara theme applied

Before After
image image

…e provides no editor styles and base layout styles are output
@andrewserong andrewserong added [Type] Regression Related to a regression in the latest release Global Styles Anything related to the broader Global Styles efforts, including Styles Engine and theme.json labels Aug 3, 2022
@andrewserong andrewserong self-assigned this Aug 3, 2022
@andrewserong andrewserong added the [Feature] Custom Editor Styles Functionality for adding custom editor styles label Aug 3, 2022
@andrewserong
Copy link
Contributor Author

@Mamaduka I know we're very close to the 13.8 release time, but I was wondering if it's worth trying to get this PR cherry picked in, too, in order to fix this editor styling regression for some Classic themes? (If the approach here looks okay)

@Mamaduka
Copy link
Member

Mamaduka commented Aug 3, 2022

@andrewserong, thanks for the ping.

I've one more item to cherry-pick for today's release and this seems essential enough 👍

@andrewserong
Copy link
Contributor Author

Excellent, thank you again! 🙇

@glendaviesnz
Copy link
Contributor

Tested well for me on Dara, and also tested a few different block and non-block themes and the editor fonts were the same between 13.6 and this branch.

Would probably be good to get some more testing from someone else as well though if we have time before getting it picked into 13.8

@andrewserong andrewserong added the Backport to Gutenberg Minor Release Pull request that needs to be backported to a Gutenberg minor release label Aug 3, 2022
@andrewserong andrewserong added this to the Gutenberg 13.8 milestone Aug 3, 2022
@ramonjd
Copy link
Member

ramonjd commented Aug 3, 2022

I checked on Dara:

Trunk This PR
Screen Shot 2022-08-03 at 2 57 16 pm Screen Shot 2022-08-03 at 2 55 05 pm

I also tested a few other classic themes (2011, 2013, 2015 and 2021) but couldn't see a difference between trunk and this PR. Things appears as expected.

LGTM!

@andrewserong
Copy link
Contributor Author

Thanks for reviewing and testing, folks! I'll merge this in now.

@andrewserong andrewserong merged commit bece57e into trunk Aug 3, 2022
@andrewserong andrewserong deleted the fix/default-editor-styles-rendering-in-classic-themes branch August 3, 2022 05:03
Mamaduka pushed a commit that referenced this pull request Aug 3, 2022
…e provides no editor styles and base layout styles are output (#42906)
@Mamaduka Mamaduka removed the Backport to Gutenberg Minor Release Pull request that needs to be backported to a Gutenberg minor release label Aug 3, 2022
@andrewserong andrewserong added the [Feature] Layout Layout block support, its UI controls, and style output. label Sep 29, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
[Feature] Custom Editor Styles Functionality for adding custom editor styles [Feature] Layout Layout block support, its UI controls, and style output. Global Styles Anything related to the broader Global Styles efforts, including Styles Engine and theme.json [Type] Regression Related to a regression in the latest release
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Gutenberg 13.7.3 - Smaller editor font size for some themes
4 participants