Skip to content

Commit 847ff06

Browse files
committed
Scope theme selectors to root
- Prefix theme classes with `:root` in `themes.css` - Keep light and dark variable overrides anchored to the document root
1 parent aa36062 commit 847ff06

1 file changed

Lines changed: 10 additions & 10 deletions

File tree

apps/web/src/themes.css

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55

66
/* ─── Iridescent Void ─── futuristic, expensive, slightly alien ─── */
77

8-
.theme-iridescent-void {
8+
:root.theme-iridescent-void {
99
color-scheme: light;
1010
--background: #f4f2f7;
1111
--foreground: #1e1b2e;
@@ -34,7 +34,7 @@
3434
--warning-foreground: #ad7a18;
3535
}
3636

37-
.theme-iridescent-void.dark {
37+
:root.theme-iridescent-void.dark {
3838
color-scheme: dark;
3939
--background: #000000;
4040
--foreground: #e8e4f0;
@@ -65,7 +65,7 @@
6565

6666
/* ─── Solar Witch ─── magical, cozy, ritualistic ─── */
6767

68-
.theme-solar-witch {
68+
:root.theme-solar-witch {
6969
color-scheme: light;
7070
--background: #faf5ee;
7171
--foreground: #2d2118;
@@ -94,7 +94,7 @@
9494
--warning-foreground: #ad7a18;
9595
}
9696

97-
.theme-solar-witch.dark {
97+
:root.theme-solar-witch.dark {
9898
color-scheme: dark;
9999
--background: #120e0a;
100100
--foreground: #f0e6d6;
@@ -125,7 +125,7 @@
125125

126126
/* ─── Deep Sea Terminal ─── submerged, dreamy, calm ─── */
127127

128-
.theme-deep-sea-terminal {
128+
:root.theme-deep-sea-terminal {
129129
color-scheme: light;
130130
--background: #f0f7f6;
131131
--foreground: #132d2a;
@@ -154,7 +154,7 @@
154154
--warning-foreground: #ad7a18;
155155
}
156156

157-
.theme-deep-sea-terminal.dark {
157+
:root.theme-deep-sea-terminal.dark {
158158
color-scheme: dark;
159159
--background: #060e14;
160160
--foreground: #d0eae6;
@@ -185,7 +185,7 @@
185185

186186
/* ─── Cathedral Circuit ─── sacred machine, techno-gothic ─── */
187187

188-
.theme-cathedral-circuit {
188+
:root.theme-cathedral-circuit {
189189
color-scheme: light;
190190
--background: #f2f0ed;
191191
--foreground: #1c1a18;
@@ -214,7 +214,7 @@
214214
--warning-foreground: #a87308;
215215
}
216216

217-
.theme-cathedral-circuit.dark {
217+
:root.theme-cathedral-circuit.dark {
218218
color-scheme: dark;
219219
--background: #121214;
220220
--foreground: #dcd8d2;
@@ -245,7 +245,7 @@
245245

246246
/* ─── Neon Bento ─── cute, modern, surprisingly usable ─── */
247247

248-
.theme-neon-bento {
248+
:root.theme-neon-bento {
249249
color-scheme: light;
250250
--background: #fefcfa;
251251
--foreground: #1f1a17;
@@ -274,7 +274,7 @@
274274
--warning-foreground: #ad7a18;
275275
}
276276

277-
.theme-neon-bento.dark {
277+
:root.theme-neon-bento.dark {
278278
color-scheme: dark;
279279
--background: #1a1618;
280280
--foreground: #f0e8e2;

0 commit comments

Comments
 (0)