daisyui 2.11.0 → 2.13.0

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.
package/dist/styled.css CHANGED
@@ -289,6 +289,7 @@
289
289
  overflow-y: hidden;
290
290
  }
291
291
  .countdown > *:before {
292
+ z-index: -1;
292
293
  position: relative;
293
294
  content: "00\A 01\A 02\A 03\A 04\A 05\A 06\A 07\A 08\A 09\A 10\A 11\A 12\A 13\A 14\A 15\A 16\A 17\A 18\A 19\A 20\A 21\A 22\A 23\A 24\A 25\A 26\A 27\A 28\A 29\A 30\A 31\A 32\A 33\A 34\A 35\A 36\A 37\A 38\A 39\A 40\A 41\A 42\A 43\A 44\A 45\A 46\A 47\A 48\A 49\A 50\A 51\A 52\A 53\A 54\A 55\A 56\A 57\A 58\A 59\A 60\A 61\A 62\A 63\A 64\A 65\A 66\A 67\A 68\A 69\A 70\A 71\A 72\A 73\A 74\A 75\A 76\A 77\A 78\A 79\A 80\A 81\A 82\A 83\A 84\A 85\A 86\A 87\A 88\A 89\A 90\A 91\A 92\A 93\A 94\A 95\A 96\A 97\A 98\A 99\A";
294
295
  white-space: pre;
@@ -308,140 +309,203 @@
308
309
  width: 100%;
309
310
  }
310
311
  .drawer {
311
- display: grid;
312
- overflow: hidden;
312
+
313
+ display: grid;
314
+
315
+ width: 100%;
316
+
317
+ overflow: hidden;
318
+
319
+ height: 100vh;
320
+ height: 100svh;
313
321
  }
314
- /* max-height: 100vh; */
322
+
315
323
  .drawer.drawer-end {
316
324
  direction: rtl;
317
325
  }
326
+
318
327
  .drawer.drawer-end > * {
319
328
  direction: ltr;
320
329
  }
330
+
321
331
  .drawer.drawer-end .drawer-toggle ~ .drawer-side > .drawer-overlay + * {
322
- --tw-translate-x: 100%;
323
- transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
324
- justify-self: end;
332
+
333
+ --tw-translate-x: 100%;
334
+
335
+ transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
336
+
337
+ justify-self: end;
325
338
  }
339
+
326
340
  .drawer.drawer-end .drawer-toggle:checked ~ .drawer-side > .drawer-overlay + * {
327
- --tw-translate-x: 0px;
328
- transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
341
+
342
+ --tw-translate-x: 0px;
343
+
344
+ transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
345
+ }
346
+ :where(.drawer-toggle ~ .drawer-content) {
347
+ height: inherit;
329
348
  }
330
349
  .drawer-toggle {
331
- position: absolute;
332
- height: 0px;
333
- width: 0px;
334
- -webkit-appearance: none;
335
- appearance: none;
336
- opacity: 0;
350
+
351
+ position: absolute;
352
+
353
+ height: 0px;
354
+
355
+ width: 0px;
356
+
357
+ -webkit-appearance: none;
358
+
359
+ appearance: none;
360
+
361
+ opacity: 0;
337
362
  }
338
363
  .drawer-toggle ~ .drawer-content {
339
- z-index: 0;
340
- grid-column-start: 1;
341
- grid-row-start: 1;
342
- max-height: 100vh;
343
- overflow-y: auto;
364
+
365
+ z-index: 0;
366
+
367
+ grid-column-start: 1;
368
+
369
+ grid-row-start: 1;
370
+
371
+ overflow-y: auto;
344
372
  }
345
373
  .drawer-toggle ~ .drawer-side {
346
- grid-column-start: 1;
347
- grid-row-start: 1;
348
- display: grid;
349
- max-height: 100vh;
374
+
375
+ grid-column-start: 1;
376
+
377
+ grid-row-start: 1;
378
+
379
+ display: grid;
380
+
381
+ max-height: 100vh;
350
382
  }
351
383
  .drawer-toggle ~ .drawer-side > .drawer-overlay {
352
- visibility: hidden;
353
- grid-column-start: 1;
354
- grid-row-start: 1;
355
- opacity: 0;
384
+
385
+ visibility: hidden;
386
+
387
+ grid-column-start: 1;
388
+
389
+ grid-row-start: 1;
390
+
391
+ opacity: 0;
356
392
  }
