daisyui 4.0.0-alpha.2 → 4.0.0-alpha.21

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (20) hide show
  1. package/README.md +9 -178
  2. package/dist/base.js +1 -1
  3. package/dist/full.css +21630 -26310
  4. package/dist/styled.css +1415 -1176
  5. package/dist/styled.js +1 -1
  6. package/dist/themes.css +758 -817
  7. package/dist/unstyled.css +187 -113
  8. package/dist/unstyled.js +1 -1
  9. package/dist/utilities-styled.js +1 -1
  10. package/dist/utilities-unstyled.js +1 -1
  11. package/package.json +10 -12
  12. package/src/index.d.ts +3 -0
  13. package/src/index.js +24 -29
  14. package/src/lib/responsiveRegex.js +2 -2
  15. package/src/theming/colorNames.js +0 -4
  16. package/src/theming/functions.js +78 -103
  17. package/src/theming/index.js +23 -25
  18. package/src/theming/themeDefaults.js +3 -1
  19. package/src/theming/themes.d.ts +1 -1
  20. package/src/theming/themes.js +184 -134
package/dist/themes.css CHANGED
@@ -1,1151 +1,1092 @@
1
1
  :root {
2
2
  color-scheme: light;
3
- --pf: 259 94% 44%;
4
- --sf: 314 100% 40%;
5
- --af: 174 75% 39%;
6
- --nf: 214 20% 14%;
7
- --in: 198 93% 60%;
8
- --su: 158 64% 52%;
9
- --wa: 43 96% 56%;
10
- --er: 0 91% 71%;
11
- --inc: 198 100% 12%;
12
- --suc: 158 100% 10%;
13
- --wac: 43 100% 11%;
14
- --erc: 0 100% 14%;
3
+ --in: 0.7206 0.191 231.6;
4
+ --su: 0.7441 0.213 164.75;
5
+ --wa: 0.8471 0.199 83.87;
6
+ --er: 0.7176 0.221 22.18;
7
+ --pc: 0.89824 0.06192 275.75;
8
+ --ac: 0.15352 0.0368 183.61;
9
+ --inc: 0 0 0;
10
+ --suc: 0 0 0;
11
+ --wac: 0 0 0;
12
+ --erc: 0 0 0;
15
13
  --rounded-box: 1rem;
16
14
  --rounded-btn: 0.5rem;
17
15
  --rounded-badge: 1.9rem;
18
16
  --animation-btn: 0.25s;
19
17
  --animation-input: .2s;
20
- --btn-text-case: uppercase;
21
18
  --btn-focus-scale: 0.95;
22
19
  --border-btn: 1px;
23
20
  --tab-border: 1px;
24
21
  --tab-radius: 0.5rem;
25
- --p: 259 94% 51%;
26
- --pc: 259 96% 91%;
27
- --s: 314 100% 47%;
28
- --sc: 314 100% 91%;
29
- --a: 174 75% 46%;
30
- --ac: 174 75% 11%;
31
- --n: 214 20% 21%;
32
- --nc: 212 19% 87%;
33
- --b1: 0 0% 100%;
34
- --b2: 0 0% 95%;
35
- --b3: 180 2% 90%;
36
- --bc: 215 28% 17%
22
+ --p: 0.4912 0.3096 275.75;
23
+ --s: 0.6971 0.329 342.55;
24
+ --sc: 0.9871 0.0106 342.55;
25
+ --a: 0.7676 0.184 183.61;
26
+ --n: 0.321785 0.02476 255.701624;
27
+ --nc: 0.894994 0.011585 252.096176;
28
+ --b1: 1 0 0;
29
+ --b2: 0.961151 0 0;
30
+ --b3: 0.924169 0.00108 197.137559;
31
+ --bc: 0.278078 0.029596 256.847952
37
32
  }
38
33
  @media (prefers-color-scheme: dark) {
39
34
  :root {
40
35
  color-scheme: dark;
41
- --pf: 262 80% 43%;
42
- --sf: 316 70% 43%;
43
- --af: 175 70% 34%;
44
- --in: 198 93% 60%;
45
- --su: 158 64% 52%;
46
- --wa: 43 96% 56%;
47
- --er: 0 91% 71%;
48
- --inc: 198 100% 12%;
49
- --suc: 158 100% 10%;
50
- --wac: 43 100% 11%;
51
- --erc: 0 100% 14%;
36
+ --in: 0.7206 0.191 231.6;
37
+ --su: 0.7441 0.213 164.75;
38
+ --wa: 0.8471 0.199 83.87;
39
+ --er: 0.7176 0.221 22.18;
40
+ --pc: 0.13138 0.0392 275.75;
41
+ --sc: 0.1496 0.052 342.55;
42
+ --ac: 0.14902 0.0334 183.61;
43
+ --inc: 0 0 0;
44
+ --suc: 0 0 0;
45
+ --wac: 0 0 0;
46
+ --erc: 0 0 0;
52
47
  --rounded-box: 1rem;
53
48
  --rounded-btn: 0.5rem;
54
49
  --rounded-badge: 1.9rem;
55
50
  --animation-btn: 0.25s;
56
51
  --animation-input: .2s;
57
- --btn-text-case: uppercase;
58
52
  --btn-focus-scale: 0.95;
59
53
  --border-btn: 1px;
60
54
  --tab-border: 1px;
61
55
  --tab-radius: 0.5rem;
62
- --p: 262 80% 50%;
63
- --pc: 0 0% 100%;
64
- --s: 316 70% 50%;
65
- --sc: 0 0% 100%;
66
- --a: 175 70% 41%;
67
- --ac: 0 0% 100%;
68
- --n: 213 18% 20%;
69
- --nf: 212 17% 17%;
70
- --nc: 220 13% 69%;
71
- --b1: 212 18% 14%;
72
- --b2: 213 18% 12%;
73
- --b3: 213 18% 10%;
74
- --bc: 220 13% 69%
56
+ --p: 0.6569 0.196 275.75;
57
+ --s: 0.748 0.26 342.55;
58
+ --a: 0.7451 0.167 183.61;
59
+ --n: 0.313815 0.021108 254.139175;
60
+ --nc: 0.746477 0.0216 264.435964;
61
+ --b1: 0.253267 0.015896 252.417568;
62
+ --b2: 0.232607 0.013807 253.100675;
63
+ --b3: 0.211484 0.01165 254.087939;
64
+ --bc: 0.746477 0.0216 264.435964
75
65
  }
76
66
  }
