daisyui 3.6.6 → 3.7.1

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 (8) hide show
  1. package/dist/full.css +32 -33
  2. package/dist/styled.css +34 -36
  3. package/dist/styled.js +1 -1
  4. package/dist/styled.rtl.js +1 -1
  5. package/dist/unstyled.css +9 -11
  6. package/dist/unstyled.js +1 -1
  7. package/dist/unstyled.rtl.js +1 -1
  8. package/package.json +1 -1
package/dist/full.css CHANGED
@@ -1957,11 +1957,11 @@ html {
1957
1957
  .collapse:not(.collapse-close):has(> input[type="checkbox"]:checked),
1958
1958
  .collapse:not(.collapse-close):has(> input[type="radio"]:checked) {
1959
1959
  grid-template-rows: auto 1fr}
1960
- .collapse[open] .collapse-content,
1961
- .collapse-open .collapse-content,
1962
- .collapse:focus:not(.collapse-close) .collapse-content,
1963
- .collapse:not(.collapse-close) input[type="checkbox"]:checked ~ .collapse-content,
1964
- .collapse:not(.collapse-close) input[type="radio"]:checked ~ .collapse-content {
1960
+ .collapse[open] > .collapse-content,
1961
+ .collapse-open > .collapse-content,
1962
+ .collapse:focus:not(.collapse-close) > .collapse-content,
1963
+ .collapse:not(.collapse-close) > input[type="checkbox"]:checked ~ .collapse-content,
1964
+ .collapse:not(.collapse-close) > input[type="radio"]:checked ~ .collapse-content {
1965
1965
  visibility: visible;
1966
1966
  min-height: fit-content}
1967
1967
  :root .countdown {
@@ -2042,7 +2042,7 @@ html {
2042
2042
  transition-duration: 300ms;
2043
2043
  transform: translateX(-100%)}
2044
2044
  [dir="rtl"] .drawer-side > *:not(.drawer-overlay) {
2045
- transform: translateX(100%)}
2045
+ transform: translateX(-100%)}
2046
2046
  .drawer-toggle {
2047
2047
  position: fixed;
2048
2048
  height: 0px;
@@ -2059,11 +2059,10 @@ html {
2059
2059
  .drawer-end .drawer-toggle ~ .drawer-content {
2060
2060
  grid-column-start: 1}
2061
2061
  .drawer-end .drawer-toggle ~ .drawer-side {
2062
+ grid-column-start: 2;
2062
2063
  justify-items: end}
2063
2064
  .drawer-end .drawer-toggle ~ .drawer-side > *:not(.drawer-overlay) {
2064
2065
  transform: translateX(100%)}
2065
- [dir="rtl"] .drawer-end .drawer-toggle ~ .drawer-side > *:not(.drawer-overlay) {
2066
- transform: translateX(-100%)}
2067
2066
  .drawer-end .drawer-toggle:checked ~ .drawer-side > *:not(.drawer-overlay) {
2068
2067
  transform: translateX(0%)}
2069
2068
  .dropdown {
@@ -2792,7 +2791,7 @@ html {
2792
2791
  background-image: linear-gradient(45deg, transparent 50%, currentColor 50%),
2793
2792
  linear-gradient(135deg, currentColor 50%, transparent 50%);
2794
2793
  background-position: calc(100% - 20px) calc(1px + 50%),
2795
- calc(100% - 16px) calc(1px + 50%);
2794
+ calc(100% - 16.1px) calc(1px + 50%);
2796
2795
  background-size: 4px 4px,
2797
2796
  4px 4px;
2798
2797
  background-repeat: no-repeat}
@@ -3711,7 +3710,7 @@ details.collapse summary::-webkit-details-marker {
3711
3710
  outline-width: 2px;
3712
3711
  outline-offset: 2px;
3713
3712
  outline-color: hsl(var(--bc) / 1)}
3714
- .collapse-arrow .collapse-title:after {
3713
+ .collapse-arrow > .collapse-title:after {
3715
3714
  position: absolute;
3716
3715
  display: block;
3717
3716
  height: 0.5rem;
@@ -3730,9 +3729,9 @@ details.collapse summary::-webkit-details-marker {
3730
3729
  transform-origin: 75% 75%;
3731
3730
  box-shadow: 2px 2px;
3732
3731
  pointer-events: none}
3733
- [dir="rtl"] .collapse-arrow .collapse-title:after {
3732
+ [dir="rtl"] .collapse-arrow > .collapse-title:after {
3734
3733
  --tw-rotate: -45deg}
3735
- .collapse-plus .collapse-title:after {
3734
+ .collapse-plus > .collapse-title:after {
3736
3735
  position: absolute;
3737
3736
  display: block;
3738
3737
  height: 0.5rem;
@@ -3745,11 +3744,11 @@ details.collapse summary::-webkit-details-marker {
3745
3744
  right: 1.4rem;
3746
3745
  content: "+";
3747
3746
  pointer-events: none}
3748
- .collapse:not(.collapse-open):not(.collapse-close) input[type="checkbox"],
3749
- .collapse:not(.collapse-open):not(.collapse-close) input[type="radio"]:not(:checked),
3750
- .collapse:not(.collapse-open):not(.collapse-close) .collapse-title {
3747
+ .collapse:not(.collapse-open):not(.collapse-close) > input[type="checkbox"],
3748
+ .collapse:not(.collapse-open):not(.collapse-close) > input[type="radio"]:not(:checked),
3749
+ .collapse:not(.collapse-open):not(.collapse-close) > .collapse-title {
3751
3750
  cursor: pointer}
3752
- .collapse:focus:not(.collapse-open):not(.collapse-close):not(.collapse[open]) .collapse-title {
3751
+ .collapse:focus:not(.collapse-open):not(.collapse-close):not(.collapse[open]) > .collapse-title {
3753
3752
  cursor: unset}
3754
3753
  .collapse-title {
3755
3754
  position: relative}
@@ -3764,35 +3763,35 @@ details.collapse summary::-webkit-details-marker {
3764
3763
  padding-right: 3rem;
3765
3764
  min-height: 3.75rem;
3766
3765
  transition: background-color 0.2s ease-out}
3767
- .collapse[open] :where(.collapse-content),
3768
- .collapse-open :where(.collapse-content),
3769
- .collapse:focus:not(.collapse-close) :where(.collapse-content),
3770
- .collapse:not(.collapse-close) :where(input[type="checkbox"]:checked ~ .collapse-content),
3771
- .collapse:not(.collapse-close) :where(input[type="radio"]:checked ~ .collapse-content) {
3766
+ .collapse[open] > :where(.collapse-content),
3767
+ .collapse-open > :where(.collapse-content),
3768
+ .collapse:focus:not(.collapse-close) > :where(.collapse-content),
3769
+ .collapse:not(.collapse-close) > :where(input[type="checkbox"]:checked ~ .collapse-content),
3770
+ .collapse:not(.collapse-close) > :where(input[type="radio"]:checked ~ .collapse-content) {
3772
3771
  padding-bottom: 1rem;
3773
3772
  transition: padding 0.2s ease-out,
3774
3773
  background-color 0.2s ease-out}
3775
- .collapse[open].collapse-arrow .collapse-title:after,
3776
- .collapse-open.collapse-arrow .collapse-title:after,
3777
- .collapse-arrow:focus:not(.collapse-close) .collapse-title:after,
3778
- .collapse-arrow:not(.collapse-close) input[type="checkbox"]:checked ~ .collapse-title:after,
3779
- .collapse-arrow:not(.collapse-close) input[type="radio"]:checked ~ .collapse-title:after {
3774
+ .collapse[open].collapse-arrow > .collapse-title:after,
3775
+ .collapse-open.collapse-arrow > .collapse-title:after,
3776
+ .collapse-arrow:focus:not(.collapse-close) > .collapse-title:after,
3777
+ .collapse-arrow:not(.collapse-close) > input[type="checkbox"]:checked ~ .collapse-title:after,
3778
+ .collapse-arrow:not(.collapse-close) > input[type="radio"]:checked ~ .collapse-title:after {
3780
3779
  --tw-translate-y: -50%;
3781
3780
  --tw-rotate: 225deg;
3782
3781
  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))}
3783
- [dir="rtl"] .collapse[open].collapse-arrow .collapse-title:after,
3784
- [dir="rtl"] .collapse-open.collapse-arrow .collapse-title:after,
3782
+ [dir="rtl"] .collapse[open].collapse-arrow > .collapse-title:after,
3783
+ [dir="rtl"] .collapse-open.collapse-arrow > .collapse-title:after,
3785
3784
  [dir="rtl"] .collapse-arrow:focus:not(.collapse-close) .collapse-title:after,
3786
3785
  [dir="rtl"]
3787
3786
  .collapse-arrow:not(.collapse-close)
3788
3787
  input[type="checkbox"]:checked
3789
3788
  ~ .collapse-title:after {
3790
3789
  --tw-rotate: 135deg}
3791
- .collapse[open].collapse-plus .collapse-title:after,
3792
- .collapse-open.collapse-plus .collapse-title:after,
3793
- .collapse-plus:focus:not(.collapse-close) .collapse-title:after,
3794
- .collapse-plus:not(.collapse-close) input[type="checkbox"]:checked ~ .collapse-title:after,
3795
- .collapse-plus:not(.collapse-close) input[type="radio"]:checked ~ .collapse-title:after {
3790
+ .collapse[open].collapse-plus > .collapse-title:after,
3791
+ .collapse-open.collapse-plus > .collapse-title:after,
3792
+ .collapse-plus:focus:not(.collapse-close) > .collapse-title:after,
3793
+ .collapse-plus:not(.collapse-close) > input[type="checkbox"]:checked ~ .collapse-title:after,
3794
+ .collapse-plus:not(.collapse-close) > input[type="radio"]:checked ~ .collapse-title:after {
3796
3795
  content: "−"}
3797
3796
  .divider:before {
3798
3797
  background-color: hsl(var(--bc) / var(--tw-bg-opacity));
package/dist/styled.css CHANGED
@@ -367,11 +367,11 @@
367
367
  .collapse:not(.collapse-close):has(> input[type="radio"]:checked) {
368
368
  grid-template-rows: auto 1fr;
369
369
  }
370
- .collapse[open] .collapse-content,
371
- .collapse-open .collapse-content,
372
- .collapse:focus:not(.collapse-close) .collapse-content,
373
- .collapse:not(.collapse-close) input[type="checkbox"]:checked ~ .collapse-content,
374
- .collapse:not(.collapse-close) input[type="radio"]:checked ~ .collapse-content {
370
+ .collapse[open] > .collapse-content,
371
+ .collapse-open > .collapse-content,
372
+ .collapse:focus:not(.collapse-close) > .collapse-content,
373
+ .collapse:not(.collapse-close) > input[type="checkbox"]:checked ~ .collapse-content,
374
+ .collapse:not(.collapse-close) > input[type="radio"]:checked ~ .collapse-content {
375
375
  visibility: visible;
376
376
  min-height: fit-content;
377
377
  }
@@ -453,7 +453,7 @@
453
453
  transform: translateX(-100%);
454
454
  }
455
455
  [dir="rtl"] .drawer-side > *:not(.drawer-overlay) {
456
- transform: translateX(100%);
456
+ transform: translateX(-100%);
457
457
  }
458
458
  .drawer-toggle {
459
459
  position: fixed;
@@ -476,14 +476,12 @@
476
476
  grid-column-start: 1;
477
477
  }
478
478
  .drawer-end .drawer-toggle ~ .drawer-side {
479
+ grid-column-start: 2;
479
480
  justify-items: end;
480
481
  }
481
482
  .drawer-end .drawer-toggle ~ .drawer-side > *:not(.drawer-overlay) {
482
- transform: translateX(100%);
483
- }
484
- [dir="rtl"] .drawer-end .drawer-toggle ~ .drawer-side > *:not(.drawer-overlay) {
485
- transform: translateX(-100%);
486
- }
483
+ transform: translateX(100%);
484
+ }
487
485
  .drawer-end .drawer-toggle:checked ~ .drawer-side > *:not(.drawer-overlay) {
488
486
  transform: translateX(0%);
489
487
  }
@@ -2435,7 +2433,7 @@ details.collapse summary {
2435
2433
  outline-offset: 2px;
2436
2434
  outline-color: hsl(var(--bc) / 1);
2437
2435
  }
2438
- .collapse-arrow .collapse-title:after {
2436
+ .collapse-arrow > .collapse-title:after {
2439
2437
  position: absolute;
2440
2438
  display: block;
2441
2439
  height: 0.5rem;
@@ -2455,10 +2453,10 @@ details.collapse summary {
2455
2453
  box-shadow: 2px 2px;
2456
2454
  pointer-events: none;
2457
2455
  }
2458
- [dir="rtl"] .collapse-arrow .collapse-title:after {
2456
+ [dir="rtl"] .collapse-arrow > .collapse-title:after {
2459
2457
  --tw-rotate: -45deg;
2460
2458
  }
2461
- .collapse-plus .collapse-title:after {
2459
+ .collapse-plus > .collapse-title:after {
2462
2460
  position: absolute;
2463
2461
  display: block;
2464
2462
  height: 0.5rem;
@@ -2472,12 +2470,12 @@ details.collapse summary {
2472
2470
  content: "+";
2473
2471
  pointer-events: none;
2474
2472
  }
2475
- .collapse:not(.collapse-open):not(.collapse-close) input[type="checkbox"],
2476
- .collapse:not(.collapse-open):not(.collapse-close) input[type="radio"]:not(:checked),
2477
- .collapse:not(.collapse-open):not(.collapse-close) .collapse-title {
2473
+ .collapse:not(.collapse-open):not(.collapse-close) > input[type="checkbox"],
2474
+ .collapse:not(.collapse-open):not(.collapse-close) > input[type="radio"]:not(:checked),
2475
+ .collapse:not(.collapse-open):not(.collapse-close) > .collapse-title {
2478
2476
  cursor: pointer;
2479
2477
  }
2480
- .collapse:focus:not(.collapse-open):not(.collapse-close):not(.collapse[open]) .collapse-title {
2478
+ .collapse:focus:not(.collapse-open):not(.collapse-close):not(.collapse[open]) > .collapse-title {
2481
2479
  cursor: unset;
2482
2480
  }
2483
2481
  .collapse-title {
@@ -2504,27 +2502,27 @@ details.collapse summary {
2504
2502
  padding 0.2s ease-out,
2505
2503
  background-color 0.2s ease-out;
2506
2504
  }
2507
- .collapse[open] :where(.collapse-content),
2508
- .collapse-open :where(.collapse-content),
2509
- .collapse:focus:not(.collapse-close) :where(.collapse-content),
2510
- .collapse:not(.collapse-close) :where(input[type="checkbox"]:checked ~ .collapse-content),
2511
- .collapse:not(.collapse-close) :where(input[type="radio"]:checked ~ .collapse-content) {
2505
+ .collapse[open] > :where(.collapse-content),
2506
+ .collapse-open > :where(.collapse-content),
2507
+ .collapse:focus:not(.collapse-close) > :where(.collapse-content),
2508
+ .collapse:not(.collapse-close) > :where(input[type="checkbox"]:checked ~ .collapse-content),
2509
+ .collapse:not(.collapse-close) > :where(input[type="radio"]:checked ~ .collapse-content) {
2512
2510
  padding-bottom: 1rem;
2513
2511
  transition:
2514
2512
  padding 0.2s ease-out,
2515
2513
  background-color 0.2s ease-out;
2516
2514
  }
2517
- .collapse[open].collapse-arrow .collapse-title:after,
2518
- .collapse-open.collapse-arrow .collapse-title:after,
2519
- .collapse-arrow:focus:not(.collapse-close) .collapse-title:after,
2520
- .collapse-arrow:not(.collapse-close) input[type="checkbox"]:checked ~ .collapse-title:after,
2521
- .collapse-arrow:not(.collapse-close) input[type="radio"]:checked ~ .collapse-title:after {
2515
+ .collapse[open].collapse-arrow > .collapse-title:after,
2516
+ .collapse-open.collapse-arrow > .collapse-title:after,
2517
+ .collapse-arrow:focus:not(.collapse-close) > .collapse-title:after,
2518
+ .collapse-arrow:not(.collapse-close) > input[type="checkbox"]:checked ~ .collapse-title:after,
2519
+ .collapse-arrow:not(.collapse-close) > input[type="radio"]:checked ~ .collapse-title:after {
2522
2520
  --tw-translate-y: -50%;
2523
2521
  --tw-rotate: 225deg;
2524
2522
  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));
2525
2523
  }
2526
- [dir="rtl"] .collapse[open].collapse-arrow .collapse-title:after,
2527
- [dir="rtl"] .collapse-open.collapse-arrow .collapse-title:after,
2524
+ [dir="rtl"] .collapse[open].collapse-arrow > .collapse-title:after,
2525
+ [dir="rtl"] .collapse-open.collapse-arrow > .collapse-title:after,
2528
2526
  [dir="rtl"] .collapse-arrow:focus:not(.collapse-close) .collapse-title:after,
2529
2527
  [dir="rtl"]
2530
2528
  .collapse-arrow:not(.collapse-close)
@@ -2532,11 +2530,11 @@ details.collapse summary {
2532
2530
  ~ .collapse-title:after {
2533
2531
  --tw-rotate: 135deg;
2534
2532
  }
2535
- .collapse[open].collapse-plus .collapse-title:after,
2536
- .collapse-open.collapse-plus .collapse-title:after,
2537
- .collapse-plus:focus:not(.collapse-close) .collapse-title:after,
2538
- .collapse-plus:not(.collapse-close) input[type="checkbox"]:checked ~ .collapse-title:after,
2539
- .collapse-plus:not(.collapse-close) input[type="radio"]:checked ~ .collapse-title:after {
2533
+ .collapse[open].collapse-plus > .collapse-title:after,
2534
+ .collapse-open.collapse-plus > .collapse-title:after,
2535
+ .collapse-plus:focus:not(.collapse-close) > .collapse-title:after,
2536
+ .collapse-plus:not(.collapse-close) > input[type="checkbox"]:checked ~ .collapse-title:after,
2537
+ .collapse-plus:not(.collapse-close) > input[type="radio"]:checked ~ .collapse-title:after {
2540
2538
  content: "−";
2541
2539
  }
2542
2540
  .countdown > *:before {
@@ -3999,7 +3997,7 @@ details.collapse summary {
3999
3997
  linear-gradient(135deg, currentColor 50%, transparent 50%);
4000
3998
  background-position:
4001
3999
  calc(100% - 20px) calc(1px + 50%),
4002
- calc(100% - 16px) calc(1px + 50%);
4000
+ calc(100% - 16.1px) calc(1px + 50%);
4003
4001
  background-size:
4004
4002
  4px 4px,
4005
4003
  4px 4px;