357
393
  .drawer-toggle ~ .drawer-side > .drawer-overlay + * {
358
- z-index: 10;
359
- grid-column-start: 1;
360
- grid-row-start: 1;
361
- --tw-translate-x: -100%;
362
- transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
394
+
395
+ z-index: 10;
396
+
397
+ grid-column-start: 1;
398
+
399
+ grid-row-start: 1;
400
+
401
+ --tw-translate-x: -100%;
402
+
403
+ transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
363
404
  }
364
405
  .drawer-toggle:checked ~ .drawer-side {
365
- overflow-y: auto;
406
+
407
+ overflow-y: auto;
366
408
  }
367
409
  .drawer-toggle:checked ~ .drawer-side > .drawer-overlay {
368
- visibility: visible;
410
+
411
+ visibility: visible;
369
412
  }
370
413
  .drawer-toggle:checked ~ .drawer-side > .drawer-overlay + * {
371
- --tw-translate-x: 0px;
372
- transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
414
+
415
+ --tw-translate-x: 0px;
416
+
417
+ transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
373
418
  }
374
419
  [dir="rtl"] .drawer-toggle ~ .drawer-side > .drawer-overlay + * {
375
- --tw-translate-x: 100%;
376
- transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
420
+
421
+ --tw-translate-x: 100%;
422
+
423
+ transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
377
424
  }
378
425
  [dir="rtl"] .drawer-toggle:checked ~ .drawer-side > .drawer-overlay + * {
379
- --tw-translate-x: 0px;
380
- transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
426
+
427
+ --tw-translate-x: 0px;
428
+
429
+ transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
381
430
  }
382
431
  @media (min-width: 1024px) {
383
432
  .drawer-mobile {
384
433
  grid-auto-columns: max-content auto;
385
434
  }
386
435
  .drawer-mobile > .drawer-toggle ~ .drawer-content {
387
- height: auto;
388
- }
436
+
437
+ height: auto;
438
+ }
389
439
  @media (min-width: 1024px) {
390
- .drawer-mobile > .drawer-toggle ~ .drawer-content {
391
- grid-column-start: 2;
392
- }
440
+
441
+ .drawer-mobile > .drawer-toggle ~ .drawer-content {
442
+
443
+ grid-column-start: 2;
393
444
  }
445
+ }
394
446
  .drawer-mobile > .drawer-toggle ~ .drawer-side {
395
- overflow-y: auto;
396
- }
447
+
448
+ overflow-y: auto;
449
+ }
397
450
  @media (min-width: 1024px) {
398
- .drawer-mobile > .drawer-toggle ~ .drawer-side > .drawer-overlay {
399
- visibility: visible;
400
- }
451
+
452
+ .drawer-mobile > .drawer-toggle ~ .drawer-side > .drawer-overlay {
453
+
454
+ visibility: visible;
401
455
  }
456
+ }
402
457
  @media (min-width: 1024px) {
403
- .drawer-mobile > .drawer-toggle ~ .drawer-side > .drawer-overlay + * {
404
- --tw-translate-x: 0px;
405
- transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
406
- }
458
+
459
+ .drawer-mobile > .drawer-toggle ~ .drawer-side > .drawer-overlay + * {
460
+
461
+ --tw-translate-x: 0px;
462
+
463
+ transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
407
464
  }
465
+ }
408
466
  .drawer-mobile.drawer-end {
409
467
  grid-auto-columns: auto max-content;
410
468
  direction: ltr;
411
469
  }
