Skip to content

color-scheme selector (light | dark | auto) on CSS spec drafts does not work #11589

Open
@dholbert

Description

@dholbert

This might really be a bug that I should file in https://github.com/speced/bikeshed/ ; not sure, but CC'ing @tabatkins since this is probably in Tab's wheelhouse one way or another.

Steps to Reproduce:

  1. Visit either of these specs in a desktop browser:
    https://drafts.csswg.org/css-flexbox-1/
    https://drafts.csswg.org/css-lists-3/
    https://drafts.csswg.org/css-grid-2/

  2. Click the sun/moon icon at bottom left to pop out the <input name="color-scheme" type="radio"> menu.

  3. Click among the options there (light, dark, auto) and see if the page changes.

ACTUAL RESULTS: The page doesn't change its look/color-scheme at all.

EXPECTED RESULTS: Page should presumably change its look/color-scheme in response to user choices there. Or, this menu should be removed.

I see these actual-results in Firefox, Chrome, and WebKit. I tested with my browser's own color-scheme preference set to light and to dark -- that browser color-scheme difference does make a difference for the page's rendering, but the in-page menu seems to make no difference.

(Looking in devtools, it looks like this UI just adds the darkmode class to the page's body element, but that class doesn't get used at all in the CSS -- the css uses @media (prefers-color-scheme: dark) { instead.)

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions