WingNews logo WingNews GitHub [2]

bramus's comments

bramus | 1 year ago | on: Old dogs, new CSS tricks

View transitions are the perfect candidate progressive enhancement. If the browser supports it, then the user will get the rich animations. If it doesn’t, then they get what they currently have.

And once other browsers starts supporting it, the experience will automatically work in those browsers too without you needing to touch a single line of code :)

bramus | 2 years ago | on: The Future of CSS: Easy Light-Dark Mode Color Switching with Light-Dark()

(Hi, author of the post/article here)

> This solves one tiny aspect of the larger problem in a non-scalable way that will inevitably lead to bloat and inflexibility. It's a really a naive approach that hasn't taken into account design at scale, nor the future of where design is heading.

Note that `light-dark()` isn’t the end goal here. As discussed within the CSS WG, the end goal is to have a generic function `schemed-value()` to give you what you want.

I realize this wasn’t included in the post, so I’ve added a new section to the post with this information: https://www.bram.us/2023/10/09/the-future-of-css-easy-light-...

I hope this addresses your concern. If not, feel free to let me (or the CSS WG for that matter) know.

bramus | 2 years ago | on: The Future of CSS: Easy Light-Dark Mode Color Switching with Light-Dark()

(Hi, author of the post/article here)

Yes, `light-dark()` is very specific in what it can do … but it’s not the end goal. The end goal is to have a generic function – something like `schemed-value()` – that can respond to a plentitude of `color-scheme` values and return more than just `<color>` values.

Reality is, though, that browsers don’t have support for custom `color-scheme` values (it’s explicitly forbidden in the spec, for now) [^1] and that CSS parsers need to know ahead of time what they are about to parse [^2].

By narrowing things down in feature scope, you can use this convenience method now, instead of needing to wait a few months/years until the rest is figured out.

Once `schemed-value()` becomes a thing, `light-dark()` can become syntactic sugar for it:

``` light-dark(<color>, <color>); = schemed-value(light <color>, dark <color>); ```

[^1]: https://drafts.csswg.org/css-color-adjust/#color-scheme-prop... [^2]: https://www.w3.org/TR/css-syntax-3/#parse-grammar

bramus | 2 years ago | on: The Future of CSS: Easy Light-Dark Mode Color Switching with Light-Dark()

(Hi, author of the post here) `grey` is no accepted value for `color-scheme`, so that would make no sense.

Note that `light-dark()` is not the end station here, it’s a step towards a future function that (1) would be able to respond to any value for `color-scheme` and (2) can return any type of value.

page 1