Skip to content

Commit 19663b6

Browse files
universseuniversse
committed
fix: color scheme
1 parent 1b315bb commit 19663b6

File tree

4 files changed

+55
-49
lines changed

4 files changed

+55
-49
lines changed

‎demos/astro/src/pages/_style.css

+18-16
Original file line numberDiff line numberDiff line change
@@ -23,60 +23,62 @@ body, .theme {
2323
background-color: var(--color-background);
2424
}
2525

26+
:is(:root, .theme)[data-color-scheme="light"] {
27+
color-scheme: light;
28+
}
29+
30+
:is(:root, .theme)[data-color-scheme="dark"] {
31+
color-scheme: dark;
32+
}
33+
34+
:is(:root, .theme)[data-color-scheme="system"] {
35+
color-scheme: light;
36+
}
37+
38+
@media (prefers-color-scheme: dark) {
39+
:is(:root, .theme)[data-color-scheme="system"] {
40+
color-scheme: dark;
41+
}
42+
}
43+
2644
:is(:root, .theme)[data-color-scheme="light"][data-contrast="standard"] {
2745
--color-background: #fff;
2846
--color-text: #555;
29-
30-
color-scheme: light;
3147
}
3248

3349
:is(:root, .theme)[data-color-scheme="light"][data-contrast="high"] {
3450
--color-background: #fff;
3551
--color-text: #222;
36-
37-
color-scheme: light;
3852
}
3953

4054
:is(:root, .theme)[data-color-scheme="dark"][data-contrast="standard"] {
4155
--color-background: #000;
4256
--color-text: #aaa;
43-
44-
color-scheme: dark;
4557
}
4658

4759
:is(:root, .theme)[data-color-scheme="dark"][data-contrast="high"] {
4860
--color-background: #000;
4961
--color-text: #ddd;
50-
51-
color-scheme: dark;
5262
}
5363

5464
:is(:root, .theme)[data-color-scheme="system"][data-contrast="standard"] {
5565
--color-background: #fff;
5666
--color-text: #555;
57-
58-
color-scheme: light;
5967
}
6068

6169
:is(:root, .theme)[data-color-scheme="system"][data-contrast="high"] {
6270
--color-background: #fff;
6371
--color-text: #222;
64-
65-
color-scheme: light;
6672
}
6773

6874
@media (prefers-color-scheme: dark) {
6975
:is(:root, .theme)[data-color-scheme="system"][data-contrast="standard"] {
7076
--color-background: #000;
7177
--color-text: #aaa;
72-
73-
color-scheme: dark;
7478
}
7579

7680
:is(:root, .theme)[data-color-scheme="system"][data-contrast="high"] {
7781
--color-background: #000;
7882
--color-text: #ddd;
79-
80-
color-scheme: dark;
8183
}
8284
}

‎demos/next/style.css

+18-16
Original file line numberDiff line numberDiff line change
@@ -23,60 +23,62 @@ body, .theme {
2323
background-color: var(--color-background);
2424
}
2525

26+
:is(:root, .theme)[data-color-scheme="light"] {
27+
color-scheme: light;
28+
}
29+
30+
:is(:root, .theme)[data-color-scheme="dark"] {
31+
color-scheme: dark;
32+
}
33+
34+
:is(:root, .theme)[data-color-scheme="system"] {
35+
color-scheme: light;
36+
}
37+
38+
@media (prefers-color-scheme: dark) {
39+
:is(:root, .theme)[data-color-scheme="system"] {
40+
color-scheme: dark;
41+
}
42+
}
43+
2644
:is(:root, .theme)[data-color-scheme="light"][data-contrast="standard"] {
2745
--color-background: #fff;
2846
--color-text: #555;
29-
30-
color-scheme: light;
3147
}
3248

3349
:is(:root, .theme)[data-color-scheme="light"][data-contrast="high"] {
3450
--color-background: #fff;
3551
--color-text: #222;
36-
37-
color-scheme: light;
3852
}
3953

