daisyui 4.0.0-alpha.10 → 4.0.0-alpha.12

package/README.md

@@ -38,7 +38,7 @@ Then add daisyUI to your `tailwind.config.js`:
 ```js
 module.exports = {
   plugins: [require("daisyui")],
-};
+}
 ```
 
 [ [Read more →][docs-url-install] ]

package/dist/full.css

@@ -220,9 +220,9 @@
     --p: 0.7666 0.1354 153.45;
     --pc: 0.3339 0.0406 162.2401;
     --s: 0.613 0.2024 261.2942;
-    --sc: 0.9846 0.0017 247.8389;
-    --a: 0.6413 0.1932 33.1151;
-    --ac: 0.9846 0.0017 247.8389;
+    --sc: 1 0 0;
+    --a: 0.7277 0.1498 33.2004;
+    --ac: 0 0 0;
     --n: 0.3552 0.0321 262.9886;
     --nc: 0.9846 0.0017 247.8389;
     --b1: 1 0 0;
@@ -302,7 +302,7 @@
     --inc: 0.9092 0.043 262.8809;
     --suc: 0.1254 0.034 149.2138;
     --wac: 0.1332 0.0315 58.3183;
-    --erc: 0.9154 0.043 27.325;
+    --erc: 0.1314 0.0398 27.33;
     --animation-btn: 0.25s;
     --animation-input: .2s;
     --btn-text-case: uppercase;
@@ -325,7 +325,7 @@
     --in: 0.5461 0.2152 262.8809;
     --su: 0.6271 0.1699 149.2138;
     --wa: 0.6658 0.1574 58.3183;
-    --er: 0.5771 0.2152 27.325;
+    --er: 0.6572 0.199 27.33;
     --rounded-box: 0.4rem;
     --rounded-btn: 0.4rem;
     --rounded-badge: 0.4rem
@@ -374,7 +374,7 @@
     --inc: 0.9092 0.043 262.8809;
     --suc: 0.1254 0.034 149.2138;
     --wac: 0.1332 0.0315 58.3183;
-    --erc: 0.9154 0.043 27.325;
+    --erc: 0.1461 0.0414 27.33;
     --rounded-box: 1rem;
     --rounded-badge: 1.9rem;
     --animation-btn: 0.25s;
@@ -394,7 +394,7 @@
     --in: 0.5461 0.2152 262.8809;
     --su: 0.6271 0.1699 149.2138;
     --wa: 0.6658 0.1574 58.3183;