412
470
  .drawer-mobile.drawer-end > .drawer-toggle ~ .drawer-content {
413
- height: auto;
414
- }
471
+
472
+ height: auto;
473
+ }
415
474
  @media (min-width: 1024px) {
416
- .drawer-mobile.drawer-end > .drawer-toggle ~ .drawer-content {
417
- grid-column-start: 1;
418
- }
475
+
476
+ .drawer-mobile.drawer-end > .drawer-toggle ~ .drawer-content {
477
+
478
+ grid-column-start: 1;
419
479
  }
480
+ }
420
481
  .drawer-mobile.drawer-end > .drawer-toggle ~ .drawer-side {
421
- overflow-y: auto;
422
- }
482
+
483
+ overflow-y: auto;
484
+ }
423
485
  @media (min-width: 1024px) {
424
- .drawer-mobile.drawer-end > .drawer-toggle ~ .drawer-side {
425
- grid-column-start: 2;
426
- }
486
+
487
+ .drawer-mobile.drawer-end > .drawer-toggle ~ .drawer-side {
488
+
489
+ grid-column-start: 2;
427
490
  }
491
+ }
428
492
  @media (min-width: 1024px) {
429
- .drawer-mobile.drawer-end > .drawer-toggle ~ .drawer-side > .drawer-overlay {
430
- visibility: visible;
431
- }
493
+
494
+ .drawer-mobile.drawer-end > .drawer-toggle ~ .drawer-side > .drawer-overlay {
495
+
496
+ visibility: visible;
432
497
  }
498
+ }
433
499
  @media (min-width: 1024px) {
434
- .drawer-mobile.drawer-end > .drawer-toggle ~ .drawer-side > .drawer-overlay + * {
435
- --tw-translate-x: 0px;
436
- transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
437
- }
500
+
501
+ .drawer-mobile.drawer-end > .drawer-toggle ~ .drawer-side > .drawer-overlay + * {
502
+
503
+ --tw-translate-x: 0px;
504
+
505
+ transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
438
506
  }
439
- }
440
- /* @supports (-webkit-touch-callout: none) {
441
- .drawer {
442
- max-height: -webkit-fill-available;
443
507
  }
444
- } */
508
+ }
445
509
  .dropdown {
446
510
  position: relative;
447
511
  display: inline-block
@@ -1237,6 +1301,58 @@
1237
1301
  color: hsl(var(--a) / var(--tw-text-opacity))
1238
1302
  }
1239
1303
 
1304
+ .btn-outline.btn-info .badge-outline {
1305
+
1306
+ --tw-border-opacity: 1;
1307
+
1308
+ border-color: hsl(var(--in) / var(--tw-border-opacity));
1309
+
1310
+ background-color: transparent;
1311
+
1312
+ --tw-text-opacity: 1;
1313
+
1314
+ color: hsl(var(--in) / var(--tw-text-opacity))
1315
+ }
1316
+
1317
+ .btn-outline.btn-success .badge-outline {
1318
+
1319
+ --tw-border-opacity: 1;
1320
+
1321
+ border-color: hsl(var(--su) / var(--tw-border-opacity));
1322
+
1323
+ background-color: transparent;
1324
+
1325
+ --tw-text-opacity: 1;
1326
+
1327
+ color: hsl(var(--su) / var(--tw-text-opacity))
1328
+ }
1329
+
1330
+ .btn-outline.btn-warning .badge-outline {
1331
+
1332
+ --tw-border-opacity: 1;
1333
+
1334
+ border-color: hsl(var(--wa) / var(--tw-border-opacity));
1335
+
1336
+ background-color: transparent;
1337
+
1338
+ --tw-text-opacity: 1;
1339
+
1340
+ color: hsl(var(--wa) / var(--tw-text-opacity))
1341
+ }
1342
+
1343
+ .btn-outline.btn-error .badge-outline {
1344
+
1345
+ --tw-border-opacity: 1;
1346
+
1347
+ border-color: hsl(var(--er) / var(--tw-border-opacity));
1348
+
1349
+ background-color: transparent;
1350
+
1351
+ --tw-text-opacity: 1;
1352
+
1353
+ color: hsl(var(--er) / var(--tw-text-opacity))
1354
+ }
1355
+
1240
1356
  .btn-outline:hover .badge {
1241
1357
 
1242
1358
  --tw-border-opacity: 1;
@@ -1700,12 +1816,12 @@
1700
1816
  .btn-group > input[type="radio"]:checked.btn:focus-visible, .btn-group > .btn-active:focus-visible {
1701
1817
  outline: 2px solid hsl(var(--p));
1702
1818
  }
1703
- .btn-group > .btn:not(:first-child) {
1819
+ .btn-group > .btn:not(:first-of-type) {
1704
1820
  margin-left: -1px;
1705
1821
  border-top-left-radius: 0px;
1706
1822
  border-bottom-left-radius: 0px;
1707
1823
  }
1708
- .btn-group > .btn:not(:last-child) {
1824
+ .btn-group > .btn:not(:last-of-type) {
1709
1825
  border-top-right-radius: 0px;
1710
1826
  border-bottom-right-radius: 0px;
1711
1827
  }
@@ -2361,7 +2477,7 @@ body[dir="rtl"] .checkbox:checked,
2361
2477
  --tw-border-opacity: 1;
2362
2478
  border-color: hsl(var(--p) / var(--tw-border-opacity));
2363
2479
  }
2364
- .menu[class*="p-"] li > * {
2480
+ .menu[class*=" p-"] li > *, .menu[class^="p-"] li > * {
2365
2481
  border-radius: var(--rounded-btn, 0.5rem);
2366
2482
  }
2367
2483
  .menu :where(li.bordered > *) {