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

Font size "huge" does not respect the size specified in theme.json #54918

Closed
iamtakashi opened this issue Sep 28, 2023 · 3 comments
Closed

Font size "huge" does not respect the size specified in theme.json #54918

iamtakashi opened this issue Sep 28, 2023 · 3 comments
Labels
[Feature] Typography Font and typography-related issues and PRs Global Styles Anything related to the broader Global Styles efforts, including Styles Engine and theme.json [Status] Duplicate Used to indicate that a current issue matches an existing one and can be closed [Type] Bug An existing feature does not function as intended

Comments

@iamtakashi
Copy link

iamtakashi commented Sep 28, 2023

Description

Let's say, there is a font size called huge that is 100px in a theme.

On the front of the site, an element with the huge size appears 100px, as expected. However, in the editor, it appears 42px.

To demonstrate the issue, I've added a font size, huge to TT3's theme.json, and changed the size of the heading in home.html

{
	"settings": {
		"typography": {
			"fontSizes": [
				{
					"size": "100px",
					"slug": "huge",
					"name": "Huge"
				}
			]
		}
	}
}
Front of site Editor
localhost local_ (10) localhost local_wp-admin_site-editor php_canvas=edit (1)

The size is overridden by this, which comes from here. The !important seems to be the problem.

Screenshot 2023-09-28 at 20 08 29

If I deactivate Gutenberg (trunk), the font size will return to 100px in the editor.

localhost local_wp-admin_site-editor php_canvas=edit (3)

Step-by-step reproduction instructions

  1. Activate a theme that has a font size called huge or add the size like above in a theme.json
  2. Specify a text element like a heading to use the huge size.
  3. See the discrepancy in size between in the editor and the front of the site.

Screenshots, screen recording, code snippet

No response

Environment info

WP 6.3.1.
Gutenberg trunk

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

@jordesign jordesign added [Type] Bug An existing feature does not function as intended Needs Testing Needs further testing to be confirmed. Global Styles Anything related to the broader Global Styles efforts, including Styles Engine and theme.json [Feature] Typography Font and typography-related issues and PRs labels Sep 28, 2023
@github-actions
Copy link

Hi,
This issue has gone 30 days without any activity. This means it is time for a check-in to make sure it is still relevant. If you are still experiencing this issue with the latest versions, you can help the project by responding to confirm the problem and by providing any updated reproduction steps.
Thanks for helping out.

@github-actions github-actions bot added the [Status] Stale Gives the original author opportunity to update before closing. Can be reopened as needed. label Oct 29, 2023
@iamtakashi
Copy link
Author

I'm still having this issue. If a theme uses a size with a slug huge, the huge size text will be always 42px in the editor instead of the value set in the theme.json.

@github-actions github-actions bot removed the [Status] Stale Gives the original author opportunity to update before closing. Can be reopened as needed. label Nov 1, 2023
@t-hamano
Copy link
Contributor

Thanks for the report.

This issue is similar to #59701 and I believe it has already been resolved. Tested with WP6.5-RC1.

I would like to close this issue, but if this issue is not resolved in the latest Gutenberg or WP6.5, please let me know.

Editor

editor

Front end

front-end

@t-hamano t-hamano closed this as not planned Won't fix, can't repro, duplicate, stale Mar 12, 2024
@t-hamano t-hamano added [Status] Duplicate Used to indicate that a current issue matches an existing one and can be closed and removed Needs Testing Needs further testing to be confirmed. labels Mar 12, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
[Feature] Typography Font and typography-related issues and PRs Global Styles Anything related to the broader Global Styles efforts, including Styles Engine and theme.json [Status] Duplicate Used to indicate that a current issue matches an existing one and can be closed [Type] Bug An existing feature does not function as intended
Projects
None yet
Development

No branches or pull requests

3 participants