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

Represent default font size in slider #44229

Closed
Tracked by #33447
mtias opened this issue Sep 16, 2022 · 10 comments
Closed
Tracked by #33447

Represent default font size in slider #44229

mtias opened this issue Sep 16, 2022 · 10 comments
Labels
[Feature] Design Tools Tools that impact the appearance of blocks both to expand the number of tools and improve the experi [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 Needs Design Feedback Needs general design feedback.

Comments

@mtias
Copy link
Member

mtias commented Sep 16, 2022

Now that we have more concrete mechanisms for knowing what is the default font size coming for text from the global styles tree, can we represent it on the segmented control if it matches one of the preset sizes?

image

I'd imagine we would use a lighter gray for these cases.

@mtias mtias added Needs Design Needs design efforts. Global Styles Anything related to the broader Global Styles efforts, including Styles Engine and theme.json [Feature] Design Tools Tools that impact the appearance of blocks both to expand the number of tools and improve the experi [Feature] Typography Font and typography-related issues and PRs labels Sep 16, 2022
@jasmussen
Copy link
Contributor

Here are a few options including a lighter gray:

Known but not explicitly set

Another option is to show a little asterisk or other indicator:

Known but not explicitly set

Or a combination?

Known option 3

None of these seem a clear win, though I'd tend to agree the light gray background is probably best out of these.

@jasmussen jasmussen added Needs Design Feedback Needs general design feedback. and removed Needs Design Needs design efforts. labels Sep 20, 2022
@jameskoster
Copy link
Contributor

Isn't the label alone adequate? It seems more important for the default size to be selected when the control is present?

label

@jasmussen
Copy link
Contributor

Oh interesting, I read the brief as when no font size is set, suggest which point on the slider it would match. 🤔

@jameskoster
Copy link
Contributor

If no font size is set (it is inherited from css), then we can't determine which value it would match? 🤔

I saw this as more about connecting the setting in global styles to the control we find when editing locally. Apologies if that's separate.

@jasmussen
Copy link
Contributor

The font size can be set in Global Styles, in which case we would know whether it matched a given notch in the slider.

@jameskoster
Copy link
Contributor

jameskoster commented Sep 29, 2022

We should. But it hasn't been implemented here. I think that's the issue?

As an example, here's my font size setting from the Typography section of global styles:

Screenshot 2022-09-29 at 14 45 58

But when I go to edit the Paragraph block in global styles, or just select a paragraph while editing a post, here's what I see:

Screenshot 2022-09-29 at 14 45 44

The label tells me the default size is set, but the corresponding segment (M) isn't highlighted.

@jasmussen
Copy link
Contributor

Right, that's the baseline, and works okay, I think the question is whether we need more than that.

@jameskoster
Copy link
Contributor

Indeed, and my suggestion was that if the correct value is highlighted in the control, isn't the label denoting the default adequate? So if I select a paragraph in a post, I see this in the Typography panel:

Screenshot 2022-09-29 at 15 03 55

@mtias
Copy link
Member Author

mtias commented Sep 29, 2022

Selecting M explicitly for a paragraph is not the same as M being the inherited default when nothing is locally set but M is the most immediate value passed in the tree.

@jameskoster
Copy link
Contributor

I believe #49278 captures this in a more holistic way. All controls need a solution to this problem.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
[Feature] Design Tools Tools that impact the appearance of blocks both to expand the number of tools and improve the experi [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 Needs Design Feedback Needs general design feedback.
Projects
None yet
Development

No branches or pull requests

3 participants