News for hackers. Stuff that matters.

A comment on The Future of CSS: Easy Light-Dark Mode Color Switching with Light-Dark(). Parent comment

Re:The Future of CSS: Easy Light-Dark Mode Color Switching w... by miragecraft on Monday October 09, 2023 @07:24PM (#37826728)
I agree.

You can already do this using the space toggle technique:

:root { --dark: ; }

@media (prefers-color-scheme: dark) { --light: ; --dark:initial; }

.example { color: var(--light, #000) var(--dark, #fff); }

[ Parent | on HN ]
Re:The Future of CSS: Easy Light-Dark Mode Color Switching w... by Kerrick on Monday October 09, 2023 @08:18PM (#37827094)
Ah yes, the CSS Space Toggle. The way this works internally is a seemingly-unintended but very useful aspect of the CSS specification.
[ Parent | on HN ]
Re:The Future of CSS: Easy Light-Dark Mode Color Switching w... by zeroimpl on Monday October 09, 2023 @08:20PM (#37827115)
That looks awful, but presumably if you are using sass instead of css you could define a light-dark macro already which does exactly that.

I wonder if custom functions might ever make their way to css.

[ Parent | on HN ]
Re:The Future of CSS: Easy Light-Dark Mode Color Switching w... by miragecraft on Tuesday October 10, 2023 @10:04AM (#37832259)
Correction, the media query should have been:

@media (prefers-color-scheme: dark) { :root { --light: ; --dark:initial; } }

Missed the selector.

[ Parent | on HN ]