daisyui 2.5.0 → 2.6.0

package/dist/styled.css

@@ -1945,8 +1945,8 @@ body[dir="rtl"] .checkbox:checked,
     body[dir="rtl"] .checkbox[checked="true"] {
       background-image: linear-gradient(45deg, transparent 65%, hsl(var(--chkbg)) 65.99%), linear-gradient(-45deg, transparent 75%, hsl(var(--chkbg)) 75.99%), linear-gradient(45deg, hsl(var(--chkbg)) 40%, transparent 40.99%), linear-gradient(-45deg, hsl(var(--chkbg)) 30%, hsl(var(--chkfg)) 30.99%, hsl(var(--chkfg)) 40%, transparent 40.99%), linear-gradient(45deg, hsl(var(--chkfg)) 50%, hsl(var(--chkbg)) 50.99%);
     }
-.collapse {
-  outline: 2px solid transparent;
+.collapse:focus-visible {
+  outline: 2px solid hsl(var(--nf));
   outline-offset: 2px;
 }
 .collapse-arrow .collapse-title:after {
@@ -1955,8 +1955,9 @@ body[dir="rtl"] .checkbox:checked,
   height: 0.5rem;
   width: 0.5rem;
   transition-property: all;
-  transition-duration: 300ms;
+  transition-duration: 150ms;
   transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+  transition-duration: 0.2s;
   top: 1.4rem;
   right: 1.4rem;
   content: "";
@@ -1991,45 +1992,30 @@ body[dir="rtl"] .checkbox:checked,
   min-height: 3.75rem;
   transition: background-color 0.2s ease-in-out;
 }
-.collapse:not(.collapse-close) input[type="checkbox"]:focus ~ .collapse-title {
-  background-color: hsl(var(--bc) / var(--tw-bg-opacity));
-  --tw-bg-opacity: 0.1;
-}
-.collapse-open .collapse-title, .collapse:focus:not(.collapse-close) .collapse-title, .collapse:not(.collapse-close)
-  input[type="checkbox"]:checked
-  ~ .collapse-title {
-  background-color: hsl(var(--bc) / var(--tw-bg-opacity));
-  --tw-bg-opacity: 0.1;
-  outline: 2px solid transparent;
-  outline-offset: 2px;
-}
+/* 
+.collapse-open :where(.collapse-title),
+.collapse:focus:not(.collapse-close) :where(.collapse-title),
+.collapse:not(.collapse-close) :where(input[type="checkbox"]:checked ~ .collapse-title) {
+  @apply bg-base-content bg-opacity-10;
+} */
 .collapse-content {
   padding-left: 1rem;
   padding-right: 1rem;
   cursor: unset;
   transition: padding 0.2s ease-in-out, background-color 0.2s ease-in-out;
 }
-.collapse-open .collapse-content, .collapse:focus:not(.collapse-close) .collapse-content, .collapse:not(.collapse-close)
-  input[type="checkbox"]:checked
-  ~ .collapse-content {
-  background-color: hsl(var(--bc) / var(--tw-bg-opacity));
-  --tw-bg-opacity: 0.1;
+.collapse-open :where(.collapse-content), .collapse:focus:not(.collapse-close) :where(.collapse-content), .collapse:not(.collapse-close) :where(input[type="checkbox"]:checked ~ .collapse-content) {
   padding-bottom: 1rem;
-  opacity: 1;
   transition: padding 0.2s ease-in-out, background-color 0.2s ease-in-out;
 }
 .collapse-open.collapse-arrow .collapse-title:after,
 .collapse-arrow:focus:not(.collapse-close) .collapse-title:after,
-.collapse-arrow:not(.collapse-close)
-  input[type="checkbox"]:checked
-  ~ .collapse-title:after {
+.collapse-arrow:not(.collapse-close) input[type="checkbox"]:checked ~ .collapse-title:after {
   transform: rotate(225deg);
 }
 .collapse-open.collapse-plus .collapse-title:after,
 .collapse-plus:focus:not(.collapse-close) .collapse-title:after,
-.collapse-plus:not(.collapse-close)
-  input[type="checkbox"]:checked
-  ~ .collapse-title:after {
+.collapse-plus:not(.collapse-close) input[type="checkbox"]:checked ~ .collapse-title:after {
   content: "−";
 }
 .countdown > *:before {