@neo-ui-kit/react 1.0.0 → 1.0.2

package/dist/components/effects/Tilt/styles.css

@@ -1,67 +1,67 @@
-/* Styles owned by Tilt: floats gently on its own, leans toward the pointer with depth and glare. */
-.ad-tilt {
-  position: relative;
-  display: block;
-  border-radius: var(--ad-radius);
-  perspective: 50rem;
-  transform-style: preserve-3d;
-  animation: ad-tilt-float 6s ease-in-out infinite;
-}
-.ad-tilt:hover {
-  animation-play-state: paused;
-}
-.ad-tilt > * {
-  transform: rotateX(var(--ad-tilt-x, 0deg)) rotateY(var(--ad-tilt-y, 0deg));
-  transform-style: preserve-3d;
-  transition:
-    transform 0.7s cubic-bezier(0.34, 1.45, 0.5, 1),
-    scale 0.5s cubic-bezier(0.34, 1.45, 0.5, 1),
-    box-shadow 0.4s;
-  will-change: transform;
-}
-.ad-tilt:hover > * {
-  scale: 1.03;
-  transition-duration: 0.12s, 0.5s, 0.4s;
-  box-shadow:
-    0 1.4rem 2.6rem #000c,
-    0 0 1.6rem rgb(from var(--ad-primary) r g b / 0.2);
-}
-.ad-tilt[data-glare]::after {
-  content: "";
-  position: absolute;
-  inset: 0;
-  z-index: 3;
-  border-radius: inherit;
-  background: radial-gradient(
-    circle at var(--ad-glare-x, 50%) var(--ad-glare-y, 50%),
-    #ffffff44,
-    rgb(from var(--ad-secondary-200) r g b / 0.1) 30%,
-    transparent 60%
-  );
-  mix-blend-mode: screen;
-  opacity: 0;
-  transition: opacity 0.3s;
-  pointer-events: none;
-}
-.ad-tilt[data-glare]:hover::after {
-  opacity: 1;
-}
-.ad-tilt[data-ad-motion="off"],
-.ad-tilt[data-ad-motion="off"] > * {
-  animation: none;
-  transform: none;
-  translate: none;
-  scale: none;
-  will-change: auto;
-}
-@keyframes ad-tilt-float {
-  0%,
-  100% {
-    transform: perspective(50rem) rotateX(3deg) rotateY(-4deg);
-    translate: 0 0;
-  }
-  50% {
-    transform: perspective(50rem) rotateX(-3deg) rotateY(4deg);
-    translate: 0 -0.35rem;
-  }
-}
+/* Styles owned by Tilt: floats gently on its own, leans toward the pointer with depth and glare. */
+.ad-tilt {
+  position: relative;
+  display: block;
+  border-radius: var(--ad-radius);
+  perspective: 50rem;
+  transform-style: preserve-3d;
+  animation: ad-tilt-float 6s ease-in-out infinite;
+}
+.ad-tilt:hover {
+  animation-play-state: paused;
+}
+.ad-tilt > * {
+  transform: rotateX(var(--ad-tilt-x, 0deg)) rotateY(var(--ad-tilt-y, 0deg));
+  transform-style: preserve-3d;
+  transition:
+    transform 0.7s cubic-bezier(0.34, 1.45, 0.5, 1),
+    scale 0.5s cubic-bezier(0.34, 1.45, 0.5, 1),
+    box-shadow 0.4s;
+  will-change: transform;
+}
+.ad-tilt:hover > * {
+  scale: 1.03;
+  transition-duration: 0.12s, 0.5s, 0.4s;
+  box-shadow:
+    0 1.4rem 2.6rem #000c,
+    0 0 1.6rem rgb(from var(--ad-primary) r g b / 0.2);
+}
+.ad-tilt[data-glare]::after {
+  content: "";
+  position: absolute;
+  inset: 0;
+  z-index: 3;
+  border-radius: inherit;
+  background: radial-gradient(
+    circle at var(--ad-glare-x, 50%) var(--ad-glare-y, 50%),
+    #ffffff44,
+    rgb(from var(--ad-secondary-200) r g b / 0.1) 30%,
+    transparent 60%
+  );
+  mix-blend-mode: screen;
+  opacity: 0;
+  transition: opacity 0.3s;
+  pointer-events: none;
+}
+.ad-tilt[data-glare]:hover::after {
+  opacity: 1;
+}
+.ad-tilt[data-ad-motion="off"],
+.ad-tilt[data-ad-motion="off"] > * {
+  animation: none;
+  transform: none;
+  translate: none;
+  scale: none;
+  will-change: auto;
+}
+@keyframes ad-tilt-float {
+  0%,
+  100% {
+    transform: perspective(50rem) rotateX(3deg) rotateY(-4deg);
+    translate: 0 0;
+  }
+  50% {
+    transform: perspective(50rem) rotateX(-3deg) rotateY(4deg);
+    translate: 0 -0.35rem;
+  }
+}

package/dist/components/feedback/CollapsibleSection/styles.css

