[wp-trac] [WordPress Trac] #36908: Customizer menus and widgets "search" usability and visual improvements

[WordPress Trac]

#36908: Customizer menus and widgets "search" usability and visual improvements
-----------------------------------------+-----------------------------
 Reporter:  afercia                      |       Owner:
     Type:  defect (bug)                 |      Status:  new
 Priority:  normal                       |   Milestone:  Future Release
Component:  Customize                    |     Version:  4.3
 Severity:  normal                       |  Resolution:
 Keywords:  has-screenshots needs-patch  |     Focuses:  ui
-----------------------------------------+-----------------------------

Comment (by ryankienstra):

 **Pull Request**
 ''Request For Review''

 Could you please review this [https://github.com/xwp/wordpress-
 develop/pull/153 GitHub pull request]? Here's a
 [https://cloudup.com/cFRQ_Zxg8QZ screenshot] of the search field that
 appears on clicking a menu's "Add Items" button.

 * [https://github.com/xwp/wordpress-
 develop/pull/153/commits/9d9ffa54825e738d3a144b14c520b77328696978 Commit
 9d9ffa54] : Create [https://github.com/xwp/wordpress-
 develop/compare/trac-36908?expand=1#diff-
 49c6fb18cfad3f9946aa8ca15b809b3fR770 search icon] in `<input>`, using
 neighbor `<div>` with [https://github.com/xwp/wordpress-
 develop/compare/trac-36908?expand=1#diff-
 6bdd5041777c50e624f1d0beae2e0b7cR1453 :after]. It's not possible to set
 this as a `:before` or `:after` psuedo-element of the `<input>`.
 [https://github.com/xwp/wordpress-develop/compare/trac-36908?expand=1
 #diff-6bdd5041777c50e624f1d0beae2e0b7cR1425 Increase padding-left] from
 `10px` to `30px` to create space for this. Mainly copy styling of `.clear-
 results` in [https://core.trac.wordpress.org/browser/trunk/src/wp-
 admin/css/customize-nav-menus.css#L626 customize-nav-menus.css#L626]. In
 menu search field, [https://github.com/xwp/wordpress-
 develop/compare/trac-36908?expand=1#diff-
 79f9bc58f474eba515dbb6e2822b7a22R628 increase clickable area] of x icon.

 One open question is whether the "widgets search field" should have the
 "same custom control" (red "x" button) So far, this only appears in the
 [https://cloudup.com/cFRQ_Zxg8QZ menu search field].

 This ticket's description states:
 ```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```

--
Ticket URL: <https://core.trac.wordpress.org/ticket/36908#comment:6>
WordPress Trac <https://core.trac.wordpress.org/>
WordPress publishing platform