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

Global Styles: Button element should inherit all typography styles on the frontend #60403

Open
t-hamano opened this issue Apr 3, 2024 · 1 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 [Type] Bug An existing feature does not function as intended

Comments

@t-hamano
Copy link
Contributor

t-hamano commented Apr 3, 2024

Description

Found in this comment

Button elements, i.e. elements with the wp-element-button class, inherit some typography styles by default. However, I realized that we are missing some styles that we should inherit:

  • font-style
  • text-transform
  • letter-spacing
  • font-weight

For example, update all typography styles at the root level via the Global Styles and insert a Search block.

image

Expected (Editor)

If you're using Emptytheme, you'll see something like this in the editor, which is what you'd expect. This is because the button is a div element.

image

Not Expected (Frontend)

On the front end, you can see that the following styles are not applied to the button.

  • font-style
  • text-transform
  • letter-spacing
  • font-weight

image

Step-by-step reproduction instructions

  • Activate Emptytheme: Testing will be a little more difficult in TT4 as the button element's default style is overridden.
  • Go to the Site Editor > Global Styles > Typography > Text > Typography panel
  • Update all styles.
  • Insert a Search block in a post and see how it looks on the front end.

Screenshots, screen recording, code snippet

No response

Environment info

No response

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

@t-hamano t-hamano added [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 [Feature] Typography Font and typography-related issues and PRs labels Apr 3, 2024
@annezazu
Copy link
Contributor

annezazu commented Apr 3, 2024

Noting that this doesn't appear related to 6.5 so am not adding to board (relates to a PR from GB 18.1).

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 [Type] Bug An existing feature does not function as intended
Projects
None yet
Development

No branches or pull requests

2 participants