@@ -1,76 +1,76 @@
-/* Styles owned by CollapsibleSection: the body unfolds smoothly, the chevron turns, content rises in. */
-.ad-collapsible-section {
-  border-radius: 0.9375rem;
-  interpolate-size: allow-keywords;
-  transition: box-shadow 0.35s;
-}
-.ad-collapsible-section[open] {
-  box-shadow: 0 0 1.2rem rgb(from var(--ad-primary) r g b / 0.13);
-}
-.ad-collapsible-section summary {
-  position: relative;
-  padding: 1rem 1.25rem;
-  display: flex;
-  align-items: center;
-  gap: 0.875rem;
-  cursor: pointer;
-  list-style: none;
-  font-size: 1rem;
-  font-weight: 600;
-  border-radius: inherit;
-  transition:
-    background 0.25s,
-    color 0.25s;
-}
-.ad-collapsible-section summary::-webkit-details-marker {
-  display: none;
-}
-.ad-collapsible-section summary:hover {
-  background: #ffffff08;
-}
-.ad-collapse-heading {
-  display: grid;
-  flex: 1;
-  gap: 0.15rem;
-  min-width: 0;
-}
-.ad-collapse-heading > small {
-  color: var(--ad-muted);
-  font-size: var(--ad-font-size-caption);
-  font-weight: 400;
-}
-.ad-collapsible-section summary > .ad-icon:first-child {
-  transition:
-    transform 0.4s cubic-bezier(0.34, 1.56, 0.5, 1),
-    color 0.25s;
-}
-.ad-collapsible-section summary:hover > .ad-icon:first-child,
-.ad-collapsible-section[open] summary > .ad-icon:first-child {
-  transform: scale(1.12) rotate(-8deg);
-  color: var(--ad-pink);
-}
-/* Smooth height where supported (::details-content); elsewhere it opens instantly. */
-.ad-collapsible-section::details-content {
-  block-size: 0;
-  overflow: hidden;
-  transition:
-    block-size 0.45s cubic-bezier(0.2, 0.8, 0.2, 1),
-    content-visibility 0.45s allow-discrete;
-}
-.ad-collapsible-section[open]::details-content {
-  block-size: auto;
-}
-.ad-collapse-content {
-  padding: 0 1.25rem 1.25rem;
-  font-size: 0.8125rem;
-  color: var(--ad-muted);
-}
-.ad-collapsible-section[open] .ad-collapse-content {
-  animation: ad-collapse-in 0.5s 0.05s cubic-bezier(0.2, 0.8, 0.2, 1) both;
-}
-@keyframes ad-collapse-in {
-  from {
-    opacity: 0;
-    transform: translateY(-0.5rem);
-  }
-}
+/* Styles owned by CollapsibleSection: the body unfolds smoothly, the chevron turns, content rises in. */
+.ad-collapsible-section {
+  border-radius: 0.9375rem;
+  interpolate-size: allow-keywords;
+  transition: box-shadow 0.35s;
+}
+.ad-collapsible-section[open] {
+  box-shadow: 0 0 1.2rem rgb(from var(--ad-primary) r g b / 0.13);
+}
+.ad-collapsible-section summary {
+  position: relative;
+  padding: 1rem 1.25rem;
+  display: flex;
+  align-items: center;
+  gap: 0.875rem;
+  cursor: pointer;
+  list-style: none;
+  font-size: 1rem;
+  font-weight: 600;
+  border-radius: inherit;
+  transition:
+    background 0.25s,
+    color 0.25s;
+}
+.ad-collapsible-section summary::-webkit-details-marker {
+  display: none;
+}
+.ad-collapsible-section summary:hover {
+  background: #ffffff08;
+}
+.ad-collapse-heading {
+  display: grid;
+  flex: 1;
+  gap: 0.15rem;
+  min-width: 0;
+}
+.ad-collapse-heading > small {
+  color: var(--ad-muted);
+  font-size: var(--ad-font-size-caption);
+  font-weight: 400;
+}
+.ad-collapsible-section summary > .ad-icon:first-child {
+  transition:
+    transform 0.4s cubic-bezier(0.34, 1.56, 0.5, 1),
+    color 0.25s;
+}
+.ad-collapsible-section summary:hover > .ad-icon:first-child,
+.ad-collapsible-section[open] summary > .ad-icon:first-child {
+  transform: scale(1.12) rotate(-8deg);
+  color: var(--ad-pink);
+}
+/* Smooth height where supported (::details-content); elsewhere it opens instantly. */
+.ad-collapsible-section::details-content {
+  block-size: 0;
+  overflow: hidden;
+  transition:
+    block-size 0.45s cubic-bezier(0.2, 0.8, 0.2, 1),
+    content-visibility 0.45s allow-discrete;
+}
+.ad-collapsible-section[open]::details-content {
+  block-size: auto;
+}
+.ad-collapse-content {
+  padding: 0 1.25rem 1.25rem;
+  font-size: 0.8125rem;
+  color: var(--ad-muted);
+}
+.ad-collapsible-section[open] .ad-collapse-content {
+  animation: ad-collapse-in 0.5s 0.05s cubic-bezier(0.2, 0.8, 0.2, 1) both;
+}
+@keyframes ad-collapse-in {
+  from {
+    opacity: 0;
+    transform: translateY(-0.5rem);
+  }
+}