4054
:is(:root, .theme)[data-color-scheme="dark"][data-contrast="standard"] {
4155
--color-background: #000;
4256
--color-text: #aaa;
43-
44-
color-scheme: dark;
4557
}
4658

4759
:is(:root, .theme)[data-color-scheme="dark"][data-contrast="high"] {
4860
--color-background: #000;
4961
--color-text: #ddd;
50-
51-
color-scheme: dark;
5262
}
5363

5464
:is(:root, .theme)[data-color-scheme="system"][data-contrast="standard"] {
5565
--color-background: #fff;
5666
--color-text: #555;
57-
58-
color-scheme: light;
5967
}
6068

6169
:is(:root, .theme)[data-color-scheme="system"][data-contrast="high"] {
6270
--color-background: #fff;
6371
--color-text: #222;
64-
65-
color-scheme: light;
6672
}
6773

6874
@media (prefers-color-scheme: dark) {
6975
:is(:root, .theme)[data-color-scheme="system"][data-contrast="standard"] {
7076
--color-background: #000;
7177
--color-text: #aaa;
72-
73-
color-scheme: dark;
7478
}
7579

7680
:is(:root, .theme)[data-color-scheme="system"][data-contrast="high"] {
7781
--color-background: #000;
7882
--color-text: #ddd;
79-
80-
color-scheme: dark;
8183
}
8284
}

‎demos/remix/app/style.css

+18-16
Original file line numberDiff line numberDiff line change
@@ -23,60 +23,62 @@ body, .theme {
2323
background-color: var(--color-background);
2424
}
2525

26+
:is(:root, .theme)[data-color-scheme="light"] {
27+
color-scheme: light;
28+
}
29+
30+
:is(:root, .theme)[data-color-scheme="dark"] {
31+
color-scheme: dark;
32+
}
33+
34+
:is(:root, .theme)[data-color-scheme="system"] {
35+
color-scheme: light;
36+
}
37+
38+
@media (prefers-color-scheme: dark) {
39+
:is(:root, .theme)[data-color-scheme="system"] {
40+
color-scheme: dark;
41+
}
42+
}
43+
2644
:is(:root, .theme)[data-color-scheme="light"][data-contrast="standard"] {
2745
--color-background: #fff;
2846
--color-text: #555;
29-
30-
color-scheme: light;
3147
}
3248

3349
:is(:root, .theme)[data-color-scheme="light"][data-contrast="high"] {
3450
--color-background: #fff;
3551
--color-text: #222;
36-
37-
color-scheme: light;
3852
}
3953

4054
:is(:root, .theme)[data-color-scheme="dark"][data-contrast="standard"] {
4155
--color-background: #000;
4256
--color-text: #aaa;
43-
44-
color-scheme: dark;
4557
}
4658

4759
:is(:root, .theme)[data-color-scheme="dark"][data-contrast="high"] {
4860
--color-background: #000;
4961
--color-text: #ddd;
50-
51-
color-scheme: dark;
5262
}
5363

5464
:is(:root, .theme)[data-color-scheme="system"][data-contrast="standard"] {
5565
--color-background: #fff;
5666
--color-text: #555;
57-
58-
color-scheme: light;
5967
}
6068

6169
:is(:root, .theme)[data-color-scheme="system"][data-contrast="high"] {
6270
--color-background: #fff;
6371
--color-text: #222;
64-
65-
color-scheme: light;
6672
}
6773

6874
@media (prefers-color-scheme: dark) {
6975
:is(:root, .theme)[data-color-scheme="system"][data-contrast="standard"] {
7076
--color-background: #000;
7177
--color-text: #aaa;
72-
73-
color-scheme: dark;
7478
}
7579

7680
:is(:root, .theme)[data-color-scheme="system"][data-contrast="high"] {
7781
--color-background: #000;
7882
--color-text: #ddd;
79-
80-
color-scheme: dark;
8183
}
8284
}

‎palettez/package.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "palettez",
3-
"version": "0.0.11",
3+
"version": "0.0.12",
44
"description": "Palettez",
55
"keywords": ["theming"],
66
"repository": {

0 commit comments

Comments
 (0)