77
- [data-theme=light] {
67
+ [data-theme=light], :root:has(input.theme-controller[value=light]:checked) {
78
68
  color-scheme: light;
79
- --pf: 259 94% 44%;
80
- --sf: 314 100% 40%;
81
- --af: 174 75% 39%;
82
- --nf: 214 20% 14%;
83
- --in: 198 93% 60%;
84
- --su: 158 64% 52%;
85
- --wa: 43 96% 56%;
86
- --er: 0 91% 71%;
87
- --inc: 198 100% 12%;
88
- --suc: 158 100% 10%;
89
- --wac: 43 100% 11%;
90
- --erc: 0 100% 14%;
69
+ --in: 0.7206 0.191 231.6;
70
+ --su: 0.7441 0.213 164.75;
71
+ --wa: 0.8471 0.199 83.87;
72
+ --er: 0.7176 0.221 22.18;
73
+ --pc: 0.89824 0.06192 275.75;
74
+ --ac: 0.15352 0.0368 183.61;
75
+ --inc: 0 0 0;
76
+ --suc: 0 0 0;
77
+ --wac: 0 0 0;
78
+ --erc: 0 0 0;
91
79
  --rounded-box: 1rem;
92
80
  --rounded-btn: 0.5rem;
93
81
  --rounded-badge: 1.9rem;
94
82
  --animation-btn: 0.25s;
95
83
  --animation-input: .2s;
96
- --btn-text-case: uppercase;
97
84
  --btn-focus-scale: 0.95;
98
85
  --border-btn: 1px;
99
86
  --tab-border: 1px;
100
87
  --tab-radius: 0.5rem;
101
- --p: 259 94% 51%;
102
- --pc: 259 96% 91%;
103
- --s: 314 100% 47%;
104
- --sc: 314 100% 91%;
105
- --a: 174 75% 46%;
106
- --ac: 174 75% 11%;
107
- --n: 214 20% 21%;
108
- --nc: 212 19% 87%;
109
- --b1: 0 0% 100%;
110
- --b2: 0 0% 95%;
111
- --b3: 180 2% 90%;
112
- --bc: 215 28% 17%
88
+ --p: 0.4912 0.3096 275.75;
89
+ --s: 0.6971 0.329 342.55;
90
+ --sc: 0.9871 0.0106 342.55;
91
+ --a: 0.7676 0.184 183.61;
92
+ --n: 0.321785 0.02476 255.701624;
93
+ --nc: 0.894994 0.011585 252.096176;
94
+ --b1: 1 0 0;
95
+ --b2: 0.961151 0 0;
96
+ --b3: 0.924169 0.00108 197.137559;
97
+ --bc: 0.278078 0.029596 256.847952
113
98
  }
114
- [data-theme=dark] {
99
+ [data-theme=dark], :root:has(input.theme-controller[value=dark]:checked) {
115
100
  color-scheme: dark;
116
- --pf: 262 80% 43%;
117
- --sf: 316 70% 43%;
118
- --af: 175 70% 34%;
119
- --in: 198 93% 60%;
120
- --su: 158 64% 52%;
121
- --wa: 43 96% 56%;
122
- --er: 0 91% 71%;
123
- --inc: 198 100% 12%;
124
- --suc: 158 100% 10%;
125
- --wac: 43 100% 11%;
126
- --erc: 0 100% 14%;
101
+ --in: 0.7206 0.191 231.6;
102
+ --su: 0.7441 0.213 164.75;
103
+ --wa: 0.8471 0.199 83.87;
104
+ --er: 0.7176 0.221 22.18;
105
+ --pc: 0.13138 0.0392 275.75;
106
+ --sc: 0.1496 0.052 342.55;
107
+ --ac: 0.14902 0.0334 183.61;
108
+ --inc: 0 0 0;
109
+ --suc: 0 0 0;
110
+ --wac: 0 0 0;
111
+ --erc: 0 0 0;
127
112
  --rounded-box: 1rem;
128
113
  --rounded-btn: 0.5rem;
129
114
  --rounded-badge: 1.9rem;
130
115
  --animation-btn: 0.25s;
131
116
  --animation-input: .2s;
132
- --btn-text-case: uppercase;
133
117
  --btn-focus-scale: 0.95;
134
118
  --border-btn: 1px;
135
119
  --tab-border: 1px;
136
120
  --tab-radius: 0.5rem;
137
- --p: 262 80% 50%;
138
- --pc: 0 0% 100%;
139
- --s: 316 70% 50%;
140
- --sc: 0 0% 100%;
141
- --a: 175 70% 41%;
142
- --ac: 0 0% 100%;
143
- --n: 213 18% 20%;
144
- --nf: 212 17% 17%;
145
- --nc: 220 13% 69%;
146
- --b1: 212 18% 14%;
147
- --b2: 213 18% 12%;
148
- --b3: 213 18% 10%;
149
- --bc: 220 13% 69%
121
+ --p: 0.6569 0.196 275.75;
122
+ --s: 0.748 0.26 342.55;
123
+ --a: 0.7451 0.167 183.61;
124
+ --n: 0.313815 0.021108 254.139175;
125
+ --nc: 0.746477 0.0216 264.435964;
126
+ --b1: 0.253267 0.015896 252.417568;
127
+ --b2: 0.232607 0.013807 253.100675;
128
+ --b3: 0.211484 0.01165 254.087939;
129
+ --bc: 0.746477 0.0216 264.435964
150
130
  }
151
- [data-theme=cupcake] {
131
+ [data-theme=cupcake], :root:has(input.theme-controller[value=cupcake]:checked) {
152
132
  color-scheme: light;
153
- --pf: 183 47% 52%;
154
- --sf: 338 71% 71%;
155
- --af: 39 84% 51%;
156
- --nf: 280 46% 7%;
157
- --in: 198 93% 60%;
158
- --su: 158 64% 52%;
159
- --wa: 43 96% 56%;
160
- --er: 0 91% 71%;
161
- --pc: 183 20% 13%;
162
- --sc: 340 15% 16%;
163
- --ac: 37 41% 13%;
164
- --nc: 283 9% 81%;
165
- --inc: 198 100% 12%;
166
- --suc: 158 100% 10%;
167
- --wac: 43 100% 11%;
168
- --erc: 0 100% 14%;
133
+ --in: 0.7206 0.191 231.6;
134
+ --su: 0.7441 0.213 164.75;
135
+ --wa: 0.8471 0.199 83.87;
136
+ --er: 0.7176 0.221 22.18;
137
+ --pc: 0.152344 0.017892 200.026556;
138
+ --sc: 0.15787 0.020249 356.29965;
139
+ --ac: 0.158762 0.029206 78.618794;
140
+ --nc: 0.847148 0.013247 313.189598;
141
+ --inc: 0 0 0;
142
+ --suc: 0 0 0;
143
+ --wac: 0 0 0;
144
+ --erc: 0 0 0;
169
145
  --rounded-box: 1rem;
170
146
  --rounded-badge: 1.9rem;
171
147
  --animation-btn: 0.25s;
172
148
  --animation-input: .2s;
173
- --btn-text-case: uppercase;
174
149
  --btn-focus-scale: 0.95;
175
150
  --border-btn: 1px;
176
- --p: 183 47% 59%;
177
- --s: 338 71% 78%;
178
- --a: 39 84% 58%;
179
- --n: 280 46% 14%;
180
- --b1: 24 33% 97%;
181
- --b2: 27 22% 92%;
182
- --b3: 23 14% 89%;
183
- --bc: 280 46% 14%;
151
+ --p: 0.76172 0.089459 200.026556;
152
+ --s: 0.789351 0.101246 356.29965;
153
+ --a: 0.793811 0.146032 78.618794;
154
+ --n: 0.235742 0.066235 313.189598;
155
+ --b1: 0.977882 0.00418 56.375637;
156
+ --b2: 0.939822 0.007638 61.449292;
157
+ --b3: 0.915861 0.006811 53.440502;
158
+ --bc: 0.235742 0.066235 313.189598;
184
159
  --rounded-btn: 1.9rem;
185
160
  --tab-border: 2px;
186
- --tab-radius: .5rem
161
+ --tab-radius: 0.7rem
187
162
  }
188
- [data-theme=bumblebee] {
163
+ [data-theme=bumblebee], :root:has(input.theme-controller[value=bumblebee]:checked) {
189
164
  color-scheme: light;
190
- --pf: 50 94% 51%;
191
- --sf: 41 74% 46%;
192
- --af: 24 67% 52%;
193
- --nf: 240 33% 7%;
194
- --b2: 0 0% 93%;
195
- --b3: 0 0% 86%;
196
- --in: 198 93% 60%;
197
- --su: 158 64% 52%;
198
- --wa: 43 96% 56%;
199
- --er: 0 91% 71%;
200
- --bc: 146 0% 19%;
201
- --ac: 23 34% 13%;
202
- --nc: 247 7% 81%;
203
- --inc: 198 100% 12%;
204
- --suc: 158 100% 10%;
205
- --wac: 43 100% 11%;
206
- --erc: 0 100% 14%;
165
+ --b2: 0.93 0 0;
166
+ --b3: 0.86 0 0;
167
+ --in: 0.7206 0.191 231.6;
168
+ --su: 0.7441 0.213 164.75;
169
+ --wa: 0.8471 0.199 83.87;
170
+ --er: 0.7176 0.221 22.18;
171
+ --bc: 0.2 0 0;
172
+ --ac: 0.16254 0.0314 56.52;
173
+ --nc: 0.8255 0.015 281.99;
174
+ --inc: 0 0 0;
175
+ --suc: 0 0 0;
176
+ --wac: 0 0 0;
177
+ --erc: 0 0 0;
207
178
  --rounded-box: 1rem;
208
179
  --rounded-btn: 0.5rem;
209
180
  --rounded-badge: 1.9rem;
210
181
  --animation-btn: 0.25s;
211
182
  --animation-input: .2s;
212
- --btn-text-case: uppercase;
213
183
  --btn-focus-scale: 0.95;
214
184
  --border-btn: 1px;
215
185
  --tab-border: 1px;
216
186
  --tab-radius: 0.5rem;
217
- --p: 50 94% 58%;
218
- --pc: 240 33% 14%;
219
- --s: 41 74% 53%;
220
- --sc: 240 33% 14%;
221
- --a: 24 67% 59%;
222
- --n: 240 33% 14%;
223
- --b1: 0 0% 100%
187
+ --p: 0.8951 0.2132 96.61;
188
+ --pc: 0.3892 0.046 96.61;
189
+ --s: 0.8039 0.194 70.76;
190
+ --sc: 0.3938 0.068 70.76;
191
+ --a: 0.8127 0.157 56.52;
192
+ --n: 0.1275 0.075 281.99;
193
+ --b1: 1 0 0
224
194
  }
225
- [data-theme=emerald] {
195
+ [data-theme=emerald], :root:has(input.theme-controller[value=emerald]:checked) {
226
196
  color-scheme: light;
227
- --pf: 141 50% 53%;
228
- --sf: 219 96% 53%;
229
- --af: 10 81% 49%;
230
- --nf: 219 20% 18%;
231
- --b2: 0 0% 93%;
232
- --b3: 0 0% 86%;
233
- --in: 198 93% 60%;
234
- --su: 158 64% 52%;
235
- --wa: 43 96% 56%;
236
- --er: 0 91% 71%;
237
- --inc: 198 100% 12%;
238
- --suc: 158 100% 10%;
239
- --wac: 43 100% 11%;
240
- --erc: 0 100% 14%;
197
+ --b2: 0.93 0 0;
198
+ --b3: 0.86 0 0;
199
+ --in: 0.7206 0.191 231.6;
200
+ --su: 0.7441 0.213 164.75;
201
+ --wa: 0.8471 0.199 83.87;
202
+ --er: 0.7176 0.221 22.18;
203
+ --inc: 0 0 0;
204
+ --suc: 0 0 0;
205
+ --wac: 0 0 0;
206
+ --erc: 0 0 0;
241
207
  --rounded-box: 1rem;
242
208
  --rounded-btn: 0.5rem;
243
209
  --rounded-badge: 1.9rem;
244
- --btn-text-case: uppercase;
245
210
  --border-btn: 1px;
246
211
  --tab-border: 1px;
247
212
  --tab-radius: 0.5rem;
248
- --p: 141 50% 60%;
249
- --pc: 151 28% 19%;
250
- --s: 219 96% 60%;
251
- --sc: 210 20% 98%;
252
- --a: 10 81% 56%;
253
- --ac: 210 20% 98%;
254
- --n: 219 20% 25%;
255
- --nc: 210 20% 98%;
256
- --b1: 0 0% 100%;
257
- --bc: 219 20% 25%;
213
+ --p: 0.766626 0.135433 153.450024;
214
+ --pc: 0.333872 0.040618 162.240129;
215
+ --s: 0.613028 0.202368 261.294233;
216
+ --sc: 1 0 0;
217
+ --a: 0.727725 0.149783 33.200363;
218
+ --ac: 0 0 0;
219
+ --n: 0.355192 0.032071 262.988584;
220
+ --nc: 0.984625 0.001706 247.838921;
221
+ --b1: 1 0 0;
222
+ --bc: 0.355192 0.032071 262.988584;
258
223
  --animation-btn: 0;
259
224
  --animation-input: 0;
260
225
  --btn-focus-scale: 1
261
226
  }
262
- [data-theme=corporate] {
227
+ [data-theme=corporate], :root:has(input.theme-controller[value=corporate]:checked) {
263
228
  color-scheme: light;
264
- --pf: 229 96% 57%;
265
- --sf: 215 26% 52%;
266
- --af: 154 49% 53%;
267
- --nf: 233 27% 6%;
268
- --b2: 0 0% 93%;
269
- --b3: 0 0% 86%;
270
- --in: 198 93% 60%;
271
- --su: 158 64% 52%;
272
- --wa: 43 96% 56%;
273
- --er: 0 91% 71%;
274
- --pc: 243 100% 94%;
275
- --sc: 216 13% 13%;
276
- --ac: 151 21% 13%;
277
- --inc: 198 100% 12%;
278
- --suc: 158 100% 10%;
279
- --wac: 43 100% 11%;
280
- --erc: 0 100% 14%;
281
- --btn-text-case: uppercase;
229
+ --b2: 0.93 0 0;
230
+ --b3: 0.86 0 0;
231
+ --in: 0.7206 0.191 231.6;
232
+ --su: 0.7441 0.213 164.75;
233
+ --wa: 0.8471 0.199 83.87;
234
+ --er: 0.7176 0.221 22.18;
235
+ --pc: 0.12078 0.0456 269.1;
236
+ --sc: 0.130739 0.010951 256.688055;
237
+ --ac: 0.153934 0.022799 163.57888;
238
+ --inc: 0 0 0;
239
+ --suc: 0 0 0;
240
+ --wac: 0 0 0;
241
+ --erc: 0 0 0;
282
242
  --border-btn: 1px;
283
243
  --tab-border: 1px;
284
- --tab-radius: 0.5rem;
285
- --p: 229 96% 64%;
286
- --s: 215 26% 59%;
287
- --a: 154 49% 60%;
288
- --n: 233 27% 13%;
289
- --nc: 210 38% 95%;
290
- --b1: 0 0% 100%;
291
- --bc: 233 27% 13%;
244
+ --p: 0.6039 0.228 269.1;
245
+ --s: 0.653694 0.054756 256.688055;
246
+ --a: 0.769669 0.113994 163.57888;
247
+ --n: 0.223899 0.031305 278.07229;
248
+ --nc: 0.958796 0.008588 247.915135;
249
+ --b1: 1 0 0;
250
+ --bc: 0.223899 0.031305 278.07229;
292
251
  --rounded-box: 0.25rem;
293
252
  --rounded-btn: .125rem;
294
253
  --rounded-badge: .125rem;
254
+ --tab-radius: 0.25rem;
295
255
  --animation-btn: 0;
296
256
  --animation-input: 0;
297
257
  --btn-focus-scale: 1
298
258
  }
299
- [data-theme=synthwave] {
259
+ [data-theme=synthwave], :root:has(input.theme-controller[value=synthwave]:checked) {
300
260
  color-scheme: dark;
301
- --pf: 321 70% 62%;
302
- --sf: 197 87% 58%;
303
- --af: 48 89% 50%;
304
- --nf: 253 59% 13%;
305
- --b2: 253 58% 8%;
306
- --b3: 253 58% 1%;
307
- --pc: 323 23% 15%;
308
- --sc: 199 28% 14%;
309
- --ac: 45 42% 13%;
261
+ --b2: 0.202941 0.076211 287.835609;
262
+ --b3: 0.187665 0.070475 287.835609;
263
+ --pc: 0.144421 0.031903 342.009383;
264
+ --sc: 0.156543 0.02362 227.382405;
265
+ --ac: 0.17608 0.0412 93.72;
310
266
  --rounded-box: 1rem;
311
267
  --rounded-btn: 0.5rem;
312
268
  --rounded-badge: 1.9rem;
313
269
  --animation-btn: 0.25s;
314
270
  --animation-input: .2s;
315
- --btn-text-case: uppercase;
316
271
  --btn-focus-scale: 0.95;
317
272
  --border-btn: 1px;
318
273
  --tab-border: 1px;
319
274
  --tab-radius: 0.5rem;
320
- --p: 321 70% 69%;
321
- --s: 197 87% 65%;
322
- --a: 48 89% 57%;
323
- --n: 253 59% 20%;
324
- --nc: 260 60% 98%;
325
- --b1: 253 58% 15%;
326
- --bc: 260 60% 98%;
327
- --in: 199 87% 64%;
328
- --inc: 257 63% 17%;
329
- --su: 168 74% 68%;
330
- --suc: 257 63% 17%;
331
- --wa: 48 89% 57%;
332
- --wac: 257 63% 17%;
333
- --er: 352 74% 57%;
334
- --erc: 260 60% 98%
275
+ --p: 0.722105 0.159514 342.009383;
276
+ --s: 0.782714 0.118101 227.382405;
277
+ --a: 0.8804 0.206 93.72;
278
+ --n: 0.255554 0.103537 286.507967;
279
+ --nc: 0.979365 0.00819 301.358346;
280
+ --b1: 0.218216 0.081948 287.835609;
281
+ --bc: 0.979365 0.00819 301.358346;
282
+ --in: 0.765197 0.12273 231.831603;
283
+ --inc: 0.235017 0.096418 290.329844;
284
+ --su: 0.860572 0.115038 178.624677;
285
+ --suc: 0.235017 0.096418 290.329844;
286
+ --wa: 0.85531 0.122117 93.722227;
287
+ --wac: 0.235017 0.096418 290.329844;
288
+ --er: 0.737005 0.121339 32.639257;
289
+ --erc: 0.235017 0.096418 290.329844
335
290
  }
336
- [data-theme=retro] {
291
+ [data-theme=retro], :root:has(input.theme-controller[value=retro]:checked) {
337
292
  color-scheme: light;
338
- --pf: 3 74% 69%;
339
- --sf: 145 27% 65%;
340
- --af: 24 67% 52%;
341
- --nf: 340 7% 10%;
342
- --inc: 239 85% 93%;
343
- --suc: 126 38% 89%;
344
- --wac: 29 59% 11%;
345
- --erc: 11 100% 91%;
293
+ --inc: 0.90923 0.043042 262.880917;
294
+ --suc: 0.12541 0.033982 149.213788;
295
+ --wac: 0.133168 0.031484 58.31834;
296
+ --erc: 0.13144 0.0398 27.33;
346
297
  --animation-btn: 0.25s;
347
298
  --animation-input: .2s;
348
- --btn-text-case: uppercase;
349
299
  --btn-focus-scale: 0.95;
350
300
  --border-btn: 1px;
351
301
  --tab-border: 1px;
352
- --tab-radius: 0.5rem;
353
- --p: 3 74% 76%;
354
- --pc: 345 5% 15%;
355
- --s: 145 27% 72%;
356
- --sc: 345 5% 15%;
357
- --a: 24 67% 59%;
358
- --ac: 345 5% 15%;
359
- --n: 340 7% 17%;
360
- --nc: 43 41% 88%;
361
- --b1: 45 47% 80%;
362
- --b2: 44 47% 73%;
363
- --b3: 44 47% 68%;
364
- --bc: 345 5% 15%;
365
- --in: 221 83% 53%;
366
- --su: 142 76% 36%;
367
- --wa: 32 95% 44%;
368
- --er: 0 72% 51%;
302
+ --p: 0.768664 0.104092 22.664655;
303
+ --pc: 0.265104 0.006243 0.522862;
304
+ --s: 0.807415 0.052534 159.094608;
305
+ --sc: 0.265104 0.006243 0.522862;
306
+ --a: 0.703919 0.125455 52.953428;
307
+ --ac: 0.265104 0.006243 0.522862;
308
+ --n: 0.284181 0.009519 355.534017;
309
+ --nc: 0.925604 0.025113 89.217311;
310
+ --b1: 0.916374 0.034554 90.51575;
311
+ --b2: 0.882722 0.049418 91.774344;
312
+ --b3: 0.84133 0.065952 90.856665;
313
+ --bc: 0.265104 0.006243 0.522862;
314
+ --in: 0.54615 0.215208 262.880917;
315
+ --su: 0.627052 0.169912 149.213788;
316
+ --wa: 0.66584 0.157422 58.31834;
317
+ --er: 0.6572 0.199 27.33;
369
318
  --rounded-box: 0.4rem;
370
319
  --rounded-btn: 0.4rem;
371
- --rounded-badge: 0.4rem
320
+ --rounded-badge: 0.4rem;
321
+ --tab-radius: 0.4rem
372
322
  }
373
- [data-theme=cyberpunk] {
323
+ [data-theme=cyberpunk], :root:has(input.theme-controller[value=cyberpunk]:checked) {
374
324
  color-scheme: light;
375
- --pf: 345 100% 66%;
376
- --sf: 195 80% 63%;
377
- --af: 276 74% 64%;
378
- --nf: 57 100% 6%;
379
- --b2: 56 100% 43%;
380
- --b3: 56 100% 36%;
381
- --in: 198 93% 60%;
382
- --su: 158 64% 52%;
383
- --wa: 43 96% 56%;
384
- --er: 0 91% 71%;
385
- --bc: 53 46% 13%;
386
- --pc: 348 27% 15%;
387
- --sc: 196 23% 15%;
388
- --ac: 277 22% 15%;
389
- --inc: 198 100% 12%;
390
- --suc: 158 100% 10%;
391
- --wac: 43 100% 11%;
392
- --erc: 0 100% 14%;
325
+ --b2: 0.878943 0.16647 104.32;
326
+ --b3: 0.812786 0.15394 104.32;
327
+ --in: 0.7206 0.191 231.6;
328
+ --su: 0.7441 0.213 164.75;
329
+ --wa: 0.8471 0.199 83.87;
330
+ --er: 0.7176 0.221 22.18;
331
+ --bc: 0.18902 0.0358 104.32;
332
+ --pc: 0.14844 0.0418 6.35;
333
+ --sc: 0.16666 0.0368 204.72;
334
+ --ac: 0.14372 0.04352 310.43;
335
+ --inc: 0 0 0;
336
+ --suc: 0 0 0;
337
+ --wac: 0 0 0;
338
+ --erc: 0 0 0;
393
339
  --animation-btn: 0.25s;
394
340
  --animation-input: .2s;
395
- --btn-text-case: uppercase;
396
341
  --btn-focus-scale: 0.95;
397
342
  --border-btn: 1px;
398
343
  --tab-border: 1px;
399
344
  font-family: ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;
400
- --p: 345 100% 73%;
401
- --s: 195 80% 70%;
402
- --a: 276 74% 71%;
403
- --n: 57 100% 13%;
404
- --nc: 56 100% 50%;
405
- --b1: 56 100% 50%;
345
+ --p: 0.7422 0.209 6.35;
346
+ --s: 0.8333 0.184 204.72;
347
+ --a: 0.7186 0.2176 310.43;
348
+ --n: 0.2304 0.065 269.31;
349
+ --nc: 0.9451 0.179 104.32;
350
+ --b1: 0.9451 0.179 104.32;
406
351
  --rounded-box: 0;
407
352
  --rounded-btn: 0;
408
353
  --rounded-badge: 0;
409
354
  --tab-radius: 0
410
355
  }
411
- [data-theme=valentine] {
356
+ [data-theme=valentine], :root:has(input.theme-controller[value=valentine]:checked) {
412
357
  color-scheme: light;
413
- --pf: 353 74% 60%;
414
- --sf: 254 86% 70%;
415
- --af: 181 56% 63%;
416
- --nf: 336 43% 41%;
417
- --b2: 318 46% 82%;
418
- --b3: 318 46% 75%;
419
- --pc: 356 26% 14%;
420
- --sc: 256 20% 15%;
421
- --ac: 181 16% 15%;
422
- --inc: 239 85% 93%;
423
- --suc: 126 38% 89%;
424
- --wac: 29 59% 11%;
425
- --erc: 11 100% 91%;
358
+ --b2: 0.880567 0.024834 337.06289;
359
+ --b3: 0.814288 0.022964 337.06289;
360
+ --pc: 0.137239 0.030755 15.066527;
361
+ --sc: 0.143942 0.029258 293.189609;
362
+ --ac: 0.142537 0.014961 197.828857;
363
+ --inc: 0.90923 0.043042 262.880917;
364
+ --suc: 0.12541 0.033982 149.213788;
365
+ --wac: 0.133168 0.031484 58.31834;
366
+ --erc: 0.14614 0.0414 27.33;
426
367
  --rounded-box: 1rem;
427
368
  --rounded-badge: 1.9rem;
428
369
  --animation-btn: 0.25s;
429
370
  --animation-input: .2s;
430
- --btn-text-case: uppercase;
431
371
  --btn-focus-scale: 0.95;
432
372
  --border-btn: 1px;
433
373
  --tab-border: 1px;
434
- --tab-radius: 0.5rem;
435
- --p: 353 74% 67%;
436
- --s: 254 86% 77%;
437
- --a: 181 56% 70%;
438
- --n: 336 43% 48%;
439
- --nc: 318 46% 89%;
440
- --b1: 318 46% 89%;
441
- --bc: 344 38% 28%;
442
- --in: 221 83% 53%;
443
- --su: 142 76% 36%;
444
- --wa: 32 95% 44%;
445
- --er: 0 72% 51%;
446
- --rounded-btn: 1.9rem
374
+ --p: 0.686197 0.153774 15.066527;
375
+ --s: 0.71971 0.14629 293.189609;
376
+ --a: 0.712685 0.074804 197.828857;
377
+ --n: 0.546053 0.143342 358.004839;
378
+ --nc: 0.902701 0.037202 336.955191;
379
+ --b1: 0.946846 0.026703 337.06289;
380
+ --bc: 0.373085 0.081131 4.606426;
381
+ --in: 0.54615 0.215208 262.880917;
382
+ --su: 0.627052 0.169912 149.213788;
383
+ --wa: 0.66584 0.157422 58.31834;
384
+ --er: 0.7307 0.207 27.33;
385
+ --rounded-btn: 1.9rem;
386
+ --tab-radius: 0.7rem
447
387
  }
448
- [data-theme=halloween] {
388
+ [data-theme=halloween], :root:has(input.theme-controller[value=halloween]:checked) {
449
389
  color-scheme: dark;
450
- --pf: 32 89% 45%;
451
- --sf: 271 46% 35%;
452
- --af: 91 100% 26%;
453
- --nf: 31 81% 3%;
454
- --b2: 0 0% 6%;
455
- --b3: 0 0% 0%;
456
- --bc: 145 0% 81%;
457
- --sc: 275 36% 88%;
458
- --nc: 26 11% 80%;
459
- --inc: 239 85% 93%;
460
- --suc: 126 38% 89%;
461
- --wac: 29 59% 11%;
462
- --erc: 11 100% 91%;
390
+ --b2: 0.230416 0 0;
391
+ --b3: 0.213072 0 0;
392
+ --bc: 0.849552 0 0;
393
+ --sc: 0.89196 0.0496 305.03;
394
+ --nc: 0.848742 0.009322 65.681484;
395
+ --inc: 0.90923 0.043042 262.880917;
396
+ --suc: 0.12541 0.033982 149.213788;
397
+ --wac: 0.133168 0.031484 58.31834;
398
+ --erc: 0.13144 0.0398 27.33;
463
399
  --rounded-box: 1rem;
464
400
  --rounded-btn: 0.5rem;
465
401
  --rounded-badge: 1.9rem;
466
402
  --animation-btn: 0.25s;
467
403
  --animation-input: .2s;
468
- --btn-text-case: uppercase;
469
404
  --btn-focus-scale: 0.95;
470
405
  --border-btn: 1px;
471
406
  --tab-border: 1px;
472
407
  --tab-radius: 0.5rem;
473
- --p: 32 89% 52%;
474
- --pc: 180 7% 8%;
475
- --s: 271 46% 42%;
476
- --a: 91 100% 33%;
477
- --ac: 0 0% 0%;
478
- --n: 31 81% 10%;
479
- --b1: 0 0% 13%;
480
- --in: 221 83% 53%;
481
- --su: 142 76% 36%;
482
- --wa: 32 95% 44%;
483
- --er: 0 72% 51%
408
+ --p: 0.7748 0.204 60.62;
409
+ --pc: 0.196935 0.004671 196.779412;
410
+ --s: 0.4598 0.248 305.03;
411
+ --a: 0.648 0.223 136.073479;
412
+ --ac: 0 0 0;
413
+ --n: 0.24371 0.046608 65.681484;
414
+ --b1: 0.247759 0 0;
415
+ --in: 0.54615 0.215208 262.880917;
416
+ --su: 0.627052 0.169912 149.213788;
417
+ --wa: 0.66584 0.157422 58.31834;
418
+ --er: 0.6572 0.199 27.33
484
419
  }
485
- [data-theme=garden] {
420
+ [data-theme=garden], :root:has(input.theme-controller[value=garden]:checked) {
486
421
  color-scheme: light;
487
- --pf: 331 100% 41%;
488
- --sf: 334 37% 34%;
489
- --af: 139 16% 36%;
490
- --nf: 44 100% 1%;
491
- --b2: 0 4% 84%;
492
- --b3: 0 4% 77%;
493
- --in: 198 93% 60%;
494
- --su: 158 64% 52%;
495
- --wa: 43 96% 56%;
496
- --er: 0 91% 71%;
497
- --pc: 346 100% 93%;
498
- --sc: 340 30% 88%;
499
- --ac: 136 12% 88%;
500
- --inc: 198 100% 12%;
501
- --suc: 158 100% 10%;
502
- --wac: 43 100% 11%;
503
- --erc: 0 100% 14%;
422
+ --b2: 0.864453 0.002011 17.197414;
423
+ --b3: 0.799386 0.00186 17.197414;
424
+ --in: 0.7206 0.191 231.6;
425
+ --su: 0.7441 0.213 164.75;
426
+ --wa: 0.8471 0.199 83.87;
427
+ --er: 0.7176 0.221 22.18;
428
+ --sc: 0.89699 0.022197 355.095988;
429
+ --ac: 0.112547 0.010859 154.390187;
430
+ --inc: 0 0 0;
431
+ --suc: 0 0 0;
432
+ --wac: 0 0 0;
433
+ --erc: 0 0 0;
504
434
  --rounded-box: 1rem;
505
435
  --rounded-btn: 0.5rem;
506
436
  --rounded-badge: 1.9rem;
507
437
  --animation-btn: 0.25s;
508
438
  --animation-input: .2s;
509
- --btn-text-case: uppercase;
510
439
  --btn-focus-scale: 0.95;
511
440
  --border-btn: 1px;
512
441
  --tab-border: 1px;
513
442
  --tab-radius: 0.5rem;
514
- --p: 331 100% 48%;
515
- --s: 334 37% 41%;
516
- --a: 139 16% 43%;
517
- --n: 44 100% 8%;
518
- --nc: 0 4% 91%;
519
- --b1: 0 4% 91%;
520
- --bc: 0 3% 6%
443
+ --p: 0.6245 0.278 3.83636;
444
+ --pc: 1 0 0;
445
+ --s: 0.484952 0.110985 355.095988;
446
+ --a: 0.562735 0.054297 154.390187;
447
+ --n: 0.241559 0.049362 89.070594;
448
+ --nc: 0.929519 0.002163 17.197414;
449
+ --b1: 0.929519 0.002163 17.197414;
450
+ --bc: 0.169617 0.001664 17.32068
521
451
  }
522
- [data-theme=forest] {
452
+ [data-theme=forest], :root:has(input.theme-controller[value=forest]:checked) {
523
453
  color-scheme: dark;
524
- --pf: 141 72% 35%;
525
- --sf: 164 73% 35%;
526
- --af: 175 73% 35%;
527
- --nf: 161 37% 8%;
528
- --b2: 0 12% 1%;
529
- --b3: 0 0% 0%;
530
- --in: 198 93% 60%;
531
- --su: 158 64% 52%;
532
- --wa: 43 96% 56%;
533
- --er: 0 91% 71%;
534
- --bc: 360 1% 79%;
535
- --sc: 158 32% 11%;
536
- --ac: 172 31% 11%;
537
- --nc: 157 7% 81%;
538
- --inc: 198 100% 12%;
539
- --suc: 158 100% 10%;
540
- --wac: 43 100% 11%;
541
- --erc: 0 100% 14%;
454
+ --b2: 0.17522 0.007709 17.911578;
455
+ --b3: 0.162032 0.007129 17.911578;
456
+ --in: 0.7206 0.191 231.6;
457
+ --su: 0.7441 0.213 164.75;
458
+ --wa: 0.8471 0.199 83.87;
459
+ --er: 0.7176 0.221 22.18;
460
+ --bc: 0.837682 0.001658 17.911578;
461
+ --sc: 0.139553 0.027077 168.327128;
462
+ --ac: 0.141257 0.02389 185.713193;
463
+ --nc: 0.861397 0.007806 171.364646;
464
+ --inc: 0 0 0;
465
+ --suc: 0 0 0;
466
+ --wac: 0 0 0;
467
+ --erc: 0 0 0;
542
468
  --rounded-box: 1rem;
543
469
  --rounded-badge: 1.9rem;
544
470
  --animation-btn: 0.25s;
545
471
  --animation-input: .2s;
546
- --btn-text-case: uppercase;
547
472
  --btn-focus-scale: 0.95;
548
473
  --border-btn: 1px;
549
474
  --tab-border: 1px;
550
475
  --tab-radius: 0.5rem;
551
- --p: 141 72% 42%;
552
- --pc: 0 0% 0%;
553
- --s: 164 73% 42%;
554
- --a: 175 73% 42%;
555
- --n: 161 37% 15%;
556
- --b1: 0 12% 8%;
476
+ --p: 0.686283 0.185567 148.958922;
477
+ --pc: 0 0 0;
478
+ --s: 0.697764 0.135385 168.327128;
479
+ --a: 0.706285 0.119451 185.713193;
480
+ --n: 0.306985 0.039032 171.364646;
481
+ --b1: 0.188409 0.00829 17.911578;
557
482
  --rounded-btn: 1.9rem
558
483
  }
559
- [data-theme=aqua] {
484
+ [data-theme=aqua], :root:has(input.theme-controller[value=aqua]:checked) {
560
485
  color-scheme: dark;
561
- --pf: 182 93% 42%;
562
- --sf: 274 31% 50%;
563
- --af: 47 100% 73%;
564
- --nf: 205 54% 43%;
565
- --b2: 219 53% 36%;
566
- --b3: 219 53% 29%;
567
- --bc: 228 38% 89%;
568
- --sc: 276 17% 12%;
569
- --ac: 46 19% 16%;
570
- --nc: 212 51% 91%;
571
- --inc: 239 85% 93%;
572
- --suc: 126 38% 89%;
573
- --wac: 29 59% 11%;
574
- --erc: 11 100% 91%;
486
+ --b2: 0.453464 0.118611 261.181672;
487
+ --b3: 0.419333 0.109683 261.181672;
488
+ --bc: 0.897519 0.025508 261.181672;
489
+ --sc: 0.121365 0.02175 309.782946;
490
+ --ac: 0.186854 0.020445 94.555431;
491
+ --nc: 0.122124 0.023402 243.760661;
492
+ --inc: 0.90923 0.043042 262.880917;
493
+ --suc: 0.12541 0.033982 149.213788;
494
+ --wac: 0.133168 0.031484 58.31834;
495
+ --erc: 0.1479 0.038 27.33;
575
496
  --rounded-box: 1rem;
576
497
  --rounded-btn: 0.5rem;
577
498
  --rounded-badge: 1.9rem;
578
499
  --animation-btn: 0.25s;
579
500
  --animation-input: .2s;
580
- --btn-text-case: uppercase;
581
501
  --btn-focus-scale: 0.95;
582
502
  --border-btn: 1px;
583
503
  --tab-border: 1px;
584
504
  --tab-radius: 0.5rem;
585
- --p: 182 93% 49%;
586
- --pc: 181 100% 17%;
587
- --s: 274 31% 57%;
588
- --a: 47 100% 80%;
589
- --n: 205 54% 50%;
590
- --b1: 219 53% 43%;
591
- --in: 221 83% 53%;
592
- --su: 142 76% 36%;
593
- --wa: 32 95% 44%;
594
- --er: 0 72% 51%
505
+ --p: 0.856617 0.14498 198.6458;
506
+ --pc: 0.401249 0.068266 197.603872;
507
+ --s: 0.606827 0.108752 309.782946;
508
+ --a: 0.934269 0.102225 94.555431;
509
+ --n: 0.610622 0.117009 243.760661;
510
+ --b1: 0.487596 0.127539 261.181672;
511
+ --in: 0.54615 0.215208 262.880917;
512
+ --su: 0.627052 0.169912 149.213788;
513
+ --wa: 0.66584 0.157422 58.31834;
514
+ --er: 0.7395 0.19 27.33
595
515
  }
596
- [data-theme=lofi] {
516
+ [data-theme=lofi], :root:has(input.theme-controller[value=lofi]:checked) {
597
517
  color-scheme: light;
598
- --pf: 0 0% 0%;
599
- --sf: 0 2% 3%;
600
- --af: 0 0% 8%;
601
- --nf: 0 0% 0%;
602
- --btn-text-case: uppercase;
518
+ --inc: 0.15908 0.0206 205.9;
519
+ --suc: 0.18026 0.0306 164.14;
520
+ --wac: 0.17674 0.027 79.94;
521
+ --erc: 0.15732 0.03 28.47;
603
522
  --border-btn: 1px;
604
523
  --tab-border: 1px;
605
- --p: 0 0% 5%;
606
- --pc: 0 0% 100%;
607
- --s: 0 2% 10%;
608
- --sc: 0 0% 100%;
609
- --a: 0 0% 15%;
610
- --ac: 0 0% 100%;
611
- --n: 0 0% 0%;
612
- --nc: 0 0% 100%;
613
- --b1: 0 0% 100%;
614
- --b2: 0 0% 95%;
615
- --b3: 0 2% 90%;
616
- --bc: 0 0% 0%;
617
- --in: 212 100% 48%;
618
- --inc: 0 0% 100%;
619
- --su: 137 72% 46%;
620
- --suc: 0 0% 0%;
621
- --wa: 5 100% 66%;
622
- --wac: 0 0% 100%;
623
- --er: 325 78% 49%;
624
- --erc: 0 0% 100%;
524
+ --p: 0.159066 0 0;
525
+ --pc: 1 0 0;
526
+ --s: 0.21455 0.001566 17.278957;
527
+ --sc: 1 0 0;
528
+ --a: 0.268618 0 0;
529
+ --ac: 1 0 0;
530
+ --n: 0 0 0;
531
+ --nc: 1 0 0;
532
+ --b1: 1 0 0;
533
+ --b2: 0.961151 0 0;
534
+ --b3: 0.92268 0.001082 17.17934;
535
+ --bc: 0 0 0;
536
+ --in: 0.7954 0.103 205.9;
537
+ --su: 0.9013 0.153 164.14;
538
+ --wa: 0.8837 0.135 79.94;
539
+ --er: 0.7866 0.15 28.47;
625
540
  --rounded-box: 0.25rem;
626
541
  --rounded-btn: 0.125rem;
627
542
  --rounded-badge: 0.125rem;
543
+ --tab-radius: 0.125rem;
628
544
  --animation-btn: 0;
629
545
  --animation-input: 0;
630
- --btn-focus-scale: 1;
631
- --tab-radius: 0
546
+ --btn-focus-scale: 1
632
547
  }
633
- [data-theme=pastel] {
548
+ [data-theme=pastel], :root:has(input.theme-controller[value=pastel]:checked) {
634
549
  color-scheme: light;
635
- --pf: 284 22% 73%;
636
- --sf: 352 70% 81%;
637
- --af: 158 55% 74%;
638
- --nf: 199 44% 54%;
639
- --in: 198 93% 60%;
640
- --su: 158 64% 52%;
641
- --wa: 43 96% 56%;
642
- --er: 0 91% 71%;
643
- --bc: 146 0% 19%;
644
- --pc: 284 4% 16%;
645
- --sc: 352 7% 17%;
646
- --ac: 158 10% 16%;
647
- --nc: 200 19% 13%;
648
- --inc: 198 100% 12%;
649
- --suc: 158 100% 10%;
650
- --wac: 43 100% 11%;
651
- --erc: 0 100% 14%;
550
+ --in: 0.7206 0.191 231.6;
551
+ --su: 0.7441 0.213 164.75;
552
+ --wa: 0.8471 0.199 83.87;
553
+ --er: 0.7176 0.221 22.18;
554
+ --bc: 0.2 0 0;
555
+ --pc: 0.166166 0.006979 316.8737;
556
+ --sc: 0.176153 0.009839 8.688364;
557
+ --ac: 0.178419 0.012056 170.923263;
558
+ --nc: 0.142681 0.014702 228.183906;
559
+ --inc: 0 0 0;
560
+ --suc: 0 0 0;
561
+ --wac: 0 0 0;
562
+ --erc: 0 0 0;
652
563
  --rounded-box: 1rem;
653
564
  --rounded-badge: 1.9rem;
654
565
  --animation-btn: 0.25s;
655
566
  --animation-input: .2s;
656
- --btn-text-case: uppercase;
657
567
  --btn-focus-scale: 0.95;
658
568
  --border-btn: 1px;
659
569
  --tab-border: 1px;
660
- --tab-radius: 0.5rem;
661
- --p: 284 22% 80%;
662
- --s: 352 70% 88%;
663
- --a: 158 55% 81%;
664
- --n: 199 44% 61%;
665
- --b1: 0 0% 100%;
666
- --b2: 210 20% 98%;
667
- --b3: 216 12% 84%;
668
- --rounded-btn: 1.9rem
570
+ --p: 0.830828 0.034896 316.8737;
571
+ --s: 0.880763 0.049197 8.688364;
572
+ --a: 0.892096 0.06028 170.923263;
573
+ --n: 0.713406 0.07351 228.183906;
574
+ --b1: 1 0 0;
575
+ --b2: 0.984625 0.001706 247.838921;
576
+ --b3: 0.871681 0.009339 258.338227;
577
+ --rounded-btn: 1.9rem;
578
+ --tab-radius: 0.7rem
669
579
  }
670
- [data-theme=fantasy] {
580
+ [data-theme=fantasy], :root:has(input.theme-controller[value=fantasy]:checked) {
671
581
  color-scheme: light;
672
- --pf: 296 83% 18%;
673
- --sf: 200 100% 30%;
674
- --af: 31 94% 44%;
675
- --nf: 215 28% 10%;
676
- --b2: 0 0% 93%;
677
- --b3: 0 0% 86%;
678
- --in: 198 93% 60%;
679
- --su: 158 64% 52%;
680
- --wa: 43 96% 56%;
681
- --er: 0 91% 71%;
682
- --pc: 302 27% 85%;
683
- --sc: 212 51% 90%;
684
- --ac: 28 57% 12%;
685
- --nc: 218 6% 82%;
686
- --inc: 198 100% 12%;
687
- --suc: 158 100% 10%;
688
- --wac: 43 100% 11%;
689
- --erc: 0 100% 14%;
582
+ --b2: 0.93 0 0;
583
+ --b3: 0.86 0 0;
584
+ --in: 0.7206 0.191 231.6;
585
+ --su: 0.7441 0.213 164.75;
586
+ --wa: 0.8471 0.199 83.87;
587
+ --er: 0.7176 0.221 22.18;
588
+ --pc: 0.8749 0.0378 325.02;
589
+ --sc: 0.90784 0.0324 241.36;
590
+ --ac: 0.15196 0.0408 56.72;
591
+ --nc: 0.855616 0.005919 256.847952;
592
+ --inc: 0 0 0;
593
+ --suc: 0 0 0;
594
+ --wac: 0 0 0;
595
+ --erc: 0 0 0;
690
596
  --rounded-box: 1rem;
691
597
  --rounded-btn: 0.5rem;
692
598
  --rounded-badge: 1.9rem;
693
599
  --animation-btn: 0.25s;
694
600
  --animation-input: .2s;
695
- --btn-text-case: uppercase;
696
601
  --btn-focus-scale: 0.95;
697
602
  --border-btn: 1px;
698
603
  --tab-border: 1px;
699
604
  --tab-radius: 0.5rem;
700
- --p: 296 83% 25%;
701
- --s: 200 100% 37%;
702
- --a: 31 94% 51%;
703
- --n: 215 28% 17%;
704
- --b1: 0 0% 100%;
705
- --bc: 215 28% 17%
605
+ --p: 0.3745 0.189 325.02;
606
+ --s: 0.5392 0.162 241.36;
607
+ --a: 0.7598 0.204 56.72;
608
+ --n: 0.278078 0.029596 256.847952;
609
+ --b1: 1 0 0;
610
+ --bc: 0.278078 0.029596 256.847952
706
611
  }
707
- [data-theme=wireframe] {
612
+ [data-theme=wireframe], :root:has(input.theme-controller[value=wireframe]:checked) {
708
613
  color-scheme: light;
709
- --pf: 0 0% 65%;
710
- --sf: 0 0% 65%;
711
- --af: 0 0% 65%;
712
- --nf: 0 0% 85%;
713
- --bc: 146 0% 19%;
714
- --pc: 145 0% 15%;
715
- --sc: 145 0% 15%;
716
- --ac: 145 0% 15%;
717
- --nc: 145 0% 18%;
718
- --inc: 263 100% 91%;
719
- --suc: 105 32% 85%;
720
- --wac: 58 21% 11%;
721
- --erc: 17 100% 90%;
614
+ --bc: 0.2 0 0;
615
+ --pc: 0.156521 0 0;
616
+ --sc: 0.156521 0 0;
617
+ --ac: 0.156521 0 0;
618
+ --nc: 0.188014 0 0;
619
+ --inc: 0.890403 0.062643 264.052021;
620
+ --suc: 0.90395 0.035372 142.495339;
621
+ --wac: 0.141626 0.019994 108.702381;
622
+ --erc: 0.125591 0.051537 29.233885;
722
623
  --animation-btn: 0.25s;
723
624
  --animation-input: .2s;
724
- --btn-text-case: uppercase;
725
625
  --btn-focus-scale: 0.95;
726
626
  --border-btn: 1px;
727
627
  --tab-border: 1px;
728
- font-family: Chalkboard,comic sans ms,"sanssecondaryerif";
729
- --p: 0 0% 72%;
730
- --s: 0 0% 72%;
731
- --a: 0 0% 72%;
732
- --n: 0 0% 92%;
733
- --b1: 0 0% 100%;
734
- --b2: 0 0% 93%;
735
- --b3: 0 0% 87%;
736
- --in: 240 100% 50%;
737
- --su: 120 100% 25%;
738
- --wa: 60 30% 50%;
739
- --er: 0 100% 50%;
628
+ font-family: Chalkboard,comic sans ms,'sans-serif';
629
+ --p: 0.782604 0 0;
630
+ --s: 0.782604 0 0;
631
+ --a: 0.782604 0 0;
632
+ --n: 0.94007 0 0;
633
+ --b1: 1 0 0;
634
+ --b2: 0.949119 0 0;
635
+ --b3: 0.897547 0 0;
636
+ --in: 0.452014 0.313214 264.052021;
637
+ --su: 0.519752 0.176858 142.495339;
638
+ --wa: 0.708131 0.099969 108.702381;
639
+ --er: 0.627955 0.257683 29.233885;
740
640
  --rounded-box: 0.2rem;
741
641
  --rounded-btn: 0.2rem;
742
642
  --rounded-badge: 0.2rem;
743
643
  --tab-radius: 0.2rem
744
644
  }
745
- [data-theme=black] {
645
+ [data-theme=black], :root:has(input.theme-controller[value=black]:checked) {
746
646
  color-scheme: dark;
747
- --pf: 0 2% 13%;
748
- --sf: 0 2% 13%;
749
- --af: 0 2% 13%;
750
- --bc: 145 0% 78%;
751
- --pc: 0 1% 82%;
752
- --sc: 0 1% 82%;
753
- --ac: 0 1% 82%;
754
- --nc: 0 0% 81%;
755
- --inc: 263 100% 91%;
756
- --suc: 105 32% 85%;
757
- --wac: 58 45% 13%;
758
- --erc: 17 100% 90%;
647
+ --pc: 0.86736 0 0;
648
+ --sc: 0.86736 0 0;
649
+ --ac: 0.86736 0 0;
650
+ --nc: 0.86736 0 0;
651
+ --inc: 0.890403 0.062643 264.052021;
652
+ --suc: 0.90395 0.035372 142.495339;
653
+ --wac: 0.193597 0.042201 109.769232;
654
+ --erc: 0.125591 0.051537 29.233885;
759
655
  --border-btn: 1px;
760
656
  --tab-border: 1px;
761
- --p: 0 2% 20%;
762
- --s: 0 2% 20%;
763
- --a: 0 2% 20%;
764
- --b1: 0 0% 0%;
765
- --b2: 0 0% 5%;
766
- --b3: 0 2% 10%;
767
- --n: 0 1% 15%;
768
- --nf: 0 2% 20%;
769
- --in: 240 100% 50%;
770
- --su: 120 100% 25%;
771
- --wa: 60 100% 50%;
772
- --er: 0 100% 50%;
657
+ --p: 0.336799 0 0;
658
+ --s: 0.336799 0 0;
659
+ --a: 0.336799 0 0;
660
+ --b1: 0 0 0;
661
+ --b2: 0.191251 0 0;
662
+ --b3: 0.268618 0 0;
663
+ --bc: 0.876096 0 0;
664
+ --n: 0.336799 0 0;
665
+ --in: 0.452014 0.313214 264.052021;
666
+ --su: 0.519752 0.176858 142.495339;
667
+ --wa: 0.967983 0.211006 109.769232;
668
+ --er: 0.627955 0.257683 29.233885;
773
669
  --rounded-box: 0;
774
670
  --rounded-btn: 0;
775
671
  --rounded-badge: 0;
776
672
  --animation-btn: 0;
777
673
  --animation-input: 0;
778
- --btn-text-case: lowercase;
779
674
  --btn-focus-scale: 1;
780
675
  --tab-radius: 0
781
676
  }
782
- [data-theme=luxury] {
677
+ [data-theme=luxury], :root:has(input.theme-controller[value=luxury]:checked) {
783
678
  color-scheme: dark;
784
- --pf: 0 0% 93%;
785
- --sf: 218 54% 11%;
786
- --af: 319 22% 19%;
787
- --nf: 28 100% 3%;
788
- --pc: 146 0% 19%;
789
- --sc: 227 12% 82%;
790
- --ac: 322 9% 84%;
791
- --inc: 205 27% 15%;
792
- --suc: 88 35% 12%;
793
- --wac: 52 28% 14%;
794
- --erc: 3 31% 15%;
679
+ --pc: 0.2 0 0;
680
+ --sc: 0.855163 0.012821 261.069149;
681
+ --ac: 0.873349 0.010348 338.82597;
682
+ --inc: 0.158122 0.024356 237.133883;
683
+ --suc: 0.156239 0.038579 132.154381;
684
+ --wac: 0.172255 0.027305 102.89115;
685
+ --erc: 0.143506 0.035271 22.568916;
795
686
  --rounded-box: 1rem;
796
687
  --rounded-btn: 0.5rem;
797
688
  --rounded-badge: 1.9rem;
798
689
  --animation-btn: 0.25s;
799
690
  --animation-input: .2s;
800
- --btn-text-case: uppercase;
801
691
  --btn-focus-scale: 0.95;
802
692
  --border-btn: 1px;
803
693
  --tab-border: 1px;
804
694
  --tab-radius: 0.5rem;
805
- --p: 0 0% 100%;
806
- --s: 218 54% 18%;
807
- --a: 319 22% 26%;
808
- --n: 28 100% 10%;
809
- --nc: 44 100% 82%;
810
- --b1: 240 10% 4%;
811
- --b2: 270 4% 9%;
812
- --b3: 270 2% 18%;
813
- --bc: 37 67% 58%;
814
- --in: 202 100% 70%;
815
- --su: 89 62% 52%;
816
- --wa: 54 69% 64%;
817
- --er: 0 100% 72%
695
+ --p: 1 0 0;
696
+ --s: 0.275815 0.064106 261.069149;
697
+ --a: 0.366744 0.051741 338.82597;
698
+ --n: 0.2427 0.057015 59.825019;
699
+ --nc: 0.932033 0.089631 90.861683;
700
+ --b1: 0.140765 0.004386 285.822869;
701
+ --b2: 0.202191 0.004211 308.22937;
702
+ --b3: 0.298961 0.003818 308.318612;
703
+ --bc: 0.756879 0.123666 76.890484;
704
+ --in: 0.790612 0.121778 237.133883;
705
+ --su: 0.781197 0.192894 132.154381;
706
+ --wa: 0.861274 0.136524 102.89115;
707
+ --er: 0.717531 0.176357 22.568916
818
708
  }
819
- [data-theme=dracula] {
709
+ [data-theme=dracula], :root:has(input.theme-controller[value=dracula]:checked) {
820
710
  color-scheme: dark;
821
- --pf: 326 100% 67%;
822
- --sf: 265 89% 71%;
823
- --af: 31 100% 64%;
824
- --nf: 230 15% 23%;
825
- --b2: 231 15% 11%;
826
- --b3: 231 15% 4%;
827
- --pc: 328 26% 15%;
828
- --sc: 266 19% 16%;
829
- --ac: 30 30% 15%;
830
- --nc: 232 7% 85%;
831
- --inc: 191 20% 16%;
832
- --suc: 128 30% 14%;
833
- --wac: 64 20% 15%;
834
- --erc: 5 39% 14%;
711
+ --b2: 0.268053 0.020556 277.508664;
712
+ --b3: 0.247877 0.019009 277.508664;
713
+ --pc: 0.150922 0.036614 346.812432;
714
+ --sc: 0.148405 0.029709 301.883095;
715
+ --ac: 0.166785 0.024826 66.558491;
716
+ --nc: 0.878891 0.006515 275.524078;
717
+ --inc: 0.176526 0.018676 212.846491;
718
+ --suc: 0.174199 0.043903 148.024881;
719
+ --wac: 0.191068 0.026849 112.757109;
720
+ --erc: 0.136441 0.041266 24.430965;
835
721
  --rounded-box: 1rem;
836
722
  --rounded-btn: 0.5rem;
837
723
  --rounded-badge: 1.9rem;
838
724
  --animation-btn: 0.25s;
839
725
  --animation-input: .2s;
840
- --btn-text-case: uppercase;
841
726
  --btn-focus-scale: 0.95;
842
727
  --border-btn: 1px;
843
728
  --tab-border: 1px;
844
729
  --tab-radius: 0.5rem;
845
- --p: 326 100% 74%;
846
- --s: 265 89% 78%;
847
- --a: 31 100% 71%;
848
- --n: 230 15% 30%;
849
- --b1: 231 15% 18%;
850
- --bc: 60 30% 96%;
851
- --in: 191 97% 77%;
852
- --su: 135 94% 65%;
853
- --wa: 65 92% 76%;
854
- --er: 0 100% 67%
730
+ --p: 0.754611 0.18307 346.812432;
731
+ --s: 0.742023 0.148546 301.883095;
732
+ --a: 0.833927 0.124132 66.558491;
733
+ --n: 0.394456 0.032576 275.524078;
734
+ --b1: 0.288229 0.022103 277.508664;
735
+ --bc: 0.977477 0.007913 106.545019;
736
+ --in: 0.88263 0.09338 212.846491;
737
+ --su: 0.870995 0.219516 148.024881;
738
+ --wa: 0.955338 0.134246 112.757109;
739
+ --er: 0.682204 0.206328 24.430965
855
740
  }
856
- [data-theme=cmyk] {
741
+ [data-theme=cmyk], :root:has(input.theme-controller[value=cmyk]:checked) {
857
742
  color-scheme: light;
858
- --pf: 203 83% 53%;
859
- --sf: 335 78% 53%;
860
- --af: 56 100% 53%;
861
- --nf: 0 0% 3%;
862
- --b2: 0 0% 93%;
863
- --b3: 0 0% 86%;
864
- --bc: 146 0% 19%;
865
- --pc: 207 32% 14%;
866
- --sc: 344 100% 93%;
867
- --ac: 54 41% 14%;
868
- --nc: 145 0% 80%;
869
- --inc: 194 26% 12%;
870
- --suc: 295 30% 87%;
871
- --wac: 24 46% 13%;
872
- --erc: 12 100% 91%;
743
+ --b2: 0.93 0 0;
744
+ --b3: 0.86 0 0;
745
+ --bc: 0.2 0 0;
746
+ --pc: 0.143544 0.02666 239.443325;
747
+ --sc: 0.128953 0.040552 359.339283;
748
+ --ac: 0.188458 0.037948 105.306968;
749
+ --nc: 0.843557 0 0;
750
+ --inc: 0.136952 0.0189 217.284104;
751
+ --suc: 0.893898 0.032505 321.406278;
752
+ --wac: 0.142473 0.031969 52.023412;
753
+ --erc: 0.124027 0.041677 28.717543;
873
754
  --rounded-box: 1rem;
874
755
  --rounded-btn: 0.5rem;
875
756
  --rounded-badge: 1.9rem;
876
757
  --animation-btn: 0.25s;
877
758
  --animation-input: .2s;
878
- --btn-text-case: uppercase;
879
759
  --btn-focus-scale: 0.95;
880
760
  --border-btn: 1px;
881
761
  --tab-border: 1px;
882
762
  --tab-radius: 0.5rem;
883
- --p: 203 83% 60%;
884
- --s: 335 78% 60%;
885
- --a: 56 100% 60%;
886
- --n: 0 0% 10%;
887
- --b1: 0 0% 100%;
888
- --in: 192 48% 52%;
889
- --su: 291 48% 38%;
890
- --wa: 25 85% 57%;
891
- --er: 4 81% 56%
763
+ --p: 0.717722 0.133298 239.443325;
764
+ --s: 0.644766 0.202758 359.339283;
765
+ --a: 0.942289 0.189741 105.306968;
766
+ --n: 0.217787 0 0;
767
+ --b1: 1 0 0;
768
+ --in: 0.684759 0.094499 217.284104;
769
+ --su: 0.46949 0.162524 321.406278;
770
+ --wa: 0.712364 0.159843 52.023412;
771
+ --er: 0.620133 0.208385 28.717543
892
772
  }
893
- [data-theme=autumn] {
773
+ [data-theme=autumn], :root:has(input.theme-controller[value=autumn]:checked) {
894
774
  color-scheme: light;
895
- --pf: 344 96% 21%;
896
- --sf: 0 63% 51%;
897
- --af: 27 56% 56%;
898
- --nf: 22 17% 37%;
899
- --b2: 0 0% 88%;
900
- --b3: 0 0% 81%;
901
- --bc: 145 0% 18%;
902
- --pc: 2 46% 87%;
903
- --sc: 6 87% 92%;
904
- --ac: 27 25% 13%;
905
- --nc: 21 15% 88%;
906
- --inc: 188 26% 12%;
907
- --suc: 161 25% 89%;
908
- --wac: 28 55% 12%;
909
- --erc: 8 100% 91%;
775
+ --b2: 0.891077 0 0;
776
+ --b3: 0.824006 0 0;
777
+ --bc: 0.191629 0 0;
778
+ --pc: 0.881446 0.032232 17.530175;
779
+ --sc: 0.123353 0.033821 23.865865;
780
+ --ac: 0.146851 0.018999 60.729616;
781
+ --nc: 0.908734 0.007475 51.902819;
782
+ --inc: 0.138449 0.019596 207.284192;
783
+ --suc: 0.12199 0.016032 174.616213;
784
+ --wac: 0.140163 0.032982 56.844303;
785
+ --erc: 0.90614 0.0482 24.16;
910
786
  --rounded-box: 1rem;
911
787
  --rounded-btn: 0.5rem;
912
788
  --rounded-badge: 1.9rem;
913
789
  --animation-btn: 0.25s;
914
790
  --animation-input: .2s;
915
- --btn-text-case: uppercase;
916
791
  --btn-focus-scale: 0.95;
917
792
  --border-btn: 1px;
918
793
  --tab-border: 1px;
919
794
  --tab-radius: 0.5rem;
920
- --p: 344 96% 28%;
921
- --s: 0 63% 58%;
922
- --a: 27 56% 63%;
923
- --n: 22 17% 44%;
924
- --b1: 0 0% 95%;
925
- --in: 187 48% 50%;
926
- --su: 165 34% 43%;
927
- --wa: 30 84% 50%;
928
- --er: 354 79% 49%
795
+ --p: 0.407232 0.16116 17.530175;
796
+ --s: 0.616763 0.169105 23.865865;
797
+ --a: 0.734253 0.094994 60.729616;
798
+ --n: 0.543672 0.037374 51.902819;
799
+ --b1: 0.958147 0 0;
800
+ --in: 0.692245 0.097979 207.284192;
801
+ --su: 0.609951 0.080159 174.616213;
802
+ --wa: 0.700817 0.164909 56.844303;
803
+ --er: 0.5307 0.241 24.16
929
804
  }
930
- [data-theme=business] {
805
+ [data-theme=business], :root:has(input.theme-controller[value=business]:checked) {
931
806
  color-scheme: dark;
932
- --pf: 210 64% 24%;
933
- --sf: 200 13% 48%;
934
- --af: 13 80% 53%;
935
- --nf: 213 14% 9%;
936
- --b2: 0 0% 6%;
937
- --b3: 0 0% 0%;
938
- --bc: 145 0% 80%;
939
- --pc: 219 26% 86%;
940
- --sc: 200 7% 12%;
941
- --ac: 14 40% 13%;
942
- --nc: 214 3% 81%;
943
- --inc: 210 64% 91%;
944
- --suc: 141 16% 12%;
945
- --wac: 37 30% 13%;
946
- --erc: 11 59% 89%;
807
+ --b2: 0.226487 0 0;
808
+ --b3: 0.20944 0 0;
809
+ --bc: 0.848707 0 0;
810
+ --pc: 0.883407 0.019811 251.473931;
811
+ --sc: 0.128185 0.005481 229.389418;
812
+ --ac: 0.134542 0.033545 35.791525;
813
+ --nc: 0.854882 0.00265 253.041249;
814
+ --inc: 0.125233 0.028702 240.033697;
815
+ --suc: 0.140454 0.018919 156.59611;
816
+ --wac: 0.154965 0.023141 81.519177;
817
+ --erc: 0.903221 0.029356 29.674507;
947
818
  --animation-btn: 0.25s;
948
819
  --animation-input: .2s;
949
- --btn-text-case: uppercase;
950
820
  --btn-focus-scale: 0.95;
951
821
  --border-btn: 1px;
952
822
  --tab-border: 1px;
953
823
  --tab-radius: 0.5rem;
954
- --p: 210 64% 31%;
955
- --s: 200 13% 55%;
956
- --a: 13 80% 60%;
957
- --n: 213 14% 16%;
958
- --b1: 0 0% 13%;
959
- --in: 199 100% 42%;
960
- --su: 144 31% 56%;
961
- --wa: 39 64% 60%;
962
- --er: 6 56% 43%;
824
+ --p: 0.417036 0.099057 251.473931;
825
+ --s: 0.640924 0.027405 229.389418;
826
+ --a: 0.67271 0.167726 35.791525;
827
+ --n: 0.27441 0.01325 253.041249;
828
+ --b1: 0.243535 0 0;
829
+ --in: 0.626163 0.143511 240.033697;
830
+ --su: 0.702268 0.094594 156.59611;
831
+ --wa: 0.774824 0.115704 81.519177;
832
+ --er: 0.516105 0.14678 29.674507;
963
833
  --rounded-box: 0.25rem;
964
834
  --rounded-btn: .125rem;
965
835
  --rounded-badge: .125rem
966
836
  }
967
- [data-theme=acid] {
837
+ [data-theme=acid], :root:has(input.theme-controller[value=acid]:checked) {
968
838
  color-scheme: light;
969
- --pf: 303 100% 43%;
970
- --sf: 27 100% 43%;
971
- --af: 72 98% 43%;
972
- --nf: 238 43% 10%;
973
- --b2: 0 0% 91%;
974
- --b3: 0 0% 84%;
975
- --bc: 145 0% 19%;
976
- --pc: 302 100% 93%;
977
- --sc: 25 62% 12%;
978
- --ac: 73 44% 13%;
979
- --nc: 248 11% 82%;
980
- --inc: 217 36% 14%;
981
- --suc: 145 23% 13%;
982
- --wac: 50 42% 13%;
983
- --erc: 15 100% 90%;
839
+ --b2: 0.916146 0 0;
840
+ --b3: 0.847189 0 0;
841
+ --bc: 0.197021 0 0;
842
+ --pc: 0.1438 0.0714 330.759573;
843
+ --sc: 0.14674 0.0448 48.250878;
844
+ --ac: 0.18556 0.0528 122.962951;
845
+ --nc: 0.84262 0.0256 278.68;
846
+ --inc: 0.12144 0.0454 252.05;
847
+ --suc: 0.17144 0.0532 158.53;
848
+ --wac: 0.18202 0.0424 100.5;
849
+ --erc: 0.12968 0.0586 29.349188;
984
850
  --animation-btn: 0.25s;
985
851
  --animation-input: .2s;
986
- --btn-text-case: uppercase;
987
852
  --btn-focus-scale: 0.95;
988
853
  --border-btn: 1px;
989
854
  --tab-border: 1px;
990
- --tab-radius: 0.5rem;
991
- --p: 303 100% 50%;
992
- --s: 27 100% 50%;
993
- --a: 72 98% 50%;
994
- --n: 238 43% 17%;
995
- --b1: 0 0% 98%;
996
- --in: 210 92% 58%;
997
- --su: 149 50% 58%;
998
- --wa: 53 93% 57%;
999
- --er: 1 100% 45%;
855
+ --p: 0.719 0.357 330.759573;
856
+ --s: 0.7337 0.224 48.250878;
857
+ --a: 0.9278 0.264 122.962951;
858
+ --n: 0.2131 0.128 278.68;
859
+ --b1: 0.985104 0 0;
860
+ --in: 0.6072 0.227 252.05;
861
+ --su: 0.8572 0.266 158.53;
862
+ --wa: 0.9101 0.212 100.5;
863
+ --er: 0.6484 0.293 29.349188;
1000
864
  --rounded-box: 1.25rem;
1001
865
  --rounded-btn: 1rem;
1002
- --rounded-badge: 1rem
866
+ --rounded-badge: 1rem;
867
+ --tab-radius: 0.7rem
1003
868
  }
1004
- [data-theme=lemonade] {
869
+ [data-theme=lemonade], :root:has(input.theme-controller[value=lemonade]:checked) {
1005
870
  color-scheme: light;
1006
- --pf: 89 96% 24%;
1007
- --sf: 60 81% 48%;
1008
- --af: 63 80% 81%;
1009
- --nf: 238 43% 10%;
1010
- --b2: 0 0% 93%;
1011
- --b3: 0 0% 86%;
1012
- --bc: 146 0% 19%;
1013
- --pc: 89 39% 87%;
1014
- --sc: 58 39% 13%;
1015
- --ac: 62 8% 17%;
1016
- --nc: 248 11% 82%;
1017
- --inc: 192 5% 17%;
1018
- --suc: 74 15% 16%;
1019
- --wac: 49 21% 15%;
1020
- --erc: 2 11% 16%;
871
+ --b2: 0.918003 0.0186 123.72;
872
+ --b3: 0.848906 0.0172 123.72;
873
+ --bc: 0.19742 0.004 123.72;
874
+ --pc: 0.11784 0.0398 134.6;
875
+ --sc: 0.1555 0.0392 111.09;
876
+ --ac: 0.17078 0.0402 100.73;
877
+ --nc: 0.86196 0.015 108.6;
878
+ --inc: 0.17238 0.0094 224.14;
879
+ --suc: 0.17238 0.0094 157.85;
880
+ --wac: 0.17238 0.0094 102.15;
881
+ --erc: 0.17238 0.0094 25.85;
1021
882
  --rounded-box: 1rem;
1022
883
  --rounded-btn: 0.5rem;
1023
884
  --rounded-badge: 1.9rem;
1024
885
  --animation-btn: 0.25s;
1025
886
  --animation-input: .2s;
1026
- --btn-text-case: uppercase;
1027
887
  --btn-focus-scale: 0.95;
1028
888
  --border-btn: 1px;
1029
889
  --tab-border: 1px;
1030
890
  --tab-radius: 0.5rem;
1031
- --p: 89 96% 31%;
1032
- --s: 60 81% 55%;
1033
- --a: 63 80% 88%;
1034
- --n: 238 43% 17%;
1035
- --b1: 0 0% 100%;
1036
- --in: 192 39% 85%;
1037
- --su: 74 76% 79%;
1038
- --wa: 50 87% 75%;
1039
- --er: 1 70% 83%
891
+ --p: 0.5892 0.199 134.6;
892
+ --s: 0.7775 0.196 111.09;
893
+ --a: 0.8539 0.201 100.73;
894
+ --n: 0.3098 0.075 108.6;
895
+ --b1: 0.9871 0.02 123.72;
896
+ --in: 0.8619 0.047 224.14;
897
+ --su: 0.8619 0.047 157.85;
898
+ --wa: 0.8619 0.047 102.15;
899
+ --er: 0.8619 0.047 25.85
1040
900
  }
1041
- [data-theme=night] {
901
+ [data-theme=night], :root:has(input.theme-controller[value=night]:checked) {
1042
902
  color-scheme: dark;
1043
- --pf: 198 93% 53%;
1044
- --sf: 234 89% 67%;
1045
- --af: 329 86% 63%;
1046
- --b2: 222 47% 4%;
1047
- --b3: 0 0% 0%;
1048
- --bc: 229 7% 80%;
1049
- --pc: 202 34% 14%;
1050
- --sc: 239 22% 15%;
1051
- --ac: 332 26% 15%;
1052
- --nc: 221 7% 82%;
1053
- --suc: 169 31% 13%;
1054
- --wac: 39 36% 14%;
1055
- --erc: 354 28% 15%;
903
+ --b2: 0.193144 0.037037 265.754874;
904
+ --b3: 0.178606 0.034249 265.754874;
905
+ --bc: 0.841536 0.007965 265.754874;
906
+ --pc: 0.150703 0.027798 232.66148;
907
+ --sc: 0.136023 0.031661 276.934902;
908
+ --ac: 0.144721 0.035244 350.048739;
909
+ --nc: 0.855899 0.00737 260.030984;
910
+ --suc: 0.156904 0.026506 181.911977;
911
+ --wac: 0.166486 0.027912 82.95003;
912
+ --erc: 0.143572 0.034051 13.11834;
1056
913
  --rounded-box: 1rem;
1057
914
  --rounded-btn: 0.5rem;
1058
915
  --rounded-badge: 1.9rem;
1059
916
  --animation-btn: 0.25s;
1060
917
  --animation-input: .2s;
1061
- --btn-text-case: uppercase;
1062
918
  --btn-focus-scale: 0.95;
1063
919
  --border-btn: 1px;
1064
920
  --tab-border: 1px;
1065
921
  --tab-radius: 0.5rem;
1066
- --p: 198 93% 60%;
1067
- --s: 234 89% 74%;
1068
- --a: 329 86% 70%;
1069
- --n: 217 33% 17%;
1070
- --nf: 217 30% 22%;
1071
- --b1: 222 47% 11%;
1072
- --in: 198 90% 48%;
1073
- --inc: 0 0% 0%;
1074
- --su: 172 66% 50%;
1075
- --wa: 41 88% 64%;
1076
- --er: 351 95% 71%
922
+ --p: 0.753513 0.138989 232.66148;
923
+ --s: 0.680113 0.158303 276.934902;
924
+ --a: 0.723603 0.176218 350.048739;
925
+ --n: 0.279495 0.036848 260.030984;
926
+ --b1: 0.207682 0.039824 265.754874;
927
+ --in: 0.684553 0.148062 237.25135;
928
+ --inc: 0 0 0;
929
+ --su: 0.78452 0.132529 181.911977;
930
+ --wa: 0.832428 0.139558 82.95003;
931
+ --er: 0.717858 0.170255 13.11834
1077
932
  }
1078
- [data-theme=coffee] {
933
+ [data-theme=coffee], :root:has(input.theme-controller[value=coffee]:checked) {
1079
934
  color-scheme: dark;
1080
- --pf: 30 67% 51%;
1081
- --sf: 182 25% 13%;
1082
- --af: 194 74% 18%;
1083
- --nf: 0 0% 0%;
1084
- --b2: 306 19% 4%;
1085
- --b3: 0 0% 0%;
1086
- --pc: 28 35% 13%;
1087
- --sc: 182 6% 83%;
1088
- --ac: 199 20% 85%;
1089
- --nc: 300 1% 79%;
1090
- --inc: 170 12% 14%;
1091
- --suc: 92 11% 13%;
1092
- --wac: 41 33% 14%;
1093
- --erc: 11 25% 15%;
935
+ --b2: 0.201585 0.021457 329.708637;
936
+ --b3: 0.186412 0.019842 329.708637;
937
+ --pc: 0.143993 0.024765 62.756393;
938
+ --sc: 0.86893 0.00597 199.19444;
939
+ --ac: 0.885243 0.014881 224.389184;
940
+ --nc: 0.833022 0.003149 326.261446;
941
+ --inc: 0.15898 0.012774 184.558367;
942
+ --suc: 0.149445 0.014491 131.116276;
943
+ --wac: 0.176301 0.028162 87.722413;
944
+ --erc: 0.154637 0.025644 31.871922;
1094
945
  --rounded-box: 1rem;
1095
946
  --rounded-btn: 0.5rem;
1096
947
  --rounded-badge: 1.9rem;
1097
948
  --animation-btn: 0.25s;
1098
949
  --animation-input: .2s;
1099
- --btn-text-case: uppercase;
1100
950
  --btn-focus-scale: 0.95;
1101
951
  --border-btn: 1px;
1102
952
  --tab-border: 1px;
1103
953
  --tab-radius: 0.5rem;
1104
- --p: 30 67% 58%;
1105
- --s: 182 25% 20%;
1106
- --a: 194 74% 25%;
1107
- --n: 300 20% 6%;
1108
- --b1: 306 19% 11%;
1109
- --bc: 37 8% 42%;
1110
- --in: 171 37% 67%;
1111
- --su: 93 25% 62%;
1112
- --wa: 43 100% 69%;
1113
- --er: 10 95% 75%
954
+ --p: 0.719967 0.123825 62.756393;
955
+ --s: 0.34465 0.029849 199.19444;
956
+ --a: 0.426213 0.074405 224.389184;
957
+ --n: 0.165109 0.015743 326.261446;
958
+ --b1: 0.216758 0.023072 329.708637;
959
+ --bc: 0.723547 0.092794 79.129387;
960
+ --in: 0.794902 0.063869 184.558367;
961
+ --su: 0.747224 0.072456 131.116276;
962
+ --wa: 0.881503 0.140812 87.722413;
963
+ --er: 0.773187 0.12822 31.871922
1114
964
  }
1115
- [data-theme=winter] {
965
+ [data-theme=winter], :root:has(input.theme-controller[value=winter]:checked) {
1116
966
  color-scheme: light;
1117
- --pf: 212 100% 44%;
1118
- --sf: 247 47% 36%;
1119
- --af: 310 49% 45%;
1120
- --nf: 217 92% 3%;
1121
- --pc: 231 100% 93%;
1122
- --sc: 256 40% 88%;
1123
- --ac: 316 56% 91%;
1124
- --nc: 229 10% 80%;
1125
- --inc: 192 18% 16%;
1126
- --suc: 181 16% 14%;
1127
- --wac: 32 9% 16%;
1128
- --erc: 2 19% 15%;
967
+ --pc: 0.91372 0.051 257.57;
968
+ --sc: 0.885103 0.03222 282.339433;
969
+ --ac: 0.11988 0.038303 335.171434;
970
+ --nc: 0.839233 0.012704 257.651965;
971
+ --inc: 0.176255 0.017178 214.515264;
972
+ --suc: 0.160988 0.015404 197.823719;
973
+ --wac: 0.178345 0.009167 71.47031;
974
+ --erc: 0.146185 0.022037 20.076293;
975
+ --rounded-box: 1rem;
976
+ --rounded-btn: 0.5rem;
977
+ --rounded-badge: 1.9rem;
978
+ --animation-btn: 0.25s;
979
+ --animation-input: .2s;
980
+ --btn-focus-scale: 0.95;
981
+ --border-btn: 1px;
982
+ --tab-border: 1px;
983
+ --tab-radius: 0.5rem;
984
+ --p: 0.5686 0.255 257.57;
985
+ --s: 0.425516 0.161098 282.339433;
986
+ --a: 0.599398 0.191515 335.171434;
987
+ --n: 0.196166 0.063518 257.651965;
988
+ --b1: 1 0 0;
989
+ --b2: 0.974663 0.011947 259.822565;
990
+ --b3: 0.932686 0.016223 262.751375;
991
+ --bc: 0.418869 0.053885 255.824911;
992
+ --in: 0.881275 0.085888 214.515264;
993
+ --su: 0.804941 0.077019 197.823719;
994
+ --wa: 0.891725 0.045833 71.47031;
995
+ --er: 0.730926 0.110185 20.076293
996
+ }
997
+ [data-theme=dim], :root:has(input.theme-controller[value=dim]:checked) {
998
+ color-scheme: dark;
999
+ --pc: 0.172267 0.028331 139.549991;
1000
+ --sc: 0.146752 0.033181 35.353059;
1001
+ --ac: 0.148459 0.026728 311.37924;
1002
+ --inc: 0.172157 0.028409 206.182959;
1003
+ --suc: 0.172343 0.028437 166.534048;
1004
+ --wac: 0.172327 0.028447 94.818679;
1005
+ --erc: 0.164838 0.019914 33.756357;
1129
1006
  --rounded-box: 1rem;
1130
1007
  --rounded-btn: 0.5rem;
1131
1008
  --rounded-badge: 1.9rem;
1132
1009
  --animation-btn: 0.25s;
1133
1010
  --animation-input: .2s;
1134
- --btn-text-case: uppercase;
1135
1011
  --btn-focus-scale: 0.95;
1136
1012
  --border-btn: 1px;
1137
1013
  --tab-border: 1px;
1138
1014
  --tab-radius: 0.5rem;
1139
- --p: 212 100% 51%;
1140
- --s: 247 47% 43%;
1141
- --a: 310 49% 52%;
1142
- --n: 217 92% 10%;
1143
- --b1: 0 0% 100%;
1144
- --b2: 217 100% 97%;
1145
- --b3: 219 44% 92%;
1146
- --bc: 214 30% 32%;
1147
- --in: 192 93% 78%;
1148
- --su: 182 47% 66%;
1149
- --wa: 32 62% 84%;
1150
- --er: 0 63% 72%
1015
+ --p: 0.861335 0.141656 139.549991;
1016
+ --s: 0.733759 0.165904 35.353059;
1017
+ --a: 0.742296 0.133641 311.37924;
1018
+ --n: 0.248091 0.041409 261.79232;
1019
+ --nc: 0.829011 0.031335 222.959324;
1020
+ --b1: 0.404748 0.036234 264.044279;
1021
+ --b2: 0.308577 0.023243 264.149498;
1022
+ --b3: 0.271708 0.018257 262.190531;
1023
+ --bc: 0.829011 0.031335 222.959324;
1024
+ --in: 0.860785 0.142046 206.182959;
1025
+ --su: 0.861717 0.142187 166.534048;
1026
+ --wa: 0.861634 0.142236 94.818679;
1027
+ --er: 0.824189 0.09957 33.756357
1028
+ }
1029
+ [data-theme=nord], :root:has(input.theme-controller[value=nord]:checked) {
1030
+ color-scheme: light;
1031
+ --pc: 0.118872 0.015449 254.027774;
1032
+ --sc: 0.139303 0.011822 248.687186;
1033
+ --ac: 0.154929 0.01245 217.469017;
1034
+ --inc: 0.138414 0.012499 332.664922;
1035
+ --suc: 0.153654 0.01498 131.063061;
1036
+ --wac: 0.170972 0.017847 84.093335;
1037
+ --erc: 0.12122 0.024119 15.341883;
1038
+ --animation-btn: 0.25s;
1039
+ --animation-input: .2s;
1040
+ --btn-focus-scale: 0.95;
1041
+ --border-btn: 1px;
1042
+ --tab-border: 1px;
1043
+ --p: 0.594359 0.077246 254.027774;
1044
+ --s: 0.696516 0.059108 248.687186;
1045
+ --a: 0.774643 0.062249 217.469017;
1046
+ --n: 0.45229 0.035214 264.1312;
1047
+ --nc: 0.899258 0.016374 262.749256;
1048
+ --b1: 0.951276 0.007445 260.731539;
1049
+ --b2: 0.932996 0.010389 261.788485;
1050
+ --b3: 0.899258 0.016374 262.749256;
1051
+ --bc: 0.324374 0.022945 264.182036;
1052
+ --in: 0.692072 0.062496 332.664922;
1053
+ --su: 0.76827 0.074899 131.063061;
1054
+ --wa: 0.854862 0.089234 84.093335;
1055
+ --er: 0.6061 0.120594 15.341883;
1056
+ --rounded-box: 0.4rem;
1057
+ --rounded-btn: 0.2rem;
1058
+ --rounded-badge: 0.4rem;
1059
+ --tab-radius: 0.2rem
1060
+ }
1061
+ [data-theme=sunset], :root:has(input.theme-controller[value=sunset]:checked) {
1062
+ color-scheme: dark;
1063
+ --pc: 0.149408 0.031656 39.94703;
1064
+ --sc: 0.145075 0.035531 2.72034;
1065
+ --ac: 0.142589 0.033336 299.844533;
1066
+ --inc: 0.171119 0.017054 206.015183;
1067
+ --suc: 0.171122 0.017172 144.77874;
1068
+ --wac: 0.171139 0.016961 74.427797;
1069
+ --erc: 0.171023 0.015778 16.886379;
1070
+ --animation-btn: 0.25s;
1071
+ --animation-input: .2s;
1072
+ --btn-focus-scale: 0.95;
1073
+ --border-btn: 1px;
1074
+ --tab-border: 1px;
1075
+ --p: 0.747039 0.158278 39.94703;
1076
+ --s: 0.725375 0.177654 2.72034;
1077
+ --a: 0.712947 0.166678 299.844533;
1078
+ --n: 0.26 0.019 237.69;
1079
+ --nc: 0.7 0.019 237.69;
1080
+ --b1: 0.22 0.019 237.69;
1081
+ --b2: 0.2 0.019 237.69;
1082
+ --b3: 0.18 0.019 237.69;
1083
+ --bc: 0.773835 0.043586 245.096534;
1084
+ --in: 0.855596 0.085271 206.015183;
1085
+ --su: 0.855609 0.08586 144.77874;
1086
+ --wa: 0.855695 0.084806 74.427797;
1087
+ --er: 0.855116 0.07889 16.886379;
1088
+ --rounded-box: 1.2rem;
1089
+ --rounded-btn: 0.8rem;
1090
+ --rounded-badge: 0.4rem;
1091
+ --tab-radius: 0.7rem
1151
1092
  }