Template inspector: Small visual adjustments. #62537
Merged
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
|
The following accounts have interacted with this PR and/or linked issues. I will continue to update these lists as activity occurs. You can also manually ask me to refresh this list by adding the If you're merging code through a pull request on GitHub, copy and paste the following into the bottom of the merge commit message. To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook. |
|
Size Change: +151 B (+0.01%) Total Size: 1.76 MB
ℹ️ View Unchanged
|
t-hamano
reviewed
Jun 13, 2024
There was a problem hiding this comment.
I think this is a great improvement.
Whether the text wraps will depend on the locale, but I was particularly bothered by the narrow label width in Japanese. Since it's impractical to prevent all text wrapping in all locales, I think 38% is a reasonable value.
| Before | After |
|---|---|
 |
 |
 |
 |
If a template has a purple icon denoting synced/used in multiple places, now the text is also purple.
This PR also changes the text color of synced patterns and template parts, but that's to be expected, right?
Co-authored-by: Aki Hamano <[email protected]>
Yes, this is at least my take on it. We're being a bit inconsistent about it at the moment, showing all-purple in some places:
But not in others:
There's just something more scannable when the title plus icon is the same color, than if it's only the icon. But if you prefer, I'm happy to extract that change to a separate PR, so we can land the other improvements? Speaking of 38%—is that wrapping actually better for japanese? Or would 40% be better? Is there a sweet-spot balance here? We want to be careful with the balance because in most cases, the content in the right column is the content that needs space. But if 40% is better than 38, happy to try it. |
t-hamano
approved these changes
Jun 14, 2024
There was a problem hiding this comment.
Speaking of 38%—is that wrapping actually better for japanese? Or would 40% be better?
In CJK languages, there are no spaces between words like in Latin languages. And there is no mechanism in CSS yet to distinguish between words in CJK languages and wrap them appropriately (I think that's why text-wrap:pretty doesn't work in CJK languages).
To be precise, there is text-wrap: auto-phrase, but it is experimental and not supported by Firefox or Safari.
Therefore, I believe that wrapping text mid-word is common and acceptable in CJK languages.
If we want to completely prevent text wrapping in Japanese , we need a larger width.
Post: Requires 46% width
Blog home template: Requires 48% width
These widths will feel very wide in other languages, so I think it's fine to leave them at 38%.
So I'm happy to give this PR a green check.
|
Thank you for the check. I'll merge when they pass, but then also be here for any followups re: purple text or not. |
patil-vipul
pushed a commit
to patil-vipul/gutenberg
that referenced
this pull request
Jun 17, 2024
* Template inspector: Small visual adjustments. * Update packages/editor/src/components/post-card-panel/style.scss Co-authored-by: Aki Hamano <[email protected]> --------- Co-authored-by: jasmussen <[email protected]> Co-authored-by: t-hamano <[email protected]>
bph
added
the
[Feature] Site Editor
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
What?
A small amount of spacing changes to the post/page/template inspector summary panel.
Why?
The added spacing avoids some wrapping and improves legibility.
How?
Page inspector before and after:
Template inspector ebefore and after:
Testing Instructions
Test the main document inspector in post, page, site editors, across pages and templates, and posts for good measure.