Customizer menus and widgets "search" usability and visual improvements
|Reported by:||afercia||Owned by:||afercia|
|Component:||Customize||Keywords:||has-screenshots has-patch commit|
The search fields for available menu items and available widgets look similar, even if behind the scenes they do very different things. But from a user perspective they are very similar.
I'd propose to improve a bit the UI. In the Menus, the search field has a type=text attribute while in the widgets has a type=search attribute. This introduces some inconsistency, both from a visual and functional perspective.
Worth reminding not all browsers display a control to clear the input field when it has a type=search attribute. See in the screenshots below:
At the very least, I'd propose for the Menu items search:
- increase the "Clear results" clickable area
- use some right padding on the input field since when the search terms are very long, the text goes behind the spinner and the "Clear Results" control
- IE11 and Edge display a native "clear" control also for type=text input fields that should be removed, see screenshot below
Not sure about the widgets search field, ideally it would be great to pair it with the menu items search and implement the same custom control to clear the field.
See also #36903 which proposes to use a button element for the Menus search field.
Change History (17)
- Keywords needs-patch added
- Milestone changed from Awaiting Review to Future Release
- Version set to 4.3
6 months ago
- Focuses accessibility added