daisyui 5.0.0-alpha.21 → 5.0.0-alpha.22

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 (75) hide show
  1. package/base/properties.css +49 -1
  2. package/base/rootcolor.css +43 -1
  3. package/base/scrollbar.css +37 -1
  4. package/colors/properties.css +500 -1
  5. package/colors/responsive.css +2510 -1
  6. package/colors/states.css +1840 -1
  7. package/components/alert/object.js +1 -1
  8. package/components/alert.css +433 -1
  9. package/components/avatar/object.js +1 -1
  10. package/components/avatar.css +385 -1
  11. package/components/badge/object.js +1 -1
  12. package/components/badge.css +589 -1
  13. package/components/button/object.js +1 -1
  14. package/components/button.css +1795 -1
  15. package/components/card/object.js +1 -1
  16. package/components/card.css +955 -1
  17. package/components/chat/object.js +1 -1
  18. package/components/chat.css +775 -1
  19. package/components/checkbox/object.js +1 -1
  20. package/components/checkbox.css +853 -1
  21. package/components/collapse.css +1039 -1
  22. package/components/countdown.css +121 -1
  23. package/components/divider/object.js +1 -1
  24. package/components/divider.css +643 -1
  25. package/components/dropdown/object.js +1 -1
  26. package/components/dropdown.css +1123 -1
  27. package/components/footer/object.js +1 -1
  28. package/components/footer.css +265 -1
  29. package/components/hero.css +181 -1
  30. package/components/input/class.json +1 -1
  31. package/components/input/object.js +1 -1
  32. package/components/input.css +1147 -1
  33. package/components/kbd/object.js +1 -1
  34. package/components/kbd.css +295 -1
  35. package/components/link.css +427 -1
  36. package/components/loading.css +271 -1
  37. package/components/mask.css +499 -1
  38. package/components/menu/object.js +1 -1
  39. package/components/menu.css +1411 -1
  40. package/components/navbar.css +151 -1
  41. package/components/progress.css +967 -1
  42. package/components/radialprogress.css +223 -1
  43. package/components/radio/object.js +1 -1
  44. package/components/radio.css +601 -1
  45. package/components/range/object.js +1 -1
  46. package/components/range.css +973 -1
  47. package/components/rating/object.js +1 -1
  48. package/components/rating.css +613 -1
  49. package/components/select/class.json +1 -1
  50. package/components/select/object.js +1 -1
  51. package/components/select.css +925 -1
  52. package/components/skeleton/object.js +1 -1
  53. package/components/skeleton.css +145 -1
  54. package/components/stack.css +157 -1
  55. package/components/status.css +385 -1
  56. package/components/steps/object.js +1 -1
  57. package/components/steps.css +853 -1
  58. package/components/swap/object.js +1 -1
  59. package/components/swap.css +553 -1
  60. package/components/tab/class.json +4 -4
  61. package/components/tab/object.js +1 -1
  62. package/components/tab.css +1333 -1
  63. package/components/table/object.js +1 -1
  64. package/components/table.css +781 -1
  65. package/components/timeline/object.js +1 -1
  66. package/components/timeline.css +1735 -1
  67. package/components/toggle/object.js +1 -1
  68. package/components/toggle.css +811 -1
  69. package/components/tooltip/object.js +1 -1
  70. package/components/tooltip.css +823 -1
  71. package/full.css +1 -1
  72. package/index.js +1 -1
  73. package/package.json +79 -78
  74. package/themes.css +1 -1
  75. package/utilities/join.css +757 -1
