Update icon in home button #65497
Merged
Update icon in home button #65497
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: +1.71 kB (+0.1%) Total Size: 1.77 MB
ℹ️ View Unchanged
|
|
I pushed the diagonal arrow approach to the PR, give it a try :) 
|
|
Flaky tests detected in 1c5d3e4. 🔍 Workflow run URL: https://github.com/WordPress/gutenberg/actions/runs/10945147467
|
|
This doesn't seem right pointing down to the content. Perhaps top left (NW).
|
afercia
added
the
[Focus] Accessibility (a11y)
|
I'm not sure a diagonal arrow helps understand the functionality.
|
|
@afercia agree those are issues to fix, but probably not here. More options: 
|
The "menu" icon seems as good as it gets for now. Regarding future concerns, if admin bar functionality would stretch the metaphor too much perhaps such functions merit their own UI. |
|
The diagonal arrow works well, that's a good start, and we can go from there. |
I kindly disagree. This button opens a manu. The icon should represent the concept of a menu. The most common pattern I can think of for such an icon is the so called 'hamburger' icon. As a user, a diagonal arrow doesn't mean much to me. I'm not sure why we'd want to go fancy with obscure, meaningless icons instead of choosing one that clearly represents the concept of a menu. |
|
Pushed the alternative arrow to try. Based on the current behavior I think the |
Seems to me the prevalent opinion on this change is to use the |
|
The problem with the menu item is that it can easily be confused with the nav menu block, and even navigation elements for the site itself. |
mtias
approved these changes
Sep 27, 2024
There was a problem hiding this comment.
There's a visual tension as well between the list view icon and the hamburger in such close proximity. A hamburger menu generally opens in place while the post editor doesn't do that just yet, triggering a full navigation instead, so I think the arrow is a bit more adequate in the current context. We can revisit this during beta if necessary.
mtias
reviewed
Sep 27, 2024
| */ | ||
| import { SVG, Path } from '@wordpress/primitives'; | ||
|
|
||
| const directionNW = ( |
There was a problem hiding this comment.
I think these should be named arrowTopLeft and such for consistency with existing icons.
jameskoster
added
the
Backport to WP 6.7 Beta/RC
I totally agree. Though how does one qualify how much it frustrates actual use?
True, yet this seems unlikely to frustrate usage. It is still a good point for broader consideration and it sounds as if we are planning to not have it be a full navigation at some point. The arrow is better than the current box so that’s a win. Yet not using the menu icon still feels like a miss of the practical mark because we’re aiming at perfection (which is currently out of range). |
github-actions
bot
removed
the
Backport to WP 6.7 Beta/RC
gutenbergplugin
pushed a commit
that referenced
this pull request
Sep 27, 2024
Co-authored-by: jameskoster <jameskoster@git.wordpress.org> Co-authored-by: mtias <matveb@git.wordpress.org> Co-authored-by: richtabor <richtabor@git.wordpress.org> Co-authored-by: afercia <afercia@git.wordpress.org> Co-authored-by: stokesman <presstoke@git.wordpress.org> Co-authored-by: jasmussen <joen@git.wordpress.org> Co-authored-by: paaljoachim <paaljoachim@git.wordpress.org> Co-authored-by: annezazu <annezazu@git.wordpress.org>
github-actions
bot
added
the
Backported to WP Core
|
I just cherry-picked this PR to the wp/6.7 branch to get it included in the next release: 3be134f |
|
@stokesman yes, for sure, let's not consider this final |
Yes I'd agree. However, the List View isn't just a list view any longer. The panel contains the List View and the Outline. As such, the toggle button that opens a panel with List View + Outline should be renamed and the icon changed. |
huubl
pushed a commit
to huubl/gutenberg
that referenced
this pull request
Oct 2, 2024
Co-authored-by: jameskoster <jameskoster@git.wordpress.org> Co-authored-by: mtias <matveb@git.wordpress.org> Co-authored-by: richtabor <richtabor@git.wordpress.org> Co-authored-by: afercia <afercia@git.wordpress.org> Co-authored-by: stokesman <presstoke@git.wordpress.org> Co-authored-by: jasmussen <joen@git.wordpress.org> Co-authored-by: paaljoachim <paaljoachim@git.wordpress.org> Co-authored-by: annezazu <annezazu@git.wordpress.org>
huubl
added a commit
to huubl/gutenberg
that referenced
this pull request
Oct 2, 2024
This reverts commit b0c9b57.
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.
Closes #65428.
What?
Replace the current icon in the home button.
Why?
See #65428.
How?
In this PR I swapped to the
menuicon. It's not perfect because the explicit metaphor may not fully capture how this element might evolve in the future (absorbing admin bar functionality). However, it is a very familiar icon, and aligns with the current tooltip 'Open navigation'.Other options I ruled out:
<isn't appropriate because it suggests going back, which isn't always the resulting behavior. We've already iterated away from this once (Update: chevron to home icon. #64161).We can explore new alternative icons here too.
One option could be something like the 'exit full screen' icon in macOS (green button):
Another option could be a diagonal arrow: