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

Components: assess Heading styles in the context of the recent design updates #35464

Open
ciampo opened this issue Oct 8, 2021 · 6 comments
Open

Comments

@ciampo
Copy link
Contributor

@ciampo ciampo commented Oct 8, 2021

As originally discussed in #35400 (comment), it looks like the Heading component may currently not fit the needs of the most recent designs (specifically for the Global Styles sidebar, in this case)

We should assess the situation and, if necessary, decide how to proceed in order to have a component offering the new heading styles needed for the Global Styles sidebar UI.

Useful links:

@ciampo
Copy link
Contributor Author

@ciampo ciampo commented Oct 8, 2021

@mtias and @jasmussen , do you have any insights on this?

@ciampo ciampo moved this from Inbox (needs triage) 📬 to Backlog (triaged) 📝 in WordPress Components Oct 8, 2021
@jasmussen
Copy link
Contributor

@jasmussen jasmussen commented Oct 11, 2021

In exploring the sidebar/inspector/global styles design that is being finalized in #34574, it seems clear that the uppercase styling is used both for input labels and for some subheadings, so it appears to be more of a style than a component, perhaps somewhat comparable to how we have a help-text style (which is 12px font size, default font weight, default text case). CC: @pablohoneyhoney in case he has nuance to add.

@ciampo
Copy link
Contributor Author

@ciampo ciampo commented Oct 11, 2021

Are you suggesting we introduce variants to the Heading component?

In general, I think that if we want the Heading component to be used for all headings, we may need to:

  • define clearly all of the allowed "heading" styles
  • update the Heading component to support these styles
  • refactor the code for all headings to use the Heading component

Another example of where a heading is required (but doesn't match necessarily the "heading" styles) is ToolsPanel (see related conversation #35415 (comment))

@jasmussen
Copy link
Contributor

@jasmussen jasmussen commented Oct 11, 2021

I'm not necessarily suggesting anything in specific here, only providing context to help a path forward. It's possible that it could exist purely as a heading level style (such as the H3 style), but I do suspect that there might be contexts where the subheading style needs a higher heading level, but still the visually lower styling (such as when showing the contents of a particular panel in a popover opened by the block toolbar).

@ciampo
Copy link
Contributor Author

@ciampo ciampo commented Oct 11, 2021

Absolutely, I think we should definitely be able to decouple the HTML semantic (e.g. h1/h2/h3/h4/h5/h6) from the visual style

@jasmussen
Copy link
Contributor

@jasmussen jasmussen commented Oct 11, 2021

I also think we want to end up with very few styles overall, so as to find a good balance, and obvious implied usage guidelines.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
WordPress Components
Backlog (triaged) 📝
Linked pull requests

Successfully merging a pull request may close this issue.

None yet
2 participants