primer/css
1
1
Fork 0
mirror of https://github.com/primer/css.git synced 2024-12-14 06:44:38 +03:00
Code Issues Projects Releases Wiki Activity

Update color mode mixin to support 'auto'

Browse Source
This commit is contained in:
Michelle Tilley 2020-10-22 20:30:50 -07:00
parent fb8a46b495
commit ea3d15daf0
No known key found for this signature in database
GPG Key ID: 810E3A96D4CF00F4
1 changed files with 13 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
src/support/mixins/color-modes.scss
View File

@ -1,14 +1,26 @@
// Allows CSS to be scoped to a specific color mode
@mixin color-mode($mode) {
@if $mode == light {
:root,
:root:not(data-color-mode),
[data-color-mode="light"] {
@content;
}
[data-color-mode="auto"] {
@media (prefers-color-scheme: light) {
@content;
}
}
}
@else if $mode == dark {
[data-color-mode="dark"] {
@content;
}
[data-color-mode="auto"] {
@media (prefers-color-scheme: dark) {
@content;
}
}
}
}