[wp-trac] [WordPress Trac] #49999: Iterating on Admin Color Schemes

[WordPress Trac]

#49999: Iterating on Admin Color Schemes
------------------------------------+-----------------------------
 Reporter:  ryelle                  |      Owner:  (none)
     Type:  enhancement             |     Status:  new
 Priority:  normal                  |  Milestone:  Awaiting Review
Component:  General                 |    Version:
 Severity:  normal                  |   Keywords:
  Focuses:  ui, accessibility, css  |
------------------------------------+-----------------------------
 There are a set of color schemes available for wp-admin, but no new scheme
 has been added since these were created. If we want to add accessible
 color schemes (high or low contrast, dark mode, etc), we quickly run into
 issues with the current (Sass variable-based) system.

 1. The Sass variables are calculated from a set of about 3 colors, and
 those calculations only work for similar colors.

 See [https://core.trac.wordpress.org/browser/trunk/src/wp-
 admin/css/colors/midnight/colors.scss Midnight,] which sets the minimum
 variables and the defaults work well. Contrast the
 [https://core.trac.wordpress.org/browser/trunk/src/wp-
 admin/css/colors/light/colors.scss light blue color scheme,] which needs
 to override other variables. The functions make assumptions about color &
 context, things that work for dark colors don't work well for light.

 2. Specificity of the core styles makes it complicated to override colors.

 The default colors are defined in the main CSS, so every color scheme
 needs to override that. Currently this is done with a base `_admin.scss`
 file, but if a scheme needs to override a specific rule, its styles need
 to be just as specific. (This shouldn’t have to happen, but like above,
 not every color variable works out, for example the
 [https://core.trac.wordpress.org/browser/trunk/src/wp-
 admin/css/colors/light/colors.scss light blue color scheme] also needs to
 override CSS)

 That base file also needs to be kept up to date with any core changes.

 3. Not all colors are controlled by variables.

 Text color (outside of menu & links) are not controlled by variables (not
 even the `$text-color` variable). Neither are the colors that identify
 actions (like unapproved comments, or deleting a post). Probably more?
 These would need to be overridden for high contrast & dark mode schemes.

 Given those issues, how should we move forward to create new admin color
 schemes? If you’ve written a color scheme, are there other issues you’ve
 run into? Other color scheme implementations you think work well?

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