@@ -1 +1,967 @@
1
- /*! 🌼 daisyUI 5.0.0-alpha.21 – MIT License */ .progress{height:var(--spacing-2,.5rem);appearance:none;border-radius:var(--radius-box,var(--radius-box));background-color:color-mix(in srgb,var(--color-base-content,var(--color-base-content))20%,transparent);width:100%;position:relative;overflow:hidden;&:indeterminate{--progress-color:var(--color-base-content);background-image:repeating-linear-gradient(90deg,var(--progress-color)-1%,var(--progress-color)10%,transparent 10%,transparent 90%);background-position-x:15%;background-size:200%;animation:5s ease-in-out infinite progress-loading;@supports ((-moz-appearance:none)){&::-moz-progress-bar{background-color:#0000;background-image:repeating-linear-gradient(90deg,var(--progress-color)-1%,var(--progress-color)10%,transparent 10%,transparent 90%);background-position-x:15%;background-size:200%;animation:5s ease-in-out infinite progress-loading}}}@supports ((-moz-appearance:none)){&::-moz-progress-bar{border-radius:var(--radius-box,var(--radius-box));background-color:var(--color-base-content,var(--color-base-content))}}@supports ((-webkit-appearance:none)){&::-webkit-progress-bar{border-radius:var(--radius-box,var(--radius-box));background-color:#0000}&::-webkit-progress-value{border-radius:var(--radius-box,var(--radius-box));background-color:var(--color-base-content,var(--color-base-content))}}}.progress-primary{&:indeterminate{--progress-color:var(--color-primary)}@supports ((-moz-appearance:none)){&::-moz-progress-bar{border-radius:var(--radius-box,var(--radius-box));background-color:var(--color-primary,var(--color-primary))}}@supports ((-webkit-appearance:none)){&::-webkit-progress-value{background-color:var(--color-primary,var(--color-primary))}}}.progress-secondary{&:indeterminate{--progress-color:var(--color-secondary)}@supports ((-moz-appearance:none)){&::-moz-progress-bar{border-radius:var(--radius-box,var(--radius-box));background-color:var(--color-secondary,var(--color-secondary))}}@supports ((-webkit-appearance:none)){&::-webkit-progress-value{background-color:var(--color-secondary,var(--color-secondary))}}}.progress-accent{&:indeterminate{--progress-color:var(--color-accent)}@supports ((-moz-appearance:none)){&::-moz-progress-bar{border-radius:var(--radius-box,var(--radius-box));background-color:var(--color-accent,var(--color-accent))}}@supports ((-webkit-appearance:none)){&::-webkit-progress-value{background-color:var(--color-accent,var(--color-accent))}}}.progress-info{&:indeterminate{--progress-color:var(--color-info)}@supports ((-moz-appearance:none)){&::-moz-progress-bar{border-radius:var(--radius-box,var(--radius-box));background-color:var(--color-info,var(--color-info))}}@supports ((-webkit-appearance:none)){&::-webkit-progress-value{background-color:var(--color-info,var(--color-info))}}}.progress-success{&:indeterminate{--progress-color:var(--color-success)}@supports ((-moz-appearance:none)){&::-moz-progress-bar{border-radius:var(--radius-box,var(--radius-box));background-color:var(--color-success,var(--color-success))}}@supports ((-webkit-appearance:none)){&::-webkit-progress-value{background-color:var(--color-success,var(--color-success))}}}.progress-warning{&:indeterminate{--progress-color:var(--color-warning)}@supports ((-moz-appearance:none)){&::-moz-progress-bar{border-radius:var(--radius-box,var(--radius-box));background-color:var(--color-warning,var(--color-warning))}}@supports ((-webkit-appearance:none)){&::-webkit-progress-value{background-color:var(--color-warning,var(--color-warning))}}}.progress-error{&:indeterminate{--progress-color:var(--color-error)}@supports ((-moz-appearance:none)){&::-moz-progress-bar{border-radius:var(--radius-box,var(--radius-box));background-color:var(--color-error,var(--color-error))}}@supports ((-webkit-appearance:none)){&::-webkit-progress-value{background-color:var(--color-error,var(--color-error))}}}@keyframes progress-loading{50%{background-position-x:-115%}}
1
+ .progress {
2
+ position: relative;
3
+ height: var(--spacing-2, 0.5rem);
4
+ width: 100%;
5
+ appearance: none;
6
+ overflow: hidden;
7
+ border-radius: var(--radius-box, );
8
+ background-color: color-mix(in srgb, var(--color-base-content, ) 20%, transparent);
9
+ &:indeterminate {
10
+ --progress-color: var(--color-base-content);
11
+ background-image: repeating-linear-gradient(90deg, var(--progress-color) -1%, var(--progress-color) 10%, transparent 10%, transparent 90%);
12
+ background-size: 200%;
13
+ background-position-x: 15%;
14
+ animation: progress-loading 5s ease-in-out infinite;
15
+ @supports (-moz-appearance: none) {
16
+ &::-moz-progress-bar {
17
+ background-color: transparent;
18
+ background-image: repeating-linear-gradient(90deg, var(--progress-color) -1%, var(--progress-color) 10%, transparent 10%, transparent 90%);
19
+ background-size: 200%;
20
+ background-position-x: 15%;
21
+ animation: progress-loading 5s ease-in-out infinite;
22
+ }
23
+ }
24
+ }
25
+ @supports (-moz-appearance: none) {
26
+ &::-moz-progress-bar {
27
+ border-radius: var(--radius-box, );
28
+ background-color: var(--color-base-content, );
29
+ }
30
+ }
31
+ @supports (-webkit-appearance: none) {
32
+ &::-webkit-progress-bar {
33
+ border-radius: var(--radius-box, );
34
+ background-color: transparent;
35
+ }
36
+ &::-webkit-progress-value {
37
+ border-radius: var(--radius-box, );
38
+ background-color: var(--color-base-content, );
39
+ }
40
+ }
41
+ }
42
+ .progress-primary {
43
+ &:indeterminate {
44
+ --progress-color: var(--color-primary);
45
+ }
46
+ @supports (-moz-appearance: none) {
47
+ &::-moz-progress-bar {
48
+ border-radius: var(--radius-box, );
49
+ background-color: var(--color-primary, );
50
+ }
51
+ }
52
+ @supports (-webkit-appearance: none) {
53
+ &::-webkit-progress-value {
54
+ background-color: var(--color-primary, );
55
+ }
56
+ }
57
+ }
58
+ .progress-secondary {
59
+ &:indeterminate {
60
+ --progress-color: var(--color-secondary);
61
+ }
62
+ @supports (-moz-appearance: none) {
63
+ &::-moz-progress-bar {
64
+ border-radius: var(--radius-box, );
65
+ background-color: var(--color-secondary, );
66
+ }
67
+ }
68
+ @supports (-webkit-appearance: none) {
69
+ &::-webkit-progress-value {
70
+ background-color: var(--color-secondary, );
71
+ }
72
+ }
73
+ }
74
+ .progress-accent {
75
+ &:indeterminate {
76
+ --progress-color: var(--color-accent);
77
+ }
78
+ @supports (-moz-appearance: none) {
79
+ &::-moz-progress-bar {
80
+ border-radius: var(--radius-box, );
81
+ background-color: var(--color-accent, );
82
+ }
83
+ }
84
+ @supports (-webkit-appearance: none) {
85
+ &::-webkit-progress-value {
86
+ background-color: var(--color-accent, );
87
+ }
88
+ }
89
+ }
90
+ .progress-info {
91
+ &:indeterminate {
92
+ --progress-color: var(--color-info);
93
+ }
94
+ @supports (-moz-appearance: none) {
95
+ &::-moz-progress-bar {
96
+ border-radius: var(--radius-box, );
97
+ background-color: var(--color-info, );
98
+ }
99
+ }
100
+ @supports (-webkit-appearance: none) {
101
+ &::-webkit-progress-value {
102
+ background-color: var(--color-info, );
103
+ }
104
+ }
105
+ }
106
+ .progress-success {
107
+ &:indeterminate {
108
+ --progress-color: var(--color-success);
109
+ }
110
+ @supports (-moz-appearance: none) {
111
+ &::-moz-progress-bar {
112
+ border-radius: var(--radius-box, );
113
+ background-color: var(--color-success, );
114
+ }
115
+ }
116
+ @supports (-webkit-appearance: none) {
117
+ &::-webkit-progress-value {
118
+ background-color: var(--color-success, );
119
+ }
120
+ }
121
+ }
122
+ .progress-warning {
123
+ &:indeterminate {
124
+ --progress-color: var(--color-warning);
125
+ }
126
+ @supports (-moz-appearance: none) {
127
+ &::-moz-progress-bar {
128
+ border-radius: var(--radius-box, );
129
+ background-color: var(--color-warning, );
130
+ }
131
+ }
132
+ @supports (-webkit-appearance: none) {
133
+ &::-webkit-progress-value {
134
+ background-color: var(--color-warning, );
135
+ }
136
+ }
137
+ }
138
+ .progress-error {
139
+ &:indeterminate {
140
+ --progress-color: var(--color-error);
141
+ }
142
+ @supports (-moz-appearance: none) {
143
+ &::-moz-progress-bar {
144
+ border-radius: var(--radius-box, );
145
+ background-color: var(--color-error, );
146
+ }
147
+ }
148
+ @supports (-webkit-appearance: none) {
149
+ &::-webkit-progress-value {
150
+ background-color: var(--color-error, );
151
+ }
152
+ }
153
+ }
154
+ @keyframes progress-loading {
155
+ 50% {
156
+ background-position-x: -115%;
157
+ }
158
+ }
159
+ @media (min-width: 640px) {
160
+ .sm\:progress {
161
+ position: relative;
162
+ height: var(--spacing-2, 0.5rem);
163
+ width: 100%;
164
+ appearance: none;
165
+ overflow: hidden;
166
+ border-radius: var(--radius-box, );
167
+ background-color: color-mix(in srgb, var(--color-base-content, ) 20%, transparent);
168
+ &:indeterminate {
169
+ --progress-color: var(--color-base-content);
170
+ background-image: repeating-linear-gradient(90deg, var(--progress-color) -1%, var(--progress-color) 10%, transparent 10%, transparent 90%);
171
+ background-size: 200%;
172
+ background-position-x: 15%;
173
+ animation: progress-loading 5s ease-in-out infinite;
174
+ @supports (-moz-appearance: none) {
175
+ &::-moz-progress-bar {
176
+ background-color: transparent;
177
+ background-image: repeating-linear-gradient(90deg, var(--progress-color) -1%, var(--progress-color) 10%, transparent 10%, transparent 90%);
178
+ background-size: 200%;
179
+ background-position-x: 15%;
180
+ animation: progress-loading 5s ease-in-out infinite;
181
+ }
182
+ }
183
+ }
184
+ @supports (-moz-appearance: none) {
185
+ &::-moz-progress-bar {
186
+ border-radius: var(--radius-box, );
187
+ background-color: var(--color-base-content, );
188
+ }
189
+ }
190
+ @supports (-webkit-appearance: none) {
191
+ &::-webkit-progress-bar {
192
+ border-radius: var(--radius-box, );
193
+ background-color: transparent;
194
+ }
195
+ &::-webkit-progress-value {
196
+ border-radius: var(--radius-box, );
197
+ background-color: var(--color-base-content, );
198
+ }
199
+ }
200
+ }
201
+ .sm\:progress-primary {
202
+ &:indeterminate {
203
+ --progress-color: var(--color-primary);
204
+ }
205
+ @supports (-moz-appearance: none) {
206
+ &::-moz-progress-bar {
207
+ border-radius: var(--radius-box, );
208
+ background-color: var(--color-primary, );
209
+ }
210
+ }
211
+ @supports (-webkit-appearance: none) {
212
+ &::-webkit-progress-value {
213
+ background-color: var(--color-primary, );
214
+ }
215
+ }
216
+ }
217
+ .sm\:progress-secondary {
218
+ &:indeterminate {
219
+ --progress-color: var(--color-secondary);
220
+ }
221
+ @supports (-moz-appearance: none) {
222
+ &::-moz-progress-bar {
223
+ border-radius: var(--radius-box, );
224
+ background-color: var(--color-secondary, );
225
+ }
226
+ }
227
+ @supports (-webkit-appearance: none) {
228
+ &::-webkit-progress-value {
229
+ background-color: var(--color-secondary, );
230
+ }
231
+ }
232
+ }
233
+ .sm\:progress-accent {
234
+ &:indeterminate {
235
+ --progress-color: var(--color-accent);
236
+ }
237
+ @supports (-moz-appearance: none) {
238
+ &::-moz-progress-bar {
239
+ border-radius: var(--radius-box, );
240
+ background-color: var(--color-accent, );
241
+ }
242
+ }
243
+ @supports (-webkit-appearance: none) {
244
+ &::-webkit-progress-value {
245
+ background-color: var(--color-accent, );
246
+ }
247
+ }
248
+ }
249
+ .sm\:progress-info {
250
+ &:indeterminate {
251
+ --progress-color: var(--color-info);
252
+ }
253
+ @supports (-moz-appearance: none) {
254
+ &::-moz-progress-bar {
255
+ border-radius: var(--radius-box, );
256
+ background-color: var(--color-info, );
257
+ }
258
+ }
259
+ @supports (-webkit-appearance: none) {
260
+ &::-webkit-progress-value {
261
+ background-color: var(--color-info, );
262
+ }
263
+ }
264
+ }
265
+ .sm\:progress-success {
266
+ &:indeterminate {
267
+ --progress-color: var(--color-success);
268
+ }
269
+ @supports (-moz-appearance: none) {
270
+ &::-moz-progress-bar {
271
+ border-radius: var(--radius-box, );
272
+ background-color: var(--color-success, );
273
+ }
274
+ }
275
+ @supports (-webkit-appearance: none) {
276
+ &::-webkit-progress-value {
277
+ background-color: var(--color-success, );
278
+ }
279
+ }
280
+ }
281
+ .sm\:progress-warning {
282
+ &:indeterminate {
283
+ --progress-color: var(--color-warning);
284
+ }
285
+ @supports (-moz-appearance: none) {
286
+ &::-moz-progress-bar {
287
+ border-radius: var(--radius-box, );
288
+ background-color: var(--color-warning, );
289
+ }
290
+ }
291
+ @supports (-webkit-appearance: none) {
292
+ &::-webkit-progress-value {
293
+ background-color: var(--color-warning, );
294
+ }
295
+ }
296
+ }
297
+ .sm\:progress-error {
298
+ &:indeterminate {
299
+ --progress-color: var(--color-error);
300
+ }
301
+ @supports (-moz-appearance: none) {
302
+ &::-moz-progress-bar {
303
+ border-radius: var(--radius-box, );
304
+ background-color: var(--color-error, );
305
+ }
306
+ }
307
+ @supports (-webkit-appearance: none) {
308
+ &::-webkit-progress-value {
309
+ background-color: var(--color-error, );
310
+ }
311
+ }
312
+ }
313
+ @keyframes progress-loading {
314
+ 50% {
315
+ background-position-x: -115%;
316
+ }
317
+ }
318
+ }
319
+
320
+
321
+ @media (min-width: 768px) {
322
+ .md\:progress {
323
+ position: relative;
324
+ height: var(--spacing-2, 0.5rem);
325
+ width: 100%;
326
+ appearance: none;
327
+ overflow: hidden;
328
+ border-radius: var(--radius-box, );
329
+ background-color: color-mix(in srgb, var(--color-base-content, ) 20%, transparent);
330
+ &:indeterminate {
331
+ --progress-color: var(--color-base-content);
332
+ background-image: repeating-linear-gradient(90deg, var(--progress-color) -1%, var(--progress-color) 10%, transparent 10%, transparent 90%);
333
+ background-size: 200%;
334
+ background-position-x: 15%;
335
+ animation: progress-loading 5s ease-in-out infinite;
336
+ @supports (-moz-appearance: none) {
337
+ &::-moz-progress-bar {
338
+ background-color: transparent;
339
+ background-image: repeating-linear-gradient(90deg, var(--progress-color) -1%, var(--progress-color) 10%, transparent 10%, transparent 90%);
340
+ background-size: 200%;
341
+ background-position-x: 15%;
342
+ animation: progress-loading 5s ease-in-out infinite;
343
+ }
344
+ }
345
+ }
346
+ @supports (-moz-appearance: none) {
347
+ &::-moz-progress-bar {
348
+ border-radius: var(--radius-box, );
349
+ background-color: var(--color-base-content, );
350
+ }
351
+ }
352
+ @supports (-webkit-appearance: none) {
353
+ &::-webkit-progress-bar {
354
+ border-radius: var(--radius-box, );
355
+ background-color: transparent;
356
+ }
357
+ &::-webkit-progress-value {
358
+ border-radius: var(--radius-box, );
359
+ background-color: var(--color-base-content, );
360
+ }
361
+ }
362
+ }
363
+ .md\:progress-primary {
364
+ &:indeterminate {
365
+ --progress-color: var(--color-primary);
366
+ }
367
+ @supports (-moz-appearance: none) {
368
+ &::-moz-progress-bar {
369
+ border-radius: var(--radius-box, );
370
+ background-color: var(--color-primary, );
371
+ }
372
+ }
373
+ @supports (-webkit-appearance: none) {
374
+ &::-webkit-progress-value {
375
+ background-color: var(--color-primary, );
376
+ }
377
+ }
378
+ }
379
+ .md\:progress-secondary {
380
+ &:indeterminate {
381
+ --progress-color: var(--color-secondary);
382
+ }
383
+ @supports (-moz-appearance: none) {
384
+ &::-moz-progress-bar {
385
+ border-radius: var(--radius-box, );
386
+ background-color: var(--color-secondary, );
387
+ }
388
+ }
389
+ @supports (-webkit-appearance: none) {
390
+ &::-webkit-progress-value {
391
+ background-color: var(--color-secondary, );
392
+ }
393
+ }
394
+ }
395
+ .md\:progress-accent {
396
+ &:indeterminate {
397
+ --progress-color: var(--color-accent);
398
+ }
399
+ @supports (-moz-appearance: none) {
400
+ &::-moz-progress-bar {
401
+ border-radius: var(--radius-box, );
402
+ background-color: var(--color-accent, );
403
+ }
404
+ }
405
+ @supports (-webkit-appearance: none) {
406
+ &::-webkit-progress-value {
407
+ background-color: var(--color-accent, );
408
+ }
409
+ }
410
+ }
411
+ .md\:progress-info {
412
+ &:indeterminate {
413
+ --progress-color: var(--color-info);
414
+ }
415
+ @supports (-moz-appearance: none) {
416
+ &::-moz-progress-bar {
417
+ border-radius: var(--radius-box, );
418
+ background-color: var(--color-info, );
419
+ }
420
+ }
421
+ @supports (-webkit-appearance: none) {
422
+ &::-webkit-progress-value {
423
+ background-color: var(--color-info, );
424
+ }
425
+ }
426
+ }
427
+ .md\:progress-success {
428
+ &:indeterminate {
429
+ --progress-color: var(--color-success);
430
+ }
431
+ @supports (-moz-appearance: none) {
432
+ &::-moz-progress-bar {
433
+ border-radius: var(--radius-box, );
434
+ background-color: var(--color-success, );
435
+ }
436
+ }
437
+ @supports (-webkit-appearance: none) {
438
+ &::-webkit-progress-value {
439
+ background-color: var(--color-success, );
440
+ }
441
+ }
442
+ }
443
+ .md\:progress-warning {
444
+ &:indeterminate {
445
+ --progress-color: var(--color-warning);
446
+ }
447
+ @supports (-moz-appearance: none) {
448
+ &::-moz-progress-bar {
449
+ border-radius: var(--radius-box, );
450
+ background-color: var(--color-warning, );
451
+ }
452
+ }
453
+ @supports (-webkit-appearance: none) {
454
+ &::-webkit-progress-value {
455
+ background-color: var(--color-warning, );
456
+ }
457
+ }
458
+ }
459
+ .md\:progress-error {
460
+ &:indeterminate {
461
+ --progress-color: var(--color-error);
462
+ }
463
+ @supports (-moz-appearance: none) {
464
+ &::-moz-progress-bar {
465
+ border-radius: var(--radius-box, );
466
+ background-color: var(--color-error, );
467
+ }
468
+ }
469
+ @supports (-webkit-appearance: none) {
470
+ &::-webkit-progress-value {
471
+ background-color: var(--color-error, );
472
+ }
473
+ }
474
+ }
475
+ @keyframes progress-loading {
476
+ 50% {
477
+ background-position-x: -115%;
478
+ }
479
+ }
480
+ }
481
+
482
+
483
+ @media (min-width: 1024px) {
484
+ .lg\:progress {
485
+ position: relative;
486
+ height: var(--spacing-2, 0.5rem);
487
+ width: 100%;
488
+ appearance: none;
489
+ overflow: hidden;
490
+ border-radius: var(--radius-box, );
491
+ background-color: color-mix(in srgb, var(--color-base-content, ) 20%, transparent);
492
+ &:indeterminate {
493
+ --progress-color: var(--color-base-content);
494
+ background-image: repeating-linear-gradient(90deg, var(--progress-color) -1%, var(--progress-color) 10%, transparent 10%, transparent 90%);
495
+ background-size: 200%;
496
+ background-position-x: 15%;
497
+ animation: progress-loading 5s ease-in-out infinite;
498
+ @supports (-moz-appearance: none) {
499
+ &::-moz-progress-bar {
500
+ background-color: transparent;
501
+ background-image: repeating-linear-gradient(90deg, var(--progress-color) -1%, var(--progress-color) 10%, transparent 10%, transparent 90%);
502
+ background-size: 200%;
503
+ background-position-x: 15%;
504
+ animation: progress-loading 5s ease-in-out infinite;
505
+ }
506
+ }
507
+ }
508
+ @supports (-moz-appearance: none) {
509
+ &::-moz-progress-bar {
510
+ border-radius: var(--radius-box, );
511
+ background-color: var(--color-base-content, );
512
+ }
513
+ }
514
+ @supports (-webkit-appearance: none) {
515
+ &::-webkit-progress-bar {
516
+ border-radius: var(--radius-box, );
517
+ background-color: transparent;
518
+ }
519
+ &::-webkit-progress-value {
520
+ border-radius: var(--radius-box, );
521
+ background-color: var(--color-base-content, );
522
+ }
523
+ }
524
+ }
525
+ .lg\:progress-primary {
526
+ &:indeterminate {
527
+ --progress-color: var(--color-primary);
528
+ }
529
+ @supports (-moz-appearance: none) {
530
+ &::-moz-progress-bar {
531
+ border-radius: var(--radius-box, );
532
+ background-color: var(--color-primary, );
533
+ }
534
+ }
535
+ @supports (-webkit-appearance: none) {
536
+ &::-webkit-progress-value {
537
+ background-color: var(--color-primary, );
538
+ }
539
+ }
540
+ }
541
+ .lg\:progress-secondary {
542
+ &:indeterminate {
543
+ --progress-color: var(--color-secondary);
544
+ }
545
+ @supports (-moz-appearance: none) {
546
+ &::-moz-progress-bar {
547
+ border-radius: var(--radius-box, );
548
+ background-color: var(--color-secondary, );
549
+ }
550
+ }
551
+ @supports (-webkit-appearance: none) {
552
+ &::-webkit-progress-value {
553
+ background-color: var(--color-secondary, );
554
+ }
555
+ }
556
+ }
557
+ .lg\:progress-accent {
558
+ &:indeterminate {
559
+ --progress-color: var(--color-accent);
560
+ }
561
+ @supports (-moz-appearance: none) {
562
+ &::-moz-progress-bar {
563
+ border-radius: var(--radius-box, );
564
+ background-color: var(--color-accent, );
565
+ }
566
+ }
567
+ @supports (-webkit-appearance: none) {
568
+ &::-webkit-progress-value {
569
+ background-color: var(--color-accent, );
570
+ }
571
+ }
572
+ }
573
+ .lg\:progress-info {
574
+ &:indeterminate {
575
+ --progress-color: var(--color-info);
576
+ }
577
+ @supports (-moz-appearance: none) {
578
+ &::-moz-progress-bar {
579
+ border-radius: var(--radius-box, );
580
+ background-color: var(--color-info, );
581
+ }
582
+ }
583
+ @supports (-webkit-appearance: none) {
584
+ &::-webkit-progress-value {
585
+ background-color: var(--color-info, );
586
+ }
587
+ }
588
+ }
589
+ .lg\:progress-success {
590
+ &:indeterminate {
591
+ --progress-color: var(--color-success);
592
+ }
593
+ @supports (-moz-appearance: none) {
594
+ &::-moz-progress-bar {
595
+ border-radius: var(--radius-box, );
596
+ background-color: var(--color-success, );
597
+ }
598
+ }
599
+ @supports (-webkit-appearance: none) {
600
+ &::-webkit-progress-value {
601
+ background-color: var(--color-success, );
602
+ }
603
+ }
604
+ }
605
+ .lg\:progress-warning {
606
+ &:indeterminate {
607
+ --progress-color: var(--color-warning);
608
+ }
609
+ @supports (-moz-appearance: none) {
610
+ &::-moz-progress-bar {
611
+ border-radius: var(--radius-box, );
612
+ background-color: var(--color-warning, );
613
+ }
614
+ }
615
+ @supports (-webkit-appearance: none) {
616
+ &::-webkit-progress-value {
617
+ background-color: var(--color-warning, );
618
+ }
619
+ }
620
+ }
621
+ .lg\:progress-error {
622
+ &:indeterminate {
623
+ --progress-color: var(--color-error);
624
+ }
625
+ @supports (-moz-appearance: none) {
626
+ &::-moz-progress-bar {
627
+ border-radius: var(--radius-box, );
628
+ background-color: var(--color-error, );
629
+ }
630
+ }
631
+ @supports (-webkit-appearance: none) {
632
+ &::-webkit-progress-value {
633
+ background-color: var(--color-error, );
634
+ }
635
+ }
636
+ }
637
+ @keyframes progress-loading {
638
+ 50% {
639
+ background-position-x: -115%;
640
+ }
641
+ }
642
+ }
643
+
644
+
645
+ @media (min-width: 1280px) {
646
+ .xl\:progress {
647
+ position: relative;
648
+ height: var(--spacing-2, 0.5rem);
649
+ width: 100%;
650
+ appearance: none;
651
+ overflow: hidden;
652
+ border-radius: var(--radius-box, );
653
+ background-color: color-mix(in srgb, var(--color-base-content, ) 20%, transparent);
654
+ &:indeterminate {
655
+ --progress-color: var(--color-base-content);
656
+ background-image: repeating-linear-gradient(90deg, var(--progress-color) -1%, var(--progress-color) 10%, transparent 10%, transparent 90%);
657
+ background-size: 200%;
658
+ background-position-x: 15%;
659
+ animation: progress-loading 5s ease-in-out infinite;
660
+ @supports (-moz-appearance: none) {
661
+ &::-moz-progress-bar {
662
+ background-color: transparent;
663
+ background-image: repeating-linear-gradient(90deg, var(--progress-color) -1%, var(--progress-color) 10%, transparent 10%, transparent 90%);
664
+ background-size: 200%;
665
+ background-position-x: 15%;
666
+ animation: progress-loading 5s ease-in-out infinite;
667
+ }
668
+ }
669
+ }
670
+ @supports (-moz-appearance: none) {
671
+ &::-moz-progress-bar {
672
+ border-radius: var(--radius-box, );
673
+ background-color: var(--color-base-content, );
674
+ }
675
+ }
676
+ @supports (-webkit-appearance: none) {
677
+ &::-webkit-progress-bar {
678
+ border-radius: var(--radius-box, );
679
+ background-color: transparent;
680
+ }
681
+ &::-webkit-progress-value {
682
+ border-radius: var(--radius-box, );
683
+ background-color: var(--color-base-content, );
684
+ }
685
+ }
686
+ }
687
+ .xl\:progress-primary {
688
+ &:indeterminate {
689
+ --progress-color: var(--color-primary);
690
+ }
691
+ @supports (-moz-appearance: none) {
692
+ &::-moz-progress-bar {
693
+ border-radius: var(--radius-box, );
694
+ background-color: var(--color-primary, );
695
+ }
696
+ }
697
+ @supports (-webkit-appearance: none) {
698
+ &::-webkit-progress-value {
699
+ background-color: var(--color-primary, );
700
+ }
701
+ }
702
+ }
703
+ .xl\:progress-secondary {
704
+ &:indeterminate {
705
+ --progress-color: var(--color-secondary);
706
+ }
707
+ @supports (-moz-appearance: none) {
708
+ &::-moz-progress-bar {
709
+ border-radius: var(--radius-box, );
710
+ background-color: var(--color-secondary, );
711
+ }
712
+ }
713
+ @supports (-webkit-appearance: none) {
714
+ &::-webkit-progress-value {
715
+ background-color: var(--color-secondary, );
716
+ }
717
+ }
718
+ }
719
+ .xl\:progress-accent {
720
+ &:indeterminate {
721
+ --progress-color: var(--color-accent);
722
+ }
723
+ @supports (-moz-appearance: none) {
724
+ &::-moz-progress-bar {
725
+ border-radius: var(--radius-box, );
726
+ background-color: var(--color-accent, );
727
+ }
728
+ }
729
+ @supports (-webkit-appearance: none) {
730
+ &::-webkit-progress-value {
731
+ background-color: var(--color-accent, );
732
+ }
733
+ }
734
+ }
735
+ .xl\:progress-info {
736
+ &:indeterminate {
737
+ --progress-color: var(--color-info);
738
+ }
739
+ @supports (-moz-appearance: none) {
740
+ &::-moz-progress-bar {
741
+ border-radius: var(--radius-box, );
742
+ background-color: var(--color-info, );
743
+ }
744
+ }
745
+ @supports (-webkit-appearance: none) {
746
+ &::-webkit-progress-value {
747
+ background-color: var(--color-info, );
748
+ }
749
+ }
750
+ }
751
+ .xl\:progress-success {
752
+ &:indeterminate {
753
+ --progress-color: var(--color-success);
754
+ }
755
+ @supports (-moz-appearance: none) {
756
+ &::-moz-progress-bar {
757
+ border-radius: var(--radius-box, );
758
+ background-color: var(--color-success, );
759
+ }
760
+ }
761
+ @supports (-webkit-appearance: none) {
762
+ &::-webkit-progress-value {
763
+ background-color: var(--color-success, );
764
+ }
765
+ }
766
+ }
767
+ .xl\:progress-warning {
768
+ &:indeterminate {
769
+ --progress-color: var(--color-warning);
770
+ }
771
+ @supports (-moz-appearance: none) {
772
+ &::-moz-progress-bar {
773
+ border-radius: var(--radius-box, );
774
+ background-color: var(--color-warning, );
775
+ }
776
+ }
777
+ @supports (-webkit-appearance: none) {
778
+ &::-webkit-progress-value {
779
+ background-color: var(--color-warning, );
780
+ }
781
+ }
782
+ }
783
+ .xl\:progress-error {
784
+ &:indeterminate {
785
+ --progress-color: var(--color-error);
786
+ }
787
+ @supports (-moz-appearance: none) {
788
+ &::-moz-progress-bar {
789
+ border-radius: var(--radius-box, );
790
+ background-color: var(--color-error, );
791
+ }
792
+ }
793
+ @supports (-webkit-appearance: none) {
794
+ &::-webkit-progress-value {
795
+ background-color: var(--color-error, );
796
+ }
797
+ }
798
+ }
799
+ @keyframes progress-loading {
800
+ 50% {
801
+ background-position-x: -115%;
802
+ }
803
+ }
804
+ }
805
+
806
+
807
+ @media (min-width: 1536px) {
808
+ .\32xl\:progress {
809
+ position: relative;
810
+ height: var(--spacing-2, 0.5rem);
811
+ width: 100%;
812
+ appearance: none;
813
+ overflow: hidden;
814
+ border-radius: var(--radius-box, );
815
+ background-color: color-mix(in srgb, var(--color-base-content, ) 20%, transparent);
816
+ &:indeterminate {
817
+ --progress-color: var(--color-base-content);
818
+ background-image: repeating-linear-gradient(90deg, var(--progress-color) -1%, var(--progress-color) 10%, transparent 10%, transparent 90%);
819
+ background-size: 200%;
820
+ background-position-x: 15%;
821
+ animation: progress-loading 5s ease-in-out infinite;
822
+ @supports (-moz-appearance: none) {
823
+ &::-moz-progress-bar {
824
+ background-color: transparent;
825
+ background-image: repeating-linear-gradient(90deg, var(--progress-color) -1%, var(--progress-color) 10%, transparent 10%, transparent 90%);
826
+ background-size: 200%;
827
+ background-position-x: 15%;
828
+ animation: progress-loading 5s ease-in-out infinite;
829
+ }
830
+ }
831
+ }
832
+ @supports (-moz-appearance: none) {
833
+ &::-moz-progress-bar {
834
+ border-radius: var(--radius-box, );
835
+ background-color: var(--color-base-content, );
836
+ }
837
+ }
838
+ @supports (-webkit-appearance: none) {
839
+ &::-webkit-progress-bar {
840
+ border-radius: var(--radius-box, );
841
+ background-color: transparent;
842
+ }
843
+ &::-webkit-progress-value {
844
+ border-radius: var(--radius-box, );
845
+ background-color: var(--color-base-content, );
846
+ }
847
+ }
848
+ }
849
+ .\32xl\:progress-primary {
850
+ &:indeterminate {
851
+ --progress-color: var(--color-primary);
852
+ }
853
+ @supports (-moz-appearance: none) {
854
+ &::-moz-progress-bar {
855
+ border-radius: var(--radius-box, );
856
+ background-color: var(--color-primary, );
857
+ }
858
+ }
859
+ @supports (-webkit-appearance: none) {
860
+ &::-webkit-progress-value {
861
+ background-color: var(--color-primary, );
862
+ }
863
+ }
864
+ }
865
+ .\32xl\:progress-secondary {
866
+ &:indeterminate {
867
+ --progress-color: var(--color-secondary);
868
+ }
869
+ @supports (-moz-appearance: none) {
870
+ &::-moz-progress-bar {
871
+ border-radius: var(--radius-box, );
872
+ background-color: var(--color-secondary, );
873
+ }
874
+ }
875
+ @supports (-webkit-appearance: none) {
876
+ &::-webkit-progress-value {
877
+ background-color: var(--color-secondary, );
878
+ }
879
+ }
880
+ }
881
+ .\32xl\:progress-accent {
882
+ &:indeterminate {
883
+ --progress-color: var(--color-accent);
884
+ }
885
+ @supports (-moz-appearance: none) {
886
+ &::-moz-progress-bar {
887
+ border-radius: var(--radius-box, );
888
+ background-color: var(--color-accent, );
889
+ }
890
+ }
891
+ @supports (-webkit-appearance: none) {
892
+ &::-webkit-progress-value {
893
+ background-color: var(--color-accent, );
894
+ }
895
+ }
896
+ }
897
+ .\32xl\:progress-info {
898
+ &:indeterminate {
899
+ --progress-color: var(--color-info);
900
+ }
901
+ @supports (-moz-appearance: none) {
902
+ &::-moz-progress-bar {
903
+ border-radius: var(--radius-box, );
904
+ background-color: var(--color-info, );
905
+ }
906
+ }
907
+ @supports (-webkit-appearance: none) {
908
+ &::-webkit-progress-value {
909
+ background-color: var(--color-info, );
910
+ }
911
+ }
912
+ }
913
+ .\32xl\:progress-success {
914
+ &:indeterminate {
915
+ --progress-color: var(--color-success);
916
+ }
917
+ @supports (-moz-appearance: none) {
918
+ &::-moz-progress-bar {
919
+ border-radius: var(--radius-box, );
920
+ background-color: var(--color-success, );
921
+ }
922
+ }
923
+ @supports (-webkit-appearance: none) {
924
+ &::-webkit-progress-value {
925
+ background-color: var(--color-success, );
926
+ }
927
+ }
928
+ }
929
+ .\32xl\:progress-warning {
930
+ &:indeterminate {
931
+ --progress-color: var(--color-warning);
932
+ }
933
+ @supports (-moz-appearance: none) {
934
+ &::-moz-progress-bar {
935
+ border-radius: var(--radius-box, );
936
+ background-color: var(--color-warning, );
937
+ }
938
+ }
939
+ @supports (-webkit-appearance: none) {
940
+ &::-webkit-progress-value {
941
+ background-color: var(--color-warning, );
942
+ }
943
+ }
944
+ }
945
+ .\32xl\:progress-error {
946
+ &:indeterminate {
947
+ --progress-color: var(--color-error);
948
+ }
949
+ @supports (-moz-appearance: none) {
950
+ &::-moz-progress-bar {
951
+ border-radius: var(--radius-box, );
952
+ background-color: var(--color-error, );
953
+ }
954
+ }
955
+ @supports (-webkit-appearance: none) {
956
+ &::-webkit-progress-value {
957
+ background-color: var(--color-error, );
958
+ }
959
+ }
960
+ }
961
+ @keyframes progress-loading {
962
+ 50% {
963
+ background-position-x: -115%;
964
+ }
965
+ }
966
+ }
967
+