Automattic / wp-calypso

The JavaScript and API powered WordPress.com
https://developer.wordpress.com
GNU General Public License v2.0
12.43k stars 1.99k forks source link

GB 11.7: Font in editor changed and doesn't match front end #57043

Closed ccwalburn closed 1 year ago

ccwalburn commented 3 years ago

Quick summary

The font used in the editor for sites with certain themes changed today so it no longer matches the front-end font. So far this is reported in:

Steps to reproduce

  1. Change theme on simple site to one of the themes listed
  2. Edit post
  3. View the font style

What you expected to happen

I expected the font to match the default font set for the site

What actually happened

The font was set to serif

Context

I cannot confirm that it used to always match whatever font was selected for the site, but it definitely changed from a sans serif style font to a serif style font today.

4377593-zen

The front end display is not affected.

Operating System

No response

Browser

No response

Simple, Atomic or both?

Simple

Theme-specific issue?

Hemingway Rewritten

Other notes

No response

Reproducibility

No response

Workaround details

Go to Preferences in the editor (three dot menu) and turn of the Use Theme Styles. image

Robertght commented 3 years ago

Thank you for reporting this @ccwalburn !

What I'm experiencing right now is the font display a serif font in the editor, whereas the frontend displays the one set in the Customizer. Is that happening for you as well?

ccwalburn commented 3 years ago

Hey @Robertght Yes, that is what I see, too. @nickpagz discovered that you can bring back the system font by turning off the Use theme styles toggle on the Preferences screen in the editor (click the three dots to the right of the Jetpack icon, and then select Preferences)

sajmes commented 3 years ago

I encountered this here 4377459-zd-woothemes with theme The Journalist v1.9

I worked around it as suggested in the comment above.

jordesign commented 3 years ago

Update this issue to cover the various themes affected so far. If more are reported - please add the to the main issue (top comment).

chad1008 commented 3 years ago

I was able to reproduce this in vanilla Gutenberg, specifically using Nucleare, so I've reported over in the wordpress/Gutenberg repo: https://github.com/WordPress/gutenberg/issues/35730

philnick206 commented 3 years ago

Have a report in #4384710-zen with the theme Independent Publisher 2

Sandkorner commented 3 years ago

31653255-HC Edin theme.

ckmccoy2 commented 3 years ago

I'm not sure if this is exactly the same issue, this user was also having issues when trying to change the font color by highlighting the text, clicking on the down arrow in the menu that appears, selecting "Highlight" and then changing the color. It initially seems to work, but when the user previews, the front end just shows black text with yellow highlighting.

20616038-hc Theme: Nucleare

Similar thing was happening for this user: font color was not updating on front end via the same method 322655090-hc Theme: edin

formosattic commented 3 years ago

Updated initial post with workaround.

Go to Preferences in the editor (three dot menu) and turn of the User Theme Styles. image

Also looks like this was an issue that was previously closed, https://github.com/Automattic/themes/issues/3280

Robertght commented 3 years ago

Checking with Flow Patrol in Slack for now: p1634804533002100-slack-C029HCKPXP0

cuemarie commented 3 years ago

Another report: 4378950-zd-woothemes Personal Plan, Theme: Rowling

The user's editor preferences are set to "Use theme styles" already, and the font still appears as serif in the editor.

Left a comment on Multiple Themes: Editor font styles not loading in Gutenberg v9.9.3 as well - not sure exactly where is the best place to report.

ccwalburn commented 3 years ago

Hey @cuemarie ! The fix is to uncheck the "Use theme styles" checkbox.

jordesign commented 3 years ago

I'm consolidating the interaction references from https://github.com/Automattic/themes/issues/3280 to track everything in a single location. I'm just bringing over the reports from the last week (after that issue was re-opened).

It looks like a fix is being worked on in https://github.com/WordPress/gutenberg/issues/35730 so we'll keep an eye on that:

jordesign commented 3 years ago

Another report in 4386306-zen

hideandgeek404 commented 3 years ago

Another report in 4419422-zen using the Ryu theme

sajmes commented 3 years ago

32585656-hc Rebalance theme.

yashitamittal11 commented 2 years ago

Another one- #32955829-hc

Greatdane commented 2 years ago

@ccwalburn - I think this issue may be fixed - can I confirm the issue is no longer present for you?

ccwalburn commented 2 years ago

Hey @Greatdane I tested on Hemingway Rewritten and Rowling and the editor font does not match the font I selected in the Customizer. However, I don't have the option to access Preferences from the three dots in the editor anymore so I can't tell if the Use Theme Styles option is selected or not.

Greatdane commented 2 years ago

Strange! I still see the Use Theme Styles option on my test sites. I am going to close this for now then. If any more reports come up we can open.

For the PA Triagers, I will not batch reply to this issue, as the most recent one is from Nov 2021, nearly 6 months ago. I think this is too old now to randomly reply to a user saying we fixed a bug 6 months later.

ccwalburn commented 2 years ago

I got another report on this and did some testing on my own and still see this issue so I am re-opening it.

I tested on a Simple site (Personal) and it occurs for both Karuna and Hew; but not for newer themes like Hever and Russell. The "Twenty" themes all seem to work, though...even the older ones like Twenty Eleven.

5675661-zen

github-actions[bot] commented 2 years ago

Support References

This comment is automatically generated. Please do not edit it.