-    --er: 0.5771 0.2152 27.325;
+    --er: 0.7307 0.207 27.33;
     --rounded-btn: 1.9rem
 }
 [data-theme=halloween] {
@@ -407,7 +407,7 @@
     --inc: 0.9092 0.043 262.8809;
     --suc: 0.1254 0.034 149.2138;
     --wac: 0.1332 0.0315 58.3183;
-    --erc: 0.9154 0.043 27.325;
+    --erc: 0.1314 0.0398 27.33;
     --rounded-box: 1rem;
     --rounded-btn: 0.5rem;
     --rounded-badge: 1.9rem;
@@ -418,7 +418,7 @@
     --border-btn: 1px;
     --tab-border: 1px;
     --tab-radius: 0.5rem;
-    --p: 0.7342 0.1655 60.6166;
+    --p: 0.7748 0.204 60.62;
     --pc: 0.1969 0.0047 196.7794;
     --s: 0.4606 0.1554 305.0254;
     --a: 0.6511 0.1939 136.0735;
@@ -428,7 +428,7 @@
     --in: 0.5461 0.2152 262.8809;
     --su: 0.6271 0.1699 149.2138;
     --wa: 0.6658 0.1574 58.3183;
-    --er: 0.5771 0.2152 27.325
+    --er: 0.6572 0.199 27.33
 }
 [data-theme=garden] {
     color-scheme: light;
@@ -507,7 +507,7 @@
     --inc: 0.9092 0.043 262.8809;
     --suc: 0.1254 0.034 149.2138;
     --wac: 0.1332 0.0315 58.3183;
-    --erc: 0.9154 0.043 27.325;
+    --erc: 0.1479 0.038 27.33;
     --rounded-box: 1rem;
     --rounded-btn: 0.5rem;
     --rounded-badge: 1.9rem;
@@ -527,10 +527,14 @@
     --in: 0.5461 0.2152 262.8809;
     --su: 0.6271 0.1699 149.2138;
     --wa: 0.6658 0.1574 58.3183;
-    --er: 0.5771 0.2152 27.325
+    --er: 0.7395 0.19 27.33
 }
 [data-theme=lofi] {
     color-scheme: light;
+    --inc: 0.1591 0.0206 205.9;
+    --suc: 0.1803 0.0306 164.14;
+    --wac: 0.1767 0.027 79.94;
+    --erc: 0.1573 0.03 28.47;
     --btn-text-case: uppercase;
     --border-btn: 1px;
     --tab-border: 1px;
@@ -546,14 +550,10 @@
     --b2: 0.9612 0 0;
     --b3: 0.9227 0.0011 17.1793;
     --bc: 0 0 0;
-    --in: 0.5731 0.2145 258.2467;
-    --inc: 1 0 0;
-    --su: 0.7394 0.211 146.977;
-    --suc: 0 0 0;
-    --wa: 0.6955 0.1949 27.8924;
-    --wac: 1 0 0;
-    --er: 0.5989 0.2354 352.5117;
-    --erc: 1 0 0;
+    --in: 0.7954 0.103 205.9;
+    --su: 0.9013 0.153 164.14;
+    --wa: 0.8837 0.135 79.94;
+    --er: 0.7866 0.15 28.47;
     --rounded-box: 0.25rem;
     --rounded-btn: 0.125rem;
     --rounded-badge: 0.125rem;
@@ -645,7 +645,7 @@
     --btn-focus-scale: 0.95;
     --border-btn: 1px;
     --tab-border: 1px;
-    font-family: Chalkboard,comic sans ms,"sanssecondaryerif";
+    font-family: Chalkboard,comic sans ms,'sans-serif';
     --p: 0.7826 0 0;
     --s: 0.7826 0 0;
     --a: 0.7826 0 0;
@@ -806,7 +806,7 @@
     --inc: 0.1384 0.0196 207.2842;
     --suc: 0.122 0.016 174.6162;
     --wac: 0.1402 0.033 56.8443;
-    --erc: 0.9155 0.0446 24.1624;
+    --erc: 0.9061 0.0482 24.16;
     --rounded-box: 1rem;
     --rounded-btn: 0.5rem;
     --rounded-badge: 1.9rem;
@@ -825,7 +825,7 @@
     --in: 0.6922 0.098 207.2842;
     --su: 0.61 0.0802 174.6162;
     --wa: 0.7008 0.1649 56.8443;
-    --er: 0.5774 0.2229 24.1624
+    --er: 0.5307 0.241 24.16
 }
 [data-theme=business] {
     color-scheme: dark;
@@ -865,14 +865,14 @@
     --b2: 0.9161 0 0;
     --b3: 0.8472 0 0;
     --bc: 0.197 0 0;
-    --pc: 0.1391 0.0631 330.7596;
-    --sc: 0.1429 0.0388 48.2509;
-    --ac: 0.1851 0.0453 122.963;
-    --nc: 0.848 0.0138 278.6813;
-    --inc: 0.1317 0.0342 252.0536;
-    --suc: 0.1517 0.0255 158.5317;
-    --wac: 0.1789 0.0354 100.495;
-    --erc: 0.9163 0.0476 29.3492;
+    --pc: 0.1438 0.0714 330.7596;
+    --sc: 0.1467 0.0448 48.2509;
+    --ac: 0.1856 0.0528 122.963;
+    --nc: 0.8426 0.0256 278.68;
+    --inc: 0.1214 0.0454 252.05;
+    --suc: 0.1714 0.0532 158.53;
+    --wac: 0.182 0.0424 100.5;
+    --erc: 0.1297 0.0586 29.3492;
     --animation-btn: 0.25s;
     --animation-input: .2s;
     --btn-text-case: uppercase;
@@ -880,15 +880,15 @@
     --border-btn: 1px;
     --tab-border: 1px;
     --tab-radius: 0.5rem;
-    --p: 0.6953 0.3157 330.7596;
-    --s: 0.7144 0.1938 48.2509;
-    --a: 0.9256 0.2266 122.963;
-    --n: 0.2402 0.069 278.6813;
+    --p: 0.719 0.357 330.7596;
+    --s: 0.7337 0.224 48.2509;
+    --a: 0.9278 0.264 122.963;
+    --n: 0.2131 0.128 278.68;
     --b1: 0.9851 0 0;
-    --in: 0.6587 0.1711 252.0536;
-    --su: 0.7583 0.1277 158.5317;
-    --wa: 0.8944 0.1768 100.495;
-    --er: 0.5814 0.2378 29.3492;
+    --in: 0.6072 0.227 252.05;
+    --su: 0.8572 0.266 158.53;
+    --wa: 0.9101 0.212 100.5;
+    --er: 0.6484 0.293 29.3492;
     --rounded-box: 1.25rem;
     --rounded-btn: 1rem;
     --rounded-badge: 1rem
@@ -986,7 +986,7 @@
     --a: 0.4262 0.0744 224.3892;
     --n: 0.1651 0.0157 326.2614;
     --b1: 0.2168 0.0231 329.7086;
-    --bc: 0.5413 0.0188 79.2715;
+    --bc: 0.7235 0.0928 79.1294;
     --in: 0.7949 0.0639 184.5584;
     --su: 0.7472 0.0725 131.1163;
     --wa: 0.8815 0.1408 87.7224;
@@ -2093,7 +2093,7 @@ html {
         --glass-opacity: 25%;
         --glass-border-opacity: 15%}
     .btn-ghost:hover {
-        --tw-border-opacity: 0;
+        border-color: transparent;
         background-color: oklch(var(--bc) / var(--tw-bg-opacity));
         --tw-bg-opacity: 0.2}
     .btn-link:hover {
@@ -2877,27 +2877,27 @@ input.tab:checked + .tab-content,
 :where(.timeline > li) {
     position: relative;
     display: grid;
+    flex-shrink: 0;
     align-items: center;
-    grid-template-rows: var(--timeline-row-start, 1fr) auto var(--timeline-row-end, 1fr);
-    grid-template-columns: var(--timeline-col-start, 1fr) auto var(--timeline-col-end, 1fr)}
-:where(.timeline:not(:has(.timeline-start)) > li) {
-    --timeline-row-start: min-content}
-:where(.timeline:not(:has(.timeline-end)) > li) {
-    --timeline-row-end: min-content}
-:where(.timeline:not(:has(.timeline-start)):not(:has(.timeline-end)) li) {
-    --timeline-row-start: min-content;
-    --timeline-row-end: min-content}
+    grid-template-rows: var(--timeline-row-start, minmax(0, 1fr)) auto var(
+      --timeline-row-end,
+      minmax(0, 1fr)
+    );
+    grid-template-columns: var(--timeline-col-start, minmax(0, 1fr)) auto var(
+      --timeline-col-end,
+      minmax(0, 1fr)
+    )}
 .timeline > li > hr {
     width: 100%;
     border-width: 0px}
-.timeline-snap-icon > li {
-    --timeline-col-start: 0.5rem}
 :where(.timeline > li > hr):first-child {
     grid-column-start: 1;
     grid-row-start: 2}
 :where(.timeline > li > hr):last-child {
     grid-column-start: 3;
-    grid-row-start: 2}
+    grid-column-end: none;
+    grid-row-start: 2;
+    grid-row-end: auto}
 .timeline-start {
     grid-column-start: 1;
     grid-column-end: 4;
@@ -3183,7 +3183,7 @@ input.tab:checked + .tab-content,
     box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
     outline-color: currentColor}
 .btn-ghost.btn-active {
-    --tw-border-opacity: 0;
+    border-color: transparent;
     background-color: oklch(var(--bc) / var(--tw-bg-opacity));
     --tw-bg-opacity: 0.2}
 .btn-link {
@@ -20668,17 +20668,36 @@ details.collapse summary::-webkit-details-marker {
     line-height: 2}
 .timeline-vertical {
     flex-direction: column}
+.timeline-compact,
+.timeline-horizontal.timeline-compact {
+    --timeline-row-start: 0}
+.timeline-compact .timeline-start, .timeline-horizontal.timeline-compact .timeline-start {
+    grid-column-start: 1;
+    grid-column-end: 4;
+    grid-row-start: 3;
+    grid-row-end: 4;
+    margin: 0.25rem;
+    align-self: flex-start;
+    justify-self: center}
+.timeline-compact li:has(.timeline-start) .timeline-end, .timeline-horizontal.timeline-compact li:has(.timeline-start) .timeline-end {
+    grid-column-start: none;
+    grid-row-start: auto}
+.timeline-vertical.timeline-compact > li {
+    --timeline-col-start: 0}
+.timeline-vertical.timeline-compact .timeline-start {
+    grid-column-start: 3;
+    grid-column-end: 4;
+    grid-row-start: 1;
+    grid-row-end: 4;
+    align-self: center;
+    justify-self: start}
+.timeline-vertical.timeline-compact li:has(.timeline-start) .timeline-end {
+    grid-column-start: auto;
+    grid-row-start: none}
 :where(.timeline-vertical > li) {
-    --timeline-row-start: 1fr;
-    --timeline-row-end: 1fr;
+    --timeline-row-start: minmax(0, 1fr);
+    --timeline-row-end: minmax(0, 1fr);
     justify-items: center}
-:where(.timeline-vertical:not(:has(.timeline-start)) > li) {
-    --timeline-col-start: min-content}
-:where(.timeline-vertical:not(:has(.timeline-end)) > li) {
-    --timeline-col-end: min-content}
-:where(.timeline-vertical:not(:has(.timeline-start)):not(:has(.timeline-end)) > li) {
-    --timeline-col-start: min-content;
-    --timeline-col-end: min-content}
 .timeline-vertical > li > hr {
     height: 100%}
 :where(.timeline-vertical > li > hr):first-child {
@@ -20686,7 +20705,9 @@ details.collapse summary::-webkit-details-marker {
     grid-row-start: 1}
 :where(.timeline-vertical > li > hr):last-child {
     grid-column-start: 2;
-    grid-row-start: 3}
+    grid-column-end: auto;
+    grid-row-start: 3;
+    grid-row-end: none}
 .timeline-vertical .timeline-start {
     grid-column-start: 1;
     grid-column-end: 2;
@@ -20701,29 +20722,23 @@ details.collapse summary::-webkit-details-marker {
     grid-row-end: 4;
     align-self: center;
     justify-self: start}
-.timeline-vertical.timeline-snap-icon > li {
+.timeline-vertical:where(.timeline-snap-icon) > li {
+    --timeline-col-start: minmax(0, 1fr);
     --timeline-row-start: 0.5rem}
 .timeline-horizontal {
     flex-direction: row}
-:where(.timeline-horizontal > li) {
-    --timeline-col-start: 1fr;
-    --timeline-col-end: 1fr;
-    align-items: center}
-:where(.timeline-horizontal:not(:has(.timeline-start)) > li) {
-    --timeline-row-start: min-content}
-:where(.timeline-horizontal:not(:has(.timeline-end)) > li) {
-    --timeline-row-end: min-content}
-:where(.timeline-horizontal:not(:has(.timeline-start)):not(:has(.timeline-end)) > li) {
-    --timeline-row-start: min-content;
-    --timeline-row-end: min-content}
 .timeline-horizontal > li > hr {
     width: 100%}
+:where(.timeline-horizontal > li) {
+    align-items: center}
 :where(.timeline-horizontal > li > hr):first-child {
     grid-column-start: 1;
     grid-row-start: 2}
 :where(.timeline-horizontal > li > hr):last-child {
     grid-column-start: 3;
-    grid-row-start: 2}
+    grid-column-end: none;
+    grid-row-start: 2;
+    grid-row-end: auto}
 .timeline-horizontal .timeline-start {
     grid-column-start: 1;
     grid-column-end: 4;
@@ -20738,8 +20753,10 @@ details.collapse summary::-webkit-details-marker {
     grid-row-end: 4;
     align-self: flex-start;
     justify-self: center}
-.timeline-horizontal.timeline-snap-icon > li {
-    --timeline-col-start: 0.5rem}
+:where(.timeline-snap-icon) > li,
+.timeline-horizontal:where(.timeline-snap-icon) > li {
+    --timeline-col-start: 0.5rem;
+    --timeline-row-start: minmax(0, 1fr)}
 :where(.toast) {
     bottom: 0px;
     inset-inline-end: 0px;

package/dist/styled.css

@@ -1227,39 +1227,35 @@ input.tab:checked + .tab-content,
 }
 .timeline {
   position: relative;
-  display: flex;
+  display: flex
 }
 :where(.timeline > li) {
   position: relative;
   display: grid;
+  flex-shrink: 0;
   align-items: center;
-  grid-template-rows: var(--timeline-row-start, 1fr) auto var(--timeline-row-end, 1fr);
-  grid-template-columns: var(--timeline-col-start, 1fr) auto var(--timeline-col-end, 1fr);
-}
-:where(.timeline:not(:has(.timeline-start)) > li) {
-  --timeline-row-start: min-content;
-}
-:where(.timeline:not(:has(.timeline-end)) > li) {
-  --timeline-row-end: min-content;
-}
-:where(.timeline:not(:has(.timeline-start)):not(:has(.timeline-end)) li) {
-  --timeline-row-start: min-content;
-  --timeline-row-end: min-content;
+  grid-template-rows: var(--timeline-row-start, minmax(0, 1fr)) auto var(
+      --timeline-row-end,
+      minmax(0, 1fr)
+    );
+  grid-template-columns: var(--timeline-col-start, minmax(0, 1fr)) auto var(
+      --timeline-col-end,
+      minmax(0, 1fr)
+    )
 }
 .timeline > li > hr {
   width: 100%;
-  border-width: 0px;
-}
-.timeline-snap-icon > li {
-  --timeline-col-start: 0.5rem;
+  border-width: 0px
 }
 :where(.timeline > li > hr):first-child {
   grid-column-start: 1;
-  grid-row-start: 2;
+  grid-row-start: 2
 }
 :where(.timeline > li > hr):last-child {
   grid-column-start: 3;
+  grid-column-end: none;
   grid-row-start: 2;
+  grid-row-end: auto
 }
 .timeline-start {
   grid-column-start: 1;
@@ -1268,11 +1264,11 @@ input.tab:checked + .tab-content,
   grid-row-end: 2;
   margin: 0.25rem;
   align-self: flex-end;
-  justify-self: center;
+  justify-self: center
 }
 .timeline-middle {
   grid-column-start: 2;
-  grid-row-start: 2;
+  grid-row-start: 2
 }
 .timeline-end {
   grid-column-start: 1;
@@ -1281,7 +1277,7 @@ input.tab:checked + .tab-content,
   grid-row-end: 4;
   margin: 0.25rem;
   align-self: flex-start;
-  justify-self: center;
+  justify-self: center
 }
 .toast {
     position: fixed;
@@ -1677,13 +1673,13 @@ input.tab:checked + .tab-content,
 }
   @media (hover: hover) {
       .btn-ghost:hover {
-    --tw-border-opacity: 0;
+    border-color: transparent;
     background-color: oklch(var(--bc) / var(--tw-bg-opacity));
     --tw-bg-opacity: 0.2;
   }
     }
   .btn-ghost.btn-active {
-  --tw-border-opacity: 0;
+  border-color: transparent;
   background-color: oklch(var(--bc) / var(--tw-bg-opacity));
   --tw-bg-opacity: 0.2;
 }