daisyui 4.0.0-alpha.5 → 4.0.0-alpha.7

package/dist/styled.css

@@ -378,6 +378,65 @@
       white-space: pre;
       top: calc(var(--value) * -1em);
     }
+.diff {
+  position: relative;
+  display: grid;
+  overflow: hidden;
+  container-type: inline-size;
+  grid-template-columns: auto 1fr
+}
+.diff-resizer {
+  position: relative;
+  top: 50%;
+  z-index: 1;
+  height: 3rem;
+  width: 25rem;
+  min-width: 1rem;
+  max-width: calc(100cqi - 1rem);
+  resize: horizontal;
+  overflow: hidden;
+  opacity: 0;
+  transform-origin: 100% 100%;
+  scale: 4;
+  translate: 1.5rem -1.5rem;
+  clip-path: inset(calc(100% - 0.75rem) 0 0 calc(100% - 0.75rem))
+}
+.diff-resizer,
+.diff-item-1,
+.diff-item-2 {
+  position: relative;
+  grid-column-start: 1;
+  grid-row-start: 1
+}
+.diff-item-1:after {
+  pointer-events: none;
+  position: absolute;
+  bottom: 0px;
+  right: 1px;
+  top: 50%;
+  z-index: 1;
+  height: 2rem;
+  width: 2rem;
+  --tw-content: '';
+  content: var(--tw-content);
+  translate: 50% -50%
+}
+.diff-item-2 {
+  overflow: hidden
+}
+.diff-item-1 > *,
+.diff-item-2 > * {
+  pointer-events: none;
+  position: absolute;
+  bottom: 0px;
+  left: 0px;
+  top: 0px;
+  height: 100%;
+  width: 100cqi;
+  max-width: none;
+  object-fit: cover;
+  object-position: center
+}
 .divider {
     display: flex;
     flex-direction: row;
@@ -1169,31 +1228,35 @@ input.tab:checked + .tab-content,
   position: relative;
   display: flex;
 }
-:where(.timeline li) {
+:where(.timeline > li) {
   position: relative;
   display: grid;
   align-items: center;
-  grid-template-rows: 1fr auto 1fr;
-  grid-template-columns: 1fr auto 1fr;
+  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) {
-  grid-template-rows: min-content auto 1fr;
+:where(.timeline:not(:has(.timeline-start)) > li) {
+  --timeline-row-start: min-content;
 }
-:where(.timeline:not(:has(.timeline-end)) li) {
-  grid-template-rows: 1fr auto 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) {
-  grid-template-rows: min-content auto min-content;
+  --timeline-row-start: min-content;
+  --timeline-row-end: min-content;
 }
-.timeline hr {
+.timeline > li > hr {
   width: 100%;
   border-width: 0px;
 }
-:where(.timeline hr):first-child {
+.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 hr):last-child {
+:where(.timeline > li > hr):last-child {
   grid-column-start: 3;
   grid-row-start: 2;
 }
@@ -2527,6 +2590,27 @@ details.collapse summary {
       text-align: center;
       transition: all 1s cubic-bezier(1, 0, 0, 1);
     }
+.diff-item-1:after {
+  border-radius: 9999px;
+  border-width: 2px;
+  --tw-border-opacity: 1;
+  border-color: oklch(var(--b1) / var(--tw-border-opacity));
+  background-color: oklch(var(--b1) / 0.5);
+  --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
+  --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
+  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
+  outline-style: solid;
+  outline-offset: -3px;
+  outline-color: oklch(var(--bc) / 0.05);
+  --tw-backdrop-blur: blur(8px);
+  backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
+  translate: 50% -50%
+}
+.diff-item-2 {
+  border-right-width: 2px;
+  --tw-border-opacity: 1;
+  border-color: oklch(var(--b1) / var(--tw-border-opacity))
+}
 .divider {
     margin-top: 1rem;
     margin-bottom: 1rem;
@@ -4508,10 +4592,18 @@ details.collapse summary {
       background-image: var(--radius-end);
       background-position: top right;
     }
+[dir="rtl"] .tab-lifted.tab-active:not(.tab-disabled):not([disabled]):first-child:before, [dir="rtl"] .tab-lifted:is(input:checked):first-child:before {
+        background-image: var(--radius-start);
+        background-position: top left;
+      }
 .tab-lifted.tab-active:not(.tab-disabled):not([disabled]):last-child:before, .tab-lifted:is(input:checked):last-child:before {
       background-image: var(--radius-start);
       background-position: top left;
     }
+[dir="rtl"] .tab-lifted.tab-active:not(.tab-disabled):not([disabled]):last-child:before, [dir="rtl"] .tab-lifted:is(input:checked):last-child:before {
+        background-image: var(--radius-end);
+        background-position: top right;
+      }
 .tab-lifted.tab-active:not(.tab-disabled):not([disabled])
   + .tab-lifted.tab-active:not(.tab-disabled):not([disabled]):before, .tab-lifted:is(input:checked) + .tab-lifted:is(input:checked):before {
     background-image: var(--radius-end);