daisyui 2.37.0 → 2.38.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 (13) hide show
  1. package/README.md +1 -1
  2. package/dist/full.css +1 -1
  3. package/dist/styled.css +57 -71
  4. package/dist/styled.js +1 -1
  5. package/dist/styled.rtl.js +1 -1
  6. package/dist/themes.css +62 -31
  7. package/dist/unstyled.css +16 -40
  8. package/dist/unstyled.js +1 -1
  9. package/dist/unstyled.rtl.js +1 -1
  10. package/dist/utilities-unstyled.js +1 -1
  11. package/dist/utilities.js +1 -1
  12. package/package.json +1 -1
  13. package/src/colors/themes.js +29 -0
package/dist/styled.css CHANGED
@@ -52,9 +52,7 @@
52
52
  display: inline-flex;
53
53
  align-items: center;
54
54
  justify-content: center;
55
- transition-property: color, background-color, border-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-text-decoration-color, -webkit-backdrop-filter;
56
55
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
57
- transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-text-decoration-color, -webkit-backdrop-filter;
58
56
  transition-duration: 200ms;
59
57
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
60
58
  height: 1.25rem;
@@ -106,23 +104,19 @@
106
104
  align-items: center
107
105
  }
108
106
  .breadcrumbs > ul > li > a:hover {
109
- -webkit-text-decoration-line: underline;
110
- text-decoration-line: underline
107
+ text-decoration-line: underline
111
108
  }
112
109
  .btn {
113
110
  display: inline-flex;
114
111
  flex-shrink: 0;
115
112
  cursor: pointer;
116
- -webkit-user-select: none;
117
- user-select: none;
113
+ user-select: none;
118
114
  flex-wrap: wrap;
119
115
  align-items: center;
120
116
  justify-content: center;
121
117
  border-color: transparent;
122
118
  text-align: center;
123
- transition-property: color, background-color, border-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-text-decoration-color, -webkit-backdrop-filter;
124
119
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
125
- transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-text-decoration-color, -webkit-backdrop-filter;
126
120
  transition-duration: 200ms;
127
121
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
128
122
  border-radius: var(--rounded-btn, 0.5rem);
@@ -202,8 +196,7 @@
202
196
  }.card {
203
197
  position: relative;
204
198
  display: flex;
205
- flex-direction: column;
206
- overflow: hidden
199
+ flex-direction: column
207
200
  }
208
201
  .card:focus {
209
202
  outline: 2px solid transparent;
@@ -589,9 +582,7 @@
589
582
  font-size: 0.875rem;
590
583
  line-height: 1.25rem;
591
584
  line-height: 2;
592
- transition-property: color, background-color, border-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-text-decoration-color, -webkit-backdrop-filter;
593
585
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
594
- transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-text-decoration-color, -webkit-backdrop-filter;
595
586
  transition-duration: 200ms;
596
587
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1)
597
588
  }
@@ -602,8 +593,7 @@
602
593
  min-height: 2.875rem;
603
594
  flex-shrink: 0;
604
595
  cursor: pointer;
605
- -webkit-user-select: none;
606
- user-select: none;
596
+ user-select: none;
607
597
  flex-wrap: wrap;
608
598
  align-items: center;
609
599
  justify-content: center;
@@ -613,9 +603,7 @@
613
603
  text-align: center;
614
604
  font-size: 0.875rem;
615
605
  line-height: 1.25rem;
616
- transition-property: color, background-color, border-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-text-decoration-color, -webkit-backdrop-filter;
617
606
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
618
- transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-text-decoration-color, -webkit-backdrop-filter;
619
607
  transition-duration: 200ms;
620
608
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
621
609
  line-height: 1em
@@ -651,8 +639,7 @@
651
639
  }
652
640
  .label {
653
641
  display: flex;
654
- -webkit-user-select: none;
655
- user-select: none;
642
+ user-select: none;
656
643
  align-items: center;
657
644
  justify-content: space-between
658
645
  }
