daisyui 3.0.4 → 3.0.5

package/dist/styled.css

@@ -358,9 +358,11 @@
 }
 .collapse[open],
 .collapse-open,
-.collapse:focus:not(.collapse-close),
-.collapse:not(.collapse-close):has(input[type="checkbox"]:checked),
-.collapse:not(.collapse-close):has(input[type="radio"]:checked) {
+.collapse:focus:not(.collapse-close) {
+  grid-template-rows: auto 1fr;
+}
+.collapse:not(.collapse-close):has(> input[type="checkbox"]:checked),
+.collapse:not(.collapse-close):has(> input[type="radio"]:checked) {
   grid-template-rows: auto 1fr;
 }
 .collapse[open] .collapse-content,
@@ -1452,6 +1454,7 @@
   --tw-text-opacity: 1;
   color: hsl(var(--bc) / var(--tw-text-opacity));
   text-decoration-line: none;
+  outline-color: hsl(var(--bc) / 1);
 }
   @media (hover: hover) {
       .btn:hover {
@@ -1471,7 +1474,6 @@
   outline-style: solid;
   outline-width: 2px;
   outline-offset: 2px;
-  outline-color: hsl(var(--bc) / 1);
 }
   /* brand colors */
   .btn-primary {
@@ -1481,6 +1483,7 @@
   background-color: hsl(var(--p) / var(--tw-bg-opacity));
   --tw-text-opacity: 1;
   color: hsl(var(--pc) / var(--tw-text-opacity));
+  outline-color: hsl(var(--p) / 1);
 }
   @media (hover: hover) {
       .btn-primary:hover {
@@ -1495,9 +1498,6 @@
   border-color: hsl(var(--pf) / var(--tw-border-opacity));
   --tw-bg-opacity: 1;
   background-color: hsl(var(--pf) / var(--tw-bg-opacity));
-}
-  .btn-primary:focus-visible {
-  outline-color: hsl(var(--p) / 1);
 }
   .btn-secondary {
   --tw-border-opacity: 1;
@@ -1506,6 +1506,7 @@
   background-color: hsl(var(--s) / var(--tw-bg-opacity));
   --tw-text-opacity: 1;
   color: hsl(var(--sc) / var(--tw-text-opacity));
+  outline-color: hsl(var(--s) / 1);
 }
   @media (hover: hover) {
       .btn-secondary:hover {
@@ -1520,9 +1521,6 @@
   border-color: hsl(var(--sf) / var(--tw-border-opacity));
   --tw-bg-opacity: 1;
   background-color: hsl(var(--sf) / var(--tw-bg-opacity));
-}
-  .btn-secondary:focus-visible {
-  outline-color: hsl(var(--s) / 1);
 }
   .btn-accent {
   --tw-border-opacity: 1;
@@ -1531,6 +1529,7 @@
   background-color: hsl(var(--a) / var(--tw-bg-opacity));
   --tw-text-opacity: 1;
   color: hsl(var(--ac) / var(--tw-text-opacity));
+  outline-color: hsl(var(--a) / 1);
 }
   @media (hover: hover) {
       .btn-accent:hover {
@@ -1545,9 +1544,6 @@
   border-color: hsl(var(--af) / var(--tw-border-opacity));
   --tw-bg-opacity: 1;
   background-color: hsl(var(--af) / var(--tw-bg-opacity));
-}
-  .btn-accent:focus-visible {
-  outline-color: hsl(var(--a) / 1);
 }
   .btn-neutral {
   --tw-border-opacity: 1;
@@ -1556,6 +1552,7 @@
   background-color: hsl(var(--n) / var(--tw-bg-opacity));
   --tw-text-opacity: 1;
   color: hsl(var(--nc) / var(--tw-text-opacity));
+  outline-color: hsl(var(--n) / 1);
 }
   @media (hover: hover) {
       .btn-neutral:hover {
@@ -1570,9 +1567,6 @@
   border-color: hsl(var(--nf) / var(--tw-border-opacity));
   --tw-bg-opacity: 1;
   background-color: hsl(var(--nf) / var(--tw-bg-opacity));
-}
-  .btn-neutral:focus-visible {
-  outline-color: hsl(var(--n) / 1);
 }
   /* btn with state colors */
   .btn-info {
@@ -1582,6 +1576,7 @@
   background-color: hsl(var(--in) / var(--tw-bg-opacity));
   --tw-text-opacity: 1;
   color: hsl(var(--inc) / var(--tw-text-opacity));
+  outline-color: hsl(var(--in) / 1);
 }
   @media (hover: hover) {
       .btn-info:hover {
@@ -1596,9 +1591,6 @@
   border-color: hsl(var(--in) / var(--tw-border-opacity));
   --tw-bg-opacity: 1;
   background-color: hsl(var(--in) / var(--tw-bg-opacity));
-}
-  .btn-info:focus-visible {
-  outline-color: hsl(var(--in) / 1);
 }
   .btn-success {
   --tw-border-opacity: 1;
@@ -1607,6 +1599,7 @@
   background-color: hsl(var(--su) / var(--tw-bg-opacity));
   --tw-text-opacity: 1;
   color: hsl(var(--suc) / var(--tw-text-opacity));
+  outline-color: hsl(var(--su) / 1);
 }
   @media (hover: hover) {
       .btn-success:hover {
@@ -1621,9 +1614,6 @@
   border-color: hsl(var(--su) / var(--tw-border-opacity));
   --tw-bg-opacity: 1;
   background-color: hsl(var(--su) / var(--tw-bg-opacity));
-}
-  .btn-success:focus-visible {
-  outline-color: hsl(var(--su) / 1);
 }
   .btn-warning {
   --tw-border-opacity: 1;
@@ -1632,6 +1622,7 @@
   background-color: hsl(var(--wa) / var(--tw-bg-opacity));
   --tw-text-opacity: 1;
   color: hsl(var(--wac) / var(--tw-text-opacity));
+  outline-color: hsl(var(--wa) / 1);
 }
   @media (hover: hover) {
       .btn-warning:hover {
@@ -1646,9 +1637,6 @@
   border-color: hsl(var(--wa) / var(--tw-border-opacity));
   --tw-bg-opacity: 1;
   background-color: hsl(var(--wa) / var(--tw-bg-opacity));
-}
-  .btn-warning:focus-visible {
-  outline-color: hsl(var(--wa) / 1);
 }
   .btn-error {
   --tw-border-opacity: 1;
@@ -1657,6 +1645,7 @@
   background-color: hsl(var(--er) / var(--tw-bg-opacity));
   --tw-text-opacity: 1;
   color: hsl(var(--erc) / var(--tw-text-opacity));
+  outline-color: hsl(var(--er) / 1);
 }
   @media (hover: hover) {
       .btn-error:hover {
@@ -1671,18 +1660,16 @@
   border-color: hsl(var(--er) / var(--tw-border-opacity));
   --tw-bg-opacity: 1;
   background-color: hsl(var(--er) / var(--tw-bg-opacity));
-}
-  .btn-error:focus-visible {
-  outline-color: hsl(var(--er) / 1);
 }
   /* glass */
   .btn.glass {
   --tw-shadow: 0 0 #0000;
   --tw-shadow-colored: 0 0 #0000;
   box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
+  outline-color: currentColor;
 }
   @media (hover: hover) {
-      .btn.glass:hover{
+      .btn.glass:hover {
         --glass-opacity: 25%;
         --glass-border-opacity: 15%;
       }
@@ -1691,9 +1678,6 @@
       --glass-opacity: 25%;
       --glass-border-opacity: 15%;
     }
-  .btn.glass:focus-visible {
-  outline-color: currentColor;
-}
   /* btn variants */
   .btn-ghost {
   border-width: 1px;
@@ -1703,6 +1687,7 @@
   --tw-shadow: 0 0 #0000;
   --tw-shadow-colored: 0 0 #0000;
   box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
+  outline-color: currentColor;
 }
   @media (hover: hover) {
       .btn-ghost:hover {
@@ -1715,9 +1700,6 @@
   --tw-border-opacity: 0;
   background-color: hsl(var(--bc) / var(--tw-bg-opacity));
   --tw-bg-opacity: 0.2;
-}
-  .btn-ghost:focus-visible {
-  outline-color: currentColor;
 }
   .btn-link {
   border-color: transparent;
@@ -1728,6 +1710,7 @@
   --tw-shadow: 0 0 #0000;
   --tw-shadow-colored: 0 0 #0000;
   box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
+  outline-color: currentColor;
 }
   @media (hover: hover) {
       .btn-link:hover {
@@ -1740,9 +1723,6 @@
   border-color: transparent;
   background-color: transparent;
   text-decoration-line: underline;
-}
-  .btn-link:focus-visible {
-  outline-color: currentColor;
 }
   /* outline */
   .btn-outline {
@@ -2429,8 +2409,8 @@ details.collapse summary {
   outline-offset: 2px;
 }
 .collapse:has(.collapse-title:focus-visible),
-.collapse:has(input[type="checkbox"]:focus-visible),
-.collapse:has(input[type="radio"]:focus-visible) {
+.collapse:has(> input[type="checkbox"]:focus-visible),
+.collapse:has(> input[type="radio"]:focus-visible) {
   outline-style: solid;
   outline-width: 2px;
   outline-offset: 2px;
@@ -2566,6 +2546,11 @@ details.collapse summary {
   .drawer-toggle:checked ~ .drawer-side > .drawer-overlay {
         background-color: hsl(0 0% 0%/0.4);
       }
+  .drawer-toggle:focus-visible ~ .drawer-content label.drawer-button {
+  outline-style: solid;
+  outline-width: 2px;
+  outline-offset: 2px;
+}
 .dropdown:is(:not(details)) .dropdown-content {
   transform-origin: top;
   --tw-scale-x: .95;
@@ -3170,19 +3155,23 @@ details.collapse summary {
     transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
     border-radius: var(--rounded-btn, 0.5rem);
 }
-  .menu :where(li:not(.menu-title):not(.disabled) > *:not(ul):not(details):not(.menu-title)).focus,
-    .menu :where(li:not(.menu-title):not(.disabled) > *:not(ul):not(details):not(.menu-title)):focus,
-    .menu :where(li:not(.menu-title):not(.disabled) > details > summary:not(.menu-title)).focus,
-    .menu :where(li:not(.menu-title):not(.disabled) > details > summary:not(.menu-title)):focus {
+  .menu :where(li:not(.menu-title):not(.disabled) > *:not(ul):not(details):not(.menu-title)):not(.active).focus,
+    .menu :where(li:not(.menu-title):not(.disabled) > *:not(ul):not(details):not(.menu-title)):not(.active):focus,
+    .menu :where(li:not(.menu-title):not(.disabled) > details > summary:not(.menu-title)):not(.active).focus,
+    .menu :where(li:not(.menu-title):not(.disabled) > details > summary:not(.menu-title)):not(.active):focus {
     cursor: pointer;
     background-color: hsl(var(--bc) / 0.1);
+    --tw-text-opacity: 1;
+    color: hsl(var(--bc) / var(--tw-text-opacity));
     outline: 2px solid transparent;
     outline-offset: 2px;
 }
   @media (hover: hover) {
-      .menu :where(li:not(.menu-title):not(.disabled) > *:not(ul):not(details):not(.menu-title)):hover, .menu :where(li:not(.menu-title):not(.disabled) > details > summary:not(.menu-title)):hover {
+      .menu :where(li:not(.menu-title):not(.disabled) > *:not(ul):not(details):not(.menu-title)):not(.active):hover, .menu :where(li:not(.menu-title):not(.disabled) > details > summary:not(.menu-title)):not(.active):hover {
         cursor: pointer;
         background-color: hsl(var(--bc) / 0.1);
+        --tw-text-opacity: 1;
+        color: hsl(var(--bc) / var(--tw-text-opacity));
         outline: 2px solid transparent;
         outline-offset: 2px;
     }
@@ -4610,7 +4599,7 @@ details.collapse summary {
   color: hsl(var(--ac) / var(--tw-text-opacity));
 }
   .toggle-success:focus-visible {
-  outline-color: hsl(var(--in) / 1);
+  outline-color: hsl(var(--su) / 1);
 }
   .toggle-success:checked,
     .toggle-success[checked="true"],
@@ -4623,7 +4612,7 @@ details.collapse summary {
   color: hsl(var(--suc) / var(--tw-text-opacity));
 }
   .toggle-warning:focus-visible {
-  outline-color: hsl(var(--su) / 1);
+  outline-color: hsl(var(--wa) / 1);
 }
   .toggle-warning:checked,
     .toggle-warning[checked="true"],
@@ -4636,7 +4625,7 @@ details.collapse summary {
   color: hsl(var(--wac) / var(--tw-text-opacity));
 }
   .toggle-info:focus-visible {
-  outline-color: hsl(var(--wa) / 1);
+  outline-color: hsl(var(--in) / 1);
 }
   .toggle-info:checked,
     .toggle-info[checked="true"],