Re: [csswg-drafts] [various] Holistic review/proposal of color-modifying things (#3807)

I strongly support the goal of making the various media queries logically independent  (e.g., having `forced-colors` separate from the light/dark mode, separate from high/low contrast preference).  I think the proposals above achieve that goal for those features.

Authors can always use boolean combinations of media queries as needed, e.g. `@media (prefers-contrast: high) AND (prefers-color-scheme: dark) AND NOT (forced-colors) { /* author's high-contrast dark scheme */ }`

I'd recommend also splitting the relevant section of [Media Queries 5](https://drafts.csswg.org/mediaqueries-5/) to clearly separate out the user preference media queries which _ask_ the author to make changes (`prefers-reduced-motion`, `prefers-color-scheme`) from the media queries that _advise_ the author that the user agent is making its own modifications and some minor adjustments may be required (`forced-colors`, `inverted-colors`).

I wonder if `inverted-colors` could be generalized as `forced-filter`, to also include "night light" effects that change the brightness and hue of the screen.  e.g. `@media (forced-filter: invert)` vs `@media (forced-filter: sepia)` or just `@media (forced-filter)` to indicate that the user agent or OS is filtering the final rendered colors.

That would also avoid any confusion about how invert mode interacts with individual color values — it's a filter effect that applies to the full screen, although it is possible to revert the effect with opposite filters on individual elements. (I _think_ this is how the Safari implementation works, with the "reverting invert" filters on images and videos now specified in the user style sheet.  So specifying the same rule in an author stylesheet would have neither harm nor benefit.  But someone who is familiar with the latest WebKit changes needs to confirm.)

The special cascade order rules for `forced-color` / `-ms-high-contrast` might also apply for `forced-filter` and other “forced” UA media manipulations. Whether this is necessary would depend on how many other user-agent style tweaks get added in those conditions.  But for example, maybe I have an `<img>` that is a black line drawing on a white background and it _should_ actually get inverted to white on black when the user has inverted the rest of the screen, so I want to use `img { filter: none}` to cancel out any user-agent stylesheet that double-inverts images.

-- 
GitHub Notification of comment by AmeliaBR
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/3807#issuecomment-480447849 using your GitHub account

Received on Friday, 5 April 2019 23:03:17 UTC