-
Notifications
You must be signed in to change notification settings - Fork 4.2k
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
Move Link Control action buttons into lower settings area #47309
Move Link Control action buttons into lower settings area #47309
Conversation
Size Change: +12 B (0%) Total Size: 1.33 MB
ℹ️ View Unchanged
|
@richtabor Question: shoudl the tab order still be maintained? I.e. when you tab out of the search input the 1st tab stop is the I think that's pretty important to maintain from a UX POV but it does make the tab order not follow the visual order 😟 |
Flaky tests detected in 4b1ab14. 🔍 Workflow run URL: https://github.com/WordPress/gutenberg/actions/runs/3972707240
|
Typically tab order should have a logical reading order, usually from left to right and top to bottom in LTR. Do you know of other UI where we've parted from that logic? Current visual for reference: CleanShot.2023-01-20.at.16.52.50.mp4 |
Yeh that's true and that's what's motivating my concern here. The issue I have is that a typical keyboard-based UX is:
With this change the new order would not allow that as the next tab stop after input would be the settings controls. That said power users can still simply hit ENTER immediately on the input to submit without having to tab to |
Per #47310 you can make the outline button into a text button. |
8393a8c
to
8954adf
Compare
@richtabor I reverted to the logical tab order. If folks don't like it then we can review in follow ups. As I mentioned earlier, we can still hit |
I've fixed both tests. Now awaiting a ✅ from someone 🙏 |
dfc7642
to
4b1ab14
Compare
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
LGTM
This reverts commit e605937.
* Revert "Move Link Control action buttons into lower area (#47309)" This reverts commit e605937. * Revert "Fix Link Control action button visuals (#47306)" This reverts commit 2499646. * Revert "Add clear Apply and Cancel buttons to Link Control (#46933)" This reverts commit 875628f. # Conflicts: # packages/block-editor/src/components/link-control/index.js
What?
Implements part of the design in this Issue by moving the action buttons into the lower "settings" area.
Part of #47310
Why?
It helps to clean up the amount of space utilised by the buttons. It implements the design.
How?
Moves buttons into the lower portion of the control.
Testing Instructions
Testing Instructions for Keyboard
As above but use a keyboard only. Ensure you can reach all of the controls within the link ui using the keyboard only.
Screenshots or screencast