[wp-trac] [WordPress Trac] #63030: Update CSS for `::-moz-placeholder` color

[WordPress Trac]

#63030: Update CSS for `::-moz-placeholder` color
----------------------------+-----------------------------
 Reporter:  afercia         |      Owner:  (none)
     Type:  defect (bug)    |     Status:  new
 Priority:  normal          |  Milestone:  Awaiting Review
Component:  Administration  |    Version:
 Severity:  normal          |   Keywords:
  Focuses:  accessibility   |
----------------------------+-----------------------------
 See related GitHub issue for the block editor:
 https://github.com/WordPress/gutenberg/issues/69311

 This applies to both Core and Bundled Themes.

 Firefox changed their implementation for the native placeholder attribute
 color, see https://github.com/mozilla/gecko-
 dev/commit/2af3322dbe9ac09d6117faba6ce21494e53ef7a2

 Instead of using `opacity: 0.54;` Firefox now uses a `color-mix` value
 with an equivalent opacity:

 {{{
 color: color-mix(in srgb, currentColor 54%, transparent);
 }}}


 Core and Themes used to override the Firefox opacity to `opacity: 1;` to
 make sure the placeholder text color has sufficient contrast ratio.

 Given the upstream change:
 - The `opacity: 1;` is no longer necessary. It doesn't do anything and can
 be safely removed.
 - For themes: the opacity can be removed as well but themes that don't set
 a color should now set one otherwise the default Firefox color is used
 instead and it doesn't have a sufficient color contrast. For example.
 Twenty Twemty-One does use an opacity [https://github.com/WordPress
 /wordpress-develop/blob/b45e379d214240be1c572db0b1078f5d39b7ea71/src/wp-
 content/themes/twentytwentyone/assets/sass/04-elements/forms.scss#L300-L302
 but it doesn't use a color.]

 Note:
 If you're curious to check the Firefox default stylesheet for form
 elements, you can access the Firefox `forms.css` stylesheet by entering
 this resource URL in your Firefox address bar: `resource://gre-
 resources/forms.css`

-- 
Ticket URL: <https://core.trac.wordpress.org/ticket/63030>
WordPress Trac <https://core.trac.wordpress.org/>
WordPress publishing platform