[wp-trac] [WordPress Trac] #39662: Color picker accessibility improvements

[WordPress Trac]

#39662: Color picker accessibility improvements
-------------------------------------+-------------------------------------
 Reporter:  afercia                  |       Owner:  afercia
     Type:  defect (bug)             |      Status:  assigned
 Priority:  normal                   |   Milestone:  4.9
Component:  Customize                |     Version:
 Severity:  normal                   |  Resolution:
 Keywords:  has-screenshots has-     |     Focuses:  accessibility,
  patch commit                       |  javascript
-------------------------------------+-------------------------------------

Comment (by afercia):

 [attachment:39662.5.diff] slightly improves the responsive view. Worth
 noting is basically impossible to achieve a pixel-perfect layout across
 browsers and platforms. Since the introduction of system fonts (see
 #36753), some form elements that base their height on the line-height
 value get rendered differently depending on the platform font metrics.
 This is particularly noticeable when buttons use `line-height: normal`. To
 improve consistency across platforms and different system fonts, great
 part of the WordPress CSS should be refactored and this is out of the
 scope of this ticket.

 Worth also noting buttons in the Customizer use
 [https://core.trac.wordpress.org/browser/trunk/src/wp-admin/css/customize-
 controls.css?rev=41062#L1808 an additional media query at 640px], so
 there's the need of some additional adjustments.

 Screenshots to recap:

 Closed and open, before and after:

 [[Image(https://cldup.com/Oqj38X9uli.png)]]

 Responsive view in macOS Chrome, before and after

 [[Image(https://cldup.com/8MBlwNbsw5.png)]]

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