light-dark() supports images now - which is the only thing we're using postcss-mixins for.
We should therefore be able to replace our uses of @mixin light-dark with native light-dark(), and remove the postcss plugin, and stylelint overrides (e.g. #1861)
However, currently the postcss-light-dark plugin adds a @supports (color: light-dark(red, red)) block which would expose light-dark(<image>, <image>) on browsers which don't support it.
Setting preserve: false on this plugin will allow us to make the switch now, until postcss-light-dark detects image support and uses an appropriate @support block.
We also need to force the postcss-light-dark plugin on, until upstream supports light-dark(<image>, <image>), otherwise it'll stop transpiling once light-dark(<colour>, <colour>) is Widely Available (and we drop support for Firefox 115).
light-dark()supports images now - which is the only thing we're usingpostcss-mixinsfor.We should therefore be able to replace our uses of
@mixin light-darkwith nativelight-dark(), and remove the postcss plugin, and stylelint overrides (e.g. #1861)However, currently the
postcss-light-darkplugin adds a@supports (color: light-dark(red, red))block which would exposelight-dark(<image>, <image>)on browsers which don't support it.Setting
preserve: falseon this plugin will allow us to make the switch now, untilpostcss-light-darkdetects image support and uses an appropriate@supportblock.We also need to force the
postcss-light-darkplugin on, until upstream supportslight-dark(<image>, <image>), otherwise it'll stop transpiling oncelight-dark(<colour>, <colour>)is Widely Available (and we drop support for Firefox 115).