- commit
- 91d9fc6f1d5fa6180401455677c0db9b2f5311f8
- parent
- f1594db5e1db90d1bae971ee642bd36bb59a8b97
- Author
- Tobias Bengfort <tobias.bengfort@posteo.de>
- Date
- 2025-03-21 10:28
examples: add dark mode wcag works better in dark context
Diffstat
| M | examples/style.css | 20 | ++++++++++++++++++-- |
1 files changed, 18 insertions, 2 deletions
diff --git a/examples/style.css b/examples/style.css
@@ -1,11 +1,27 @@
-1 1 :root {
-1 2 --tile: #eee;
-1 3 --label: #555;
-1 4 --bg: #fff;
-1 5 }
-1 6
-1 7 @media (prefers-color-scheme: dark) {
-1 8 :root {
-1 9 color-scheme: dark;
-1 10 --bg: #222;
-1 11 --tile: #000;
-1 12 --label: #aaa;
-1 13 }
-1 14 }
-1 15
1 16 body {
2 17 display: grid;
3 18 grid-template-columns: repeat(4, min-content);
4 19 grid-gap: 1rem;
-1 20 background: var(--bg);
5 21 }
6 22 .example {
7 23 width: 16rem;
8 -1 background: #eee;
-1 24 background: var(--tile);
9 25 font-weight: bold;
10 26 line-height: 1.4;
11 27 }
@@ -30,7 +46,7 @@ label {
30 46 .label {
31 47 display: inline-block;
32 48 width: 4.2em;
33 -1 color: #555;
-1 49 color: var(--label);
34 50 }
35 51
36 52 output {