@@ -691,9 +678,7 @@
691
678
  }
692
679
  .input {
693
680
  flex-shrink: 1;
694
- transition-property: color, background-color, border-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-text-decoration-color, -webkit-backdrop-filter;
695
681
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
696
- transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-text-decoration-color, -webkit-backdrop-filter;
697
682
  transition-duration: 200ms;
698
683
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
699
684
  height: 3rem;
@@ -712,7 +697,8 @@
712
697
  isolation: isolate;
713
698
  }
714
699
  .input-group > *,
715
- .input-group > .input {
700
+ .input-group > .input,
701
+ .input-group > .select {
716
702
  border-radius: 0px;
717
703
  }
718
704
  .input-group-md {
@@ -742,13 +728,13 @@
742
728
  padding-left: 1rem;
743
729
  padding-right: 1rem;
744
730
  }
745
- .input-group :first-child {
731
+ .input-group > :first-child {
746
732
  border-top-left-radius: var(--rounded-btn, 0.5rem);
747
733
  border-top-right-radius: 0;
748
734
  border-bottom-left-radius: var(--rounded-btn, 0.5rem);
749
735
  border-bottom-right-radius: 0;
750
736
  }
751
- .input-group :last-child {
737
+ .input-group > :last-child {
752
738
  border-top-left-radius: 0;
753
739
  border-top-right-radius: var(--rounded-btn, 0.5rem);
754
740
  border-bottom-left-radius: 0;
@@ -776,16 +762,13 @@
776
762
  }
777
763
  .link {
778
764
  cursor: pointer;
779
- -webkit-text-decoration-line: underline;
780
- text-decoration-line: underline
765
+ text-decoration-line: underline
781
766
  }
782
767
  .link-hover {
783
- -webkit-text-decoration-line: none;
784
- text-decoration-line: none
768
+ text-decoration-line: none
785
769
  }
786
770
  .link-hover:hover {
787
- -webkit-text-decoration-line: underline;
788
- text-decoration-line: underline
771
+ text-decoration-line: underline
789
772
  }
790
773
  .mask {
791
774
  -webkit-mask-size: contain;
@@ -832,8 +815,7 @@
832
815
  }
833
816
  .menu :where(li:not(.disabled):not(.menu-title)) > :where(*:not(ul)) {
834
817
  cursor: pointer;
835
- -webkit-user-select: none;
836
- user-select: none;
818
+ user-select: none;
837
819
  align-items: center;
838
820
  outline: 2px solid transparent;
839
821
  outline-offset: 2px
@@ -1007,8 +989,7 @@
1007
989
  display: inline-flex;
1008
990
  flex-shrink: 0;
1009
991
  cursor: pointer;
1010
- -webkit-user-select: none;
1011
- user-select: none;
992
+ user-select: none;
1012
993
  appearance: none;
1013
994
  height: 3rem;
1014
995
  padding-left: 1rem;
@@ -1103,9 +1084,7 @@
1103
1084
 
1104
1085
  display: inline-grid;
1105
1086
 
1106
- -webkit-user-select: none;
1107
-
1108
- user-select: none;
1087
+ user-select: none;
1109
1088
 
1110
1089
  place-content: center
1111
1090
  }
@@ -1151,8 +1130,7 @@
1151
1130
  position: relative;
1152
1131
  display: inline-flex;
1153
1132
  cursor: pointer;
1154
- -webkit-user-select: none;
1155
- user-select: none;
1133
+ user-select: none;
1156
1134
  flex-wrap: wrap;
1157
1135
  align-items: center;
1158
1136
  justify-content: center;
@@ -1175,9 +1153,7 @@
1175
1153
  }
1176
1154
  .textarea {
1177
1155
  flex-shrink: 1;
1178
- transition-property: color, background-color, border-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-text-decoration-color, -webkit-backdrop-filter;
1179
1156
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
1180
- transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-text-decoration-color, -webkit-backdrop-filter;
1181
1157
  transition-duration: 200ms;
1182
1158
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
1183
1159
  padding-left: 1rem;
@@ -1270,7 +1246,7 @@
1270
1246
  display: flex;
1271
1247
  overflow: hidden
1272
1248
  }
1273
- .avatar-group .avatar {
1249
+ .avatar-group :where(.avatar) {
1274
1250
  overflow: hidden;
1275
1251
  border-radius: 9999px;
1276
1252
  border-width: 4px;
@@ -1612,8 +1588,7 @@
1612
1588
  }.btn {
1613
1589
  font-weight: 600;
1614
1590
  text-transform: uppercase;
1615
- -webkit-text-decoration-line: none;
1616
- text-decoration-line: none;
1591
+ text-decoration-line: none;
1617
1592
  border-width: var(--border-btn, 1px);
1618
1593
  animation: button-pop var(--animation-btn, 0.25s) ease-out;
1619
1594
  text-transform: var(--btn-text-case, uppercase);
@@ -1631,8 +1606,7 @@
1631
1606
  background-color: hsl(var(--n) / var(--tw-bg-opacity));
1632
1607
  --tw-text-opacity: 1;
1633
1608
  color: hsl(var(--nc) / var(--tw-text-opacity));
1634
- -webkit-text-decoration-line: none;
1635
- text-decoration-line: none;
1609
+ text-decoration-line: none;
1636
1610
  }
1637
1611
  .btn:hover,
1638
1612
  .btn-active {
@@ -1803,15 +1777,13 @@
1803
1777
  background-color: transparent;
1804
1778
  --tw-text-opacity: 1;
1805
1779
  color: hsl(var(--p) / var(--tw-text-opacity));
1806
- -webkit-text-decoration-line: underline;
1807
- text-decoration-line: underline;
1780
+ text-decoration-line: underline;
1808
1781
  }
1809
1782
  .btn-link:hover,
1810
1783
  .btn-link.btn-active {
1811
1784
  border-color: transparent;
1812
1785
  background-color: transparent;
1813
- -webkit-text-decoration-line: underline;
1814
- text-decoration-line: underline;
1786
+ text-decoration-line: underline;
1815
1787
  }
1816
1788
  .btn-link:focus-visible {
1817
1789
  outline: 2px solid currentColor;
@@ -1823,7 +1795,8 @@
1823
1795
  --tw-text-opacity: 1;
1824
1796
  color: hsl(var(--bc) / var(--tw-text-opacity));
1825
1797
  }
1826
- .btn-outline:hover {
1798
+ .btn-outline:hover,
1799
+ .btn-outline.btn-active {
1827
1800
  --tw-border-opacity: 1;
1828
1801
  border-color: hsl(var(--bc) / var(--tw-border-opacity));
1829
1802
  --tw-bg-opacity: 1;
@@ -1835,7 +1808,8 @@
1835
1808
  --tw-text-opacity: 1;
1836
1809
  color: hsl(var(--p) / var(--tw-text-opacity));
1837
1810
  }
1838
- .btn-outline.btn-primary:hover {
1811
+ .btn-outline.btn-primary:hover,
1812
+ .btn-outline.btn-primary.btn-active {
1839
1813
  --tw-border-opacity: 1;
1840
1814
  border-color: hsl(var(--pf, var(--p)) / var(--tw-border-opacity));
1841
1815
  --tw-bg-opacity: 1;
@@ -1847,7 +1821,8 @@
1847
1821
  --tw-text-opacity: 1;
1848
1822
  color: hsl(var(--s) / var(--tw-text-opacity));
1849
1823
  }
1850
- .btn-outline.btn-secondary:hover {
1824
+ .btn-outline.btn-secondary:hover,
1825
+ .btn-outline.btn-secondary.btn-active {
1851
1826
  --tw-border-opacity: 1;
1852
1827
  border-color: hsl(var(--sf, var(--s)) / var(--tw-border-opacity));
1853
1828
  --tw-bg-opacity: 1;
@@ -1859,7 +1834,8 @@
1859
1834
  --tw-text-opacity: 1;
1860
1835
  color: hsl(var(--a) / var(--tw-text-opacity));
1861
1836
  }
1862
- .btn-outline.btn-accent:hover {
1837
+ .btn-outline.btn-accent:hover,
1838
+ .btn-outline.btn-accent.btn-active {
1863
1839
  --tw-border-opacity: 1;
1864
1840
  border-color: hsl(var(--af, var(--a)) / var(--tw-border-opacity));
1865
1841
  --tw-bg-opacity: 1;
@@ -1871,7 +1847,8 @@
1871
1847
  --tw-text-opacity: 1;
1872
1848
  color: hsl(var(--su) / var(--tw-text-opacity));
1873
1849
  }
1874
- .btn-outline.btn-success:hover {
1850
+ .btn-outline.btn-success:hover,
1851
+ .btn-outline.btn-success.btn-active {
1875
1852
  --tw-border-opacity: 1;
1876
1853
  border-color: hsl(var(--su) / var(--tw-border-opacity));
1877
1854
  --tw-bg-opacity: 1;
@@ -1883,7 +1860,8 @@
1883
1860
  --tw-text-opacity: 1;
1884
1861
  color: hsl(var(--in) / var(--tw-text-opacity));
1885
1862
  }
1886
- .btn-outline.btn-info:hover {
1863
+ .btn-outline.btn-info:hover,
1864
+ .btn-outline.btn-info.btn-active {
1887
1865
  --tw-border-opacity: 1;
1888
1866
  border-color: hsl(var(--in) / var(--tw-border-opacity));
1889
1867
  --tw-bg-opacity: 1;
@@ -1895,7 +1873,8 @@
1895
1873
  --tw-text-opacity: 1;
1896
1874
  color: hsl(var(--wa) / var(--tw-text-opacity));
1897
1875
  }
1898
- .btn-outline.btn-warning:hover {
1876
+ .btn-outline.btn-warning:hover,
1877
+ .btn-outline.btn-warning.btn-active {
1899
1878
  --tw-border-opacity: 1;
1900
1879
  border-color: hsl(var(--wa) / var(--tw-border-opacity));
1901
1880
  --tw-bg-opacity: 1;
@@ -1907,7 +1886,8 @@
1907
1886
  --tw-text-opacity: 1;
1908
1887
  color: hsl(var(--er) / var(--tw-text-opacity));
1909
1888
  }
1910
- .btn-outline.btn-error:hover {
1889
+ .btn-outline.btn-error:hover,
1890
+ .btn-outline.btn-error.btn-active {
1911
1891
  --tw-border-opacity: 1;
1912
1892
  border-color: hsl(var(--er) / var(--tw-border-opacity));
1913
1893
  --tw-bg-opacity: 1;
@@ -1967,6 +1947,20 @@
1967
1947
  }
1968
1948
  .card {
1969
1949
  border-radius: var(--rounded-box, 1rem);
1950
+ }
1951
+ .card :where(figure:first-child) {
1952
+ overflow: hidden;
1953
+ border-top-left-radius: inherit;
1954
+ border-top-right-radius: inherit;
1955
+ border-bottom-left-radius: unset;
1956
+ border-bottom-right-radius: unset;
1957
+ }
1958
+ .card :where(figure:last-child) {
1959
+ overflow: hidden;
1960
+ border-top-left-radius: unset;
1961
+ border-top-right-radius: unset;
1962
+ border-bottom-left-radius: inherit;
1963
+ border-bottom-right-radius: inherit;
1970
1964
  }
1971
1965
  .card:focus-visible {
1972
1966
  outline: 2px solid currentColor;
@@ -2012,6 +2006,10 @@
2012
2006
  z-index: 20;
2013
2007
  --tw-text-opacity: 1;
2014
2008
  color: hsl(var(--nc) / var(--tw-text-opacity));
2009
+ }
2010
+ .card.image-full :where(figure) {
2011
+ overflow: hidden;
2012
+ border-radius: inherit;
2015
2013
  }
2016
2014
  .carousel {
2017
2015
  -ms-overflow-style: none;
@@ -2431,9 +2429,7 @@
2431
2429
  --tw-scale-x: .95;
2432
2430
  --tw-scale-y: .95;
2433
2431
  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));
2434
- transition-property: color, background-color, border-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-text-decoration-color, -webkit-backdrop-filter;
2435
2432
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
2436
- transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-text-decoration-color, -webkit-backdrop-filter;
2437
2433
  transition-duration: 200ms;
2438
2434
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1)
2439
2435
  }
@@ -2476,8 +2472,7 @@
2476
2472
  text-transform: uppercase;
2477
2473
  --tw-text-opacity: 1;
2478
2474
  color: hsl(var(--nc) / var(--tw-text-opacity));
2479
- -webkit-text-decoration-line: none;
2480
- text-decoration-line: none;
2475
+ text-decoration-line: none;
2481
2476
  border-width: var(--border-btn, 1px);
2482
2477
  animation: button-pop var(--animation-btn, 0.25s) ease-out;
2483
2478
  text-transform: var(--btn-text-case, uppercase);
@@ -2979,8 +2974,7 @@
2979
2974
  --tw-bg-opacity: 0.1;
2980
2975
  }
2981
2976
  .menu li.disabled > * {
2982
- -webkit-user-select: none;
2983
- user-select: none;
2977
+ user-select: none;
2984
2978
  color: hsl(var(--bc) / var(--tw-text-opacity));
2985
2979
  --tw-text-opacity: 0.2;
2986
2980
  }
@@ -3015,9 +3009,7 @@
3015
3009
  .menu :where(li:not(.disabled)) > :where(*:not(ul)) {
3016
3010
  outline: 2px solid transparent;
3017
3011
  outline-offset: 2px;
3018
- transition-property: color, background-color, border-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-text-decoration-color, -webkit-backdrop-filter;
3019
3012
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
3020
- transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-text-decoration-color, -webkit-backdrop-filter;
3021
3013
  transition-duration: 200ms;
3022
3014
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
3023
3015
  }
@@ -3204,9 +3196,7 @@
3204
3196
  --tw-bg-opacity: 1;
3205
3197
  background-color: hsl(var(--b1) / var(--tw-bg-opacity));
3206
3198
  padding: 1.5rem;
3207
- transition-property: color, background-color, border-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-text-decoration-color, -webkit-backdrop-filter;
3208
3199
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
3209
- transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-text-decoration-color, -webkit-backdrop-filter;
3210
3200
  transition-duration: 200ms;
3211
3201
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
3212
3202
  width: 91.666667%;
@@ -3693,9 +3683,7 @@
3693
3683
  background-color: hsl(var(--b1) / var(--tw-bg-opacity));
3694
3684
  padding-right: 2.5rem;
3695
3685
  font-weight: 600;
3696
- transition-property: color, background-color, border-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-text-decoration-color, -webkit-backdrop-filter;
3697
3686
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
3698
- transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-text-decoration-color, -webkit-backdrop-filter;
3699
3687
  transition-duration: 200ms;
3700
3688
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
3701
3689
  border-radius: var(--rounded-btn, 0.5rem);
@@ -4481,9 +4469,7 @@
4481
4469
  .tooltip:before,
4482
4470
  .tooltip:after {
4483
4471
  opacity: 0;
4484
- transition-property: color, background-color, border-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-text-decoration-color, -webkit-backdrop-filter;
4485
4472
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
4486
- transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-text-decoration-color, -webkit-backdrop-filter;
4487
4473
  transition-delay: 100ms;
4488
4474
  transition-duration: 200ms;
4489
4475
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);