Default background color and typography from the theme are inherited on editor

[ricklabsdotn8]

Description

The default background color and typography of the theme are inherited as the background of the editor. This results in an inaccurate preview, when the single-post and single-page templates are changed

Step-by-step reproduction instructions

Block themes

1. Activate a block theme, e.g. Twenty Twenty Four
2. Next, go to theme styles (Appearance → Editor → Styles)
3. Select a dark palette or style
4. Then, edit a post.

Classic themes

1. Choose a classic theme with a dark or gray background color, e.g. Storefront
2. Activate the theme
3. Then, edit a post

In both cases, the editor uses the default background color. This affects the UX in the following manner:

It is not always accurate to use the default background color and typography on the editor because the single-post and single-page templates can be customized.

When these templates are changed, the preview on the editor will no longer be the same as the actual preview.

For example - https://share.zight.com/12udAgLl

This leads to confusion on the user's part, and sets the wrong expectations, compared when the editor used a dark text color against a white background

Screenshots, screen recording, code snippet

https://share.zight.com/12udAgLl

Environment info

• WP 6.7.1, Gutenberg 20.0.0, Twenty Twenty Four, Storefront

• All browsers

• All OS

• Atomic

• Simple

• dotOrg

• 9296589-zen

• 9296087-zen

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

Please confirm which theme type you used for testing.

• Block
• Classic
• Hybrid (e.g. classic with theme.json)
• Not sure

[hanneslsm]

It looks like you're editing the post in the page editor, not site editor, where on default the template is not shown.
From what I can tell, all is on purpose.
Does the issue also occur, when you display the template? (Inspector on the right → Post → Template → Show template)

[ricklabsdotn8]

It looks like you're editing the post in the page editor, not site editor, where on default the template is not shown. From what I can tell, all is on purpose. Does the issue also occur, when you display the template? (Inspector on the right → Post → Template → Show template)

• It does show the proper template. IMO, it is still a radical change which leaves some users confused and adds to what they need to think about.

[hanneslsm]

In the newest Gutenberg Version you can toggle the preview also in the View Settings.
This should help clarifying any confusions.

#66429