[wp-trac] [WordPress Trac] #47157: Insufficient contrast on link text on 'Media Dialog' and 'Block Types'

[WordPress Trac]

#47157: Insufficient contrast on link text on 'Media Dialog' and 'Block Types'
-------------------------------------------------+-------------------------
 Reporter:  nrqsnchz                             |       Owner:  (none)
     Type:  defect (bug)                         |      Status:  new
 Priority:  normal                               |   Milestone:  5.3
Component:  Administration                       |     Version:
 Severity:  normal                               |  Resolution:
 Keywords:  wpcampus-report has-screenshots      |     Focuses:
  color-contrast has-patch needs-refresh         |  accessibility
-------------------------------------------------+-------------------------
Changes (by afercia):

 * keywords:  needs-patch wpcampus-report has-screenshots color-contrast =>
     wpcampus-report has-screenshots color-contrast has-patch needs-refresh


Comment:

 @nrqsnchz @ronakganatra thank you for the ticket and the patch.

 As mentioned in a previous comment, the hover state insufficient contrast
 applies to many other places in WordPress where controls (links, link-
 buttons, etc.) use the color `#00a0d2` for hover. For completeness, also
 the controls that use a red color may have an insufficient color contrast
 on hover.

 Worth also considering the background color is not always white. Various
 shades of gray are used across the admin, for example in the Customiser
 the grays are different from the ones used in the standard admin pages.
 See #35622.

 Generally, the color used for the hover state shouldn't be "lighter" than
 the one used for the normal state. Instead, it should be darker to
 increase contrast.

 I guess before any patch, this issue probably requires some broader
 discussion.

 Note for anyone willing to test contrast: if you're using the Chrome dev
 tools, be aware that sometimes the calculated contrast ratio is inaccurate
 because the Chrome color picker contrast checked appears to be unable to
 get the background color when set on ancestors that are very far in the
 DOM.

 Some screenshots to illustrate the hover state on different background
 colors:

 Zebra-striped tables:

 [[Image(http://cldup.com/q5MYm6DKL1.png)]]

 Default WordPress background `#f1f1f1`:

 [[Image(http://cldup.com/rawfy7Eth9.png)]]

 Red links:

 [[Image(http://cldup.com/PGDfF4zXTZ.png)]]

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