negodesign 0.0.35 → 0.0.37

package/dist/globals.css

@@ -13,6 +13,7 @@
     --color-green-500: oklch(72.3% 0.219 149.579);
     --color-green-600: oklch(62.7% 0.194 149.214);
     --color-blue-50: oklch(97% 0.014 254.604);
+    --color-blue-100: oklch(93.2% 0.032 255.585);
     --color-blue-400: oklch(70.7% 0.165 254.624);
     --color-blue-500: oklch(62.3% 0.214 259.815);
     --color-blue-700: oklch(48.8% 0.243 264.376);
@@ -78,6 +79,7 @@
     --animate-pulse: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
     --blur-xs: 4px;
     --blur-sm: 8px;
+    --blur-md: 12px;
     --blur-2xl: 40px;
     --aspect-video: 16 / 9;
     --default-transition-duration: 150ms;
@@ -367,6 +369,9 @@
   .bottom-2 {
     bottom: calc(var(--spacing) * 2);
   }
+  .bottom-3 {
+    bottom: calc(var(--spacing) * 3);
+  }
   .-left-8 {
     left: calc(var(--spacing) * -8);
   }
@@ -379,6 +384,9 @@
   .left-1\/2 {
     left: calc(1 / 2 * 100%);
   }
+  .left-2 {
+    left: calc(var(--spacing) * 2);
+  }
   .left-3 {
     left: calc(var(--spacing) * 3);
   }
@@ -415,6 +423,12 @@
   .order-last {
     order: 9999;
   }
+  .col-span-2 {
+    grid-column: span 2 / span 2;
+  }
+  .row-span-2 {
+    grid-row: span 2 / span 2;
+  }
   .container {
     width: 100%;
     @media (width >= 40rem) {
@@ -442,6 +456,9 @@
   .-mx-1 {
     margin-inline: calc(var(--spacing) * -1);
   }
+  .-mx-4 {
+    margin-inline: calc(var(--spacing) * -4);
+  }
   .mx-2 {
     margin-inline: calc(var(--spacing) * 2);
   }
@@ -493,6 +510,9 @@
   .-mt-12 {
     margin-top: calc(var(--spacing) * -12);
   }
+  .-mt-16 {
+    margin-top: calc(var(--spacing) * -16);
+  }
   .mt-0\.5 {
     margin-top: calc(var(--spacing) * 0.5);
   }
@@ -514,6 +534,9 @@
   .mt-5 {
     margin-top: calc(var(--spacing) * 5);
   }
+  .mt-6 {
+    margin-top: calc(var(--spacing) * 6);
+  }
   .mt-7 {
     margin-top: calc(var(--spacing) * 7);
   }
@@ -574,6 +597,9 @@
   .ml-0 {
     margin-left: 0px;
   }
+  .ml-1 {
+    margin-left: var(--spacing);
+  }
   .ml-auto {
     margin-left: auto;
   }
@@ -590,6 +616,12 @@
     -webkit-box-orient: vertical;
     -webkit-line-clamp: 1;
   }
+  .line-clamp-3 {
+    overflow: hidden;
+    display: -webkit-box;
+    -webkit-box-orient: vertical;
+    -webkit-line-clamp: 3;
+  }
   .block {
     display: block;
   }
@@ -629,6 +661,9 @@
   .aspect-4\/3 {
     aspect-ratio: 4/3;
   }
+  .aspect-21\/9 {
+    aspect-ratio: 21/9;
+  }
   .aspect-577\/310 {
     aspect-ratio: 577/310;
   }
@@ -682,6 +717,10 @@
     width: calc(var(--spacing) * 10);
     height: calc(var(--spacing) * 10);
   }
+  .size-11 {
+    width: calc(var(--spacing) * 11);
+    height: calc(var(--spacing) * 11);
+  }
   .size-15 {
     width: calc(var(--spacing) * 15);
     height: calc(var(--spacing) * 15);
@@ -811,6 +850,9 @@
   .max-h-72 {
     max-height: calc(var(--spacing) * 72);
   }
+  .max-h-\[85vh\] {
+    max-height: 85vh;
+  }
   .max-h-\[90vh\] {
     max-height: 90vh;
   }
@@ -841,6 +883,9 @@
   .w-1 {
     width: var(--spacing);
   }
+  .w-1\.5 {
+    width: calc(var(--spacing) * 1.5);
+  }
   .w-1\/2 {
     width: calc(1 / 2 * 100%);
   }
@@ -886,6 +931,9 @@
   .w-12 {
     width: calc(var(--spacing) * 12);
   }
+  .w-15 {
+    width: calc(var(--spacing) * 15);
+  }
   .w-16 {
     width: calc(var(--spacing) * 16);
   }
@@ -1438,6 +1486,10 @@
     border-style: var(--tw-border-style);
     border-width: 0px;
   }
+  .border-4 {
+    border-style: var(--tw-border-style);
+    border-width: 4px;
+  }
   .border-\[1\.5px\] {
     border-style: var(--tw-border-style);
     border-width: 1.5px;
@@ -1492,6 +1544,9 @@
   .border-\[\#1a2420\] {
     border-color: #1a2420;
   }
+  .border-background {
+    border-color: var(--background);
+  }
   .border-border {
     border-color: var(--border);
   }
@@ -1567,6 +1622,18 @@
   .bg-background {
     background-color: var(--background);
   }
+  .bg-background\/80 {
+    background-color: var(--background);
+    @supports (color: color-mix(in lab, red, red)) {
+      background-color: color-mix(in oklab, var(--background) 80%, transparent);
+    }
+  }
+  .bg-background\/95 {
+    background-color: var(--background);
+    @supports (color: color-mix(in lab, red, red)) {
+      background-color: color-mix(in oklab, var(--background) 95%, transparent);
+    }
+  }
   .bg-black\/5 {
     background-color: color-mix(in srgb, #000 5%, transparent);
     @supports (color: color-mix(in lab, red, red)) {
@@ -1591,6 +1658,12 @@
       background-color: color-mix(in oklab, var(--color-black) 20%, transparent);
     }
   }
+  .bg-black\/30 {
+    background-color: color-mix(in srgb, #000 30%, transparent);
+    @supports (color: color-mix(in lab, red, red)) {
+      background-color: color-mix(in oklab, var(--color-black) 30%, transparent);
+    }
+  }
   .bg-black\/50 {
     background-color: color-mix(in srgb, #000 50%, transparent);
     @supports (color: color-mix(in lab, red, red)) {
@@ -1612,6 +1685,9 @@
   .bg-blue-50 {
     background-color: var(--color-blue-50);
   }
+  .bg-blue-100 {
+    background-color: var(--color-blue-100);
+  }
   .bg-blue-400 {
     background-color: var(--color-blue-400);
   }
@@ -1792,6 +1868,12 @@
       background-color: color-mix(in oklab, var(--color-white) 40%, transparent);
     }
   }
+  .bg-white\/50 {
+    background-color: color-mix(in srgb, #fff 50%, transparent);
+    @supports (color: color-mix(in lab, red, red)) {
+      background-color: color-mix(in oklab, var(--color-white) 50%, transparent);
+    }
+  }
   .bg-yellow-500 {
     background-color: var(--color-yellow-500);
   }
@@ -1830,6 +1912,9 @@
   .fill-transparent {
     fill: transparent;
   }
+  .fill-white {
+    fill: var(--color-white);
+  }
   .object-contain {
     object-fit: contain;
   }
@@ -1872,6 +1957,9 @@
   .p-10 {
     padding: calc(var(--spacing) * 10);
   }
+  .p-12 {
+    padding: calc(var(--spacing) * 12);
+  }
   .p-\[3px\] {
     padding: 3px;
   }
@@ -1965,9 +2053,6 @@
   .pt-8 {
     padding-top: calc(var(--spacing) * 8);
   }
-  .pt-10 {
-    padding-top: calc(var(--spacing) * 10);
-  }
   .pr-2 {
     padding-right: calc(var(--spacing) * 2);
   }
@@ -2061,6 +2146,10 @@
     font-size: var(--text-sm);
     line-height: calc(var(--spacing) * 6);
   }
+  .text-sm\/relaxed {
+    font-size: var(--text-sm);
+    line-height: var(--leading-relaxed);
+  }
   .text-xl {
     font-size: var(--text-xl);
     line-height: var(--tw-leading, var(--text-xl--line-height));
@@ -2142,6 +2231,9 @@
     --tw-tracking: var(--tracking-widest);
     letter-spacing: var(--tracking-widest);
   }
+  .text-balance {
+    text-wrap: balance;
+  }
   .wrap-break-word {
     overflow-wrap: break-word;
   }
@@ -2187,6 +2279,12 @@
       color: color-mix(in oklab, var(--foreground) 75%, transparent);
     }
   }
+  .text-foreground\/80 {
+    color: var(--foreground);
+    @supports (color: color-mix(in lab, red, red)) {
+      color: color-mix(in oklab, var(--foreground) 80%, transparent);
+    }
+  }
   .text-foreground\/85 {
     color: var(--foreground);
     @supports (color: color-mix(in lab, red, red)) {
@@ -2205,9 +2303,15 @@
   .text-gray-200 {
     color: var(--color-gray-200);
   }
+  .text-gray-400 {
+    color: var(--color-gray-400);
+  }
   .text-gray-800 {
     color: var(--color-gray-800);
   }
+  .text-green-500 {
+    color: var(--color-green-500);
+  }
   .text-indigo-600 {
     color: var(--color-indigo-600);
   }
@@ -2229,6 +2333,9 @@
   .text-primary-foreground {
     color: var(--primary-foreground);
   }
+  .text-red-500 {
+    color: var(--color-red-500);
+  }
   .text-red-600 {
     color: var(--color-red-600);
   }
@@ -2439,6 +2546,16 @@
   .filter {
     filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
   }
+  .backdrop-blur {
+    --tw-backdrop-blur: blur(8px);
+    -webkit-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,);
+    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,);
+  }
+  .backdrop-blur-md {
+    --tw-backdrop-blur: blur(var(--blur-md));
+    -webkit-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,);
+    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,);
+  }
   .backdrop-blur-sm {
     --tw-backdrop-blur: blur(var(--blur-sm));
     -webkit-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,);
@@ -2528,6 +2645,10 @@
     --tw-duration: 500ms;
     transition-duration: 500ms;
   }
+  .duration-700 {
+    --tw-duration: 700ms;
+    transition-duration: 700ms;
+  }
   .duration-1000 {
     --tw-duration: 1000ms;
     transition-duration: 1000ms;
@@ -2554,10 +2675,39 @@
   .fade-in {
     --tw-enter-opacity: 0;
   }
+  :is(.\*\:flex > *) {
+    display: flex;
+  }
+  :is(.\*\:w-full > *) {
+    width: 100%;
+  }
+  :is(.\*\:flex-col > *) {
+    flex-direction: column;
+  }
+  :is(.\*\:items-center > *) {
+    align-items: center;
+  }
+  :is(.\*\:border-border > *) {
+    border-color: var(--border);
+  }
   .group-focus-within\/menu-item\:opacity-100:is(:where(.group\/menu-item):focus-within *) {
     opacity: 100%;
   }
   @media (hover: hover) {
+    .group-hover\:scale-105:is(:where(.group):hover *) {
+      --tw-scale-x: 105%;
+      --tw-scale-y: 105%;
+      --tw-scale-z: 105%;
+      scale: var(--tw-scale-x) var(--tw-scale-y);
+    }
+    .group-hover\:bg-black\/30:is(:where(.group):hover *) {
+      background-color: color-mix(in srgb, #000 30%, transparent);
+    }
+    @supports (color: color-mix(in lab, red, red)) {
+      .group-hover\:bg-black\/30:is(:where(.group):hover *) {
+        background-color: color-mix(in oklab, var(--color-black) 30%, transparent);
+      }
+    }
     .group-hover\/menu-item\:opacity-100:is(:where(.group\/menu-item):hover *) {
       opacity: 100%;
     }
@@ -2989,6 +3139,9 @@
         background-color: color-mix(in oklab, var(--destructive) 20%, transparent);
       }
     }
+    .hover\:bg-gray-100:hover {
+      background-color: var(--color-gray-100);
+    }
     .hover\:bg-green-600:hover {
       background-color: var(--color-green-600);
     }
@@ -3019,6 +3172,14 @@
         background-color: color-mix(in oklab, var(--muted) 60%, transparent);
       }
     }
+    .hover\:bg-muted\/80:hover {
+      background-color: var(--muted);
+    }
+    @supports (color: color-mix(in lab, red, red)) {
+      .hover\:bg-muted\/80:hover {
+        background-color: color-mix(in oklab, var(--muted) 80%, transparent);
+      }
+    }
     .hover\:bg-neutral-800:hover {
       background-color: var(--color-neutral-800);
     }
@@ -3747,12 +3908,18 @@
     .sm\:flex {
       display: flex;
     }
+    .sm\:inline-block {
+      display: inline-block;
+    }
     .sm\:w-32 {
       width: calc(var(--spacing) * 32);
     }
     .sm\:max-w-md {
       max-width: var(--container-md);
     }
+    .sm\:grid-cols-2 {
+      grid-template-columns: repeat(2, minmax(0, 1fr));
+    }
     .sm\:grid-cols-3 {
       grid-template-columns: repeat(3, minmax(0, 1fr));
     }
@@ -3810,9 +3977,15 @@
     }
   }
   @media (width >= 48rem) {
+    .md\:right-6 {
+      right: calc(var(--spacing) * 6);
+    }
     .md\:right-10 {
       right: calc(var(--spacing) * 10);
     }
+    .md\:left-6 {
+      left: calc(var(--spacing) * 6);
+    }
     .md\:col-span-2 {
       grid-column: span 2 / span 2;
     }
@@ -3825,21 +3998,33 @@
     .md\:mt-10 {
       margin-top: calc(var(--spacing) * 10);
     }
+    .md\:-mb-10 {
+      margin-bottom: calc(var(--spacing) * -10);
+    }
     .md\:block {
       display: block;
     }
     .md\:flex {
       display: flex;
     }
+    .md\:aspect-auto {
+      aspect-ratio: auto;
+    }
     .md\:h-14 {
       height: calc(var(--spacing) * 14);
     }
     .md\:h-20 {
       height: calc(var(--spacing) * 20);
     }
+    .md\:h-25 {
+      height: calc(var(--spacing) * 25);
+    }
     .md\:h-32\.5 {
       height: calc(var(--spacing) * 32.5);
     }
+    .md\:h-44 {
+      height: calc(var(--spacing) * 44);
+    }
     .md\:h-50 {
       height: calc(var(--spacing) * 50);
     }
@@ -3873,6 +4058,9 @@
     .md\:w-20 {
       width: calc(var(--spacing) * 20);
     }
+    .md\:w-25 {
+      width: calc(var(--spacing) * 25);
+    }
     .md\:w-225 {
       width: calc(var(--spacing) * 225);
     }
@@ -3882,9 +4070,15 @@
     .md\:min-w-32 {
       min-width: calc(var(--spacing) * 32);
     }
+    .md\:auto-rows-36 {
+      grid-auto-rows: calc(var(--spacing) * 36);
+    }
     .md\:grid-cols-2 {
       grid-template-columns: repeat(2, minmax(0, 1fr));
     }
+    .md\:grid-cols-3 {
+      grid-template-columns: repeat(3, minmax(0, 1fr));
+    }
     .md\:flex-row {
       flex-direction: row;
     }
@@ -3921,12 +4115,30 @@
     .md\:bg-transparent {
       background-color: transparent;
     }
+    .md\:p-6 {
+      padding: calc(var(--spacing) * 6);
+    }
+    .md\:p-8 {
+      padding: calc(var(--spacing) * 8);
+    }
+    .md\:p-10 {
+      padding: calc(var(--spacing) * 10);
+    }
     .md\:px-0 {
       padding-inline: 0px;
     }
     .md\:px-5 {
       padding-inline: calc(var(--spacing) * 5);
     }
+    .md\:pt-10 {
+      padding-top: calc(var(--spacing) * 10);
+    }
+    .md\:pb-10 {
+      padding-bottom: calc(var(--spacing) * 10);
+    }
+    .md\:pl-10 {
+      padding-left: calc(var(--spacing) * 10);
+    }
     .md\:text-left {
       text-align: left;
     }
@@ -3950,6 +4162,10 @@
       font-size: var(--text-sm);
       line-height: var(--tw-leading, var(--text-sm--line-height));
     }
+    .md\:text-xl {
+      font-size: var(--text-xl);
+      line-height: var(--tw-leading, var(--text-xl--line-height));
+    }
     .md\:text-\[14px\] {
       font-size: 14px;
     }
@@ -4020,6 +4236,9 @@
     .lg\:h-24 {
       height: calc(var(--spacing) * 24);
     }
+    .lg\:h-40 {
+      height: calc(var(--spacing) * 40);
+    }
     .lg\:h-44 {
       height: calc(var(--spacing) * 44);
     }
@@ -4035,6 +4254,9 @@
     .lg\:w-32 {
       width: calc(var(--spacing) * 32);
     }
+    .lg\:w-40 {
+      width: calc(var(--spacing) * 40);
+    }
     .lg\:w-105 {
       width: calc(var(--spacing) * 105);
     }
@@ -4047,8 +4269,11 @@
     .lg\:grid-cols-3 {
       grid-template-columns: repeat(3, minmax(0, 1fr));
     }
-    .lg\:grid-cols-\[1fr_22rem\] {
-      grid-template-columns: 1fr 22rem;
+    .lg\:grid-cols-4 {
+      grid-template-columns: repeat(4, minmax(0, 1fr));
+    }
+    .lg\:grid-cols-\[1fr_26rem\] {
+      grid-template-columns: 1fr 26rem;
     }
     .lg\:gap-10 {
       gap: calc(var(--spacing) * 10);
@@ -4059,6 +4284,15 @@
     .lg\:self-start {
       align-self: flex-start;
     }
+    .lg\:px-8 {
+      padding-inline: calc(var(--spacing) * 8);
+    }
+    .lg\:pt-20 {
+      padding-top: calc(var(--spacing) * 20);
+    }
+    .lg\:pl-12 {
+      padding-left: calc(var(--spacing) * 12);
+    }
     .lg\:text-\[80px\] {
       font-size: 80px;
     }
@@ -4070,11 +4304,17 @@
     .xl\:grid-cols-4 {
       grid-template-columns: repeat(4, minmax(0, 1fr));
     }
+    .xl\:grid-cols-5 {
+      grid-template-columns: repeat(5, minmax(0, 1fr));
+    }
   }
   @media (width >= 96rem) {
     .\32 xl\:grid-cols-5 {
       grid-template-columns: repeat(5, minmax(0, 1fr));
     }
+    .\32 xl\:grid-cols-6 {
+      grid-template-columns: repeat(6, minmax(0, 1fr));
+    }
   }
   .ltr\:fill-current:where(:dir(ltr), [dir="ltr"], [dir="ltr"] *) {
     fill: currentcolor;
@@ -4130,6 +4370,12 @@
   .dark\:bg-gray-800:is(.dark *) {
     background-color: var(--color-gray-800);
   }
+  .dark\:bg-gray-800\/60:is(.dark *) {
+    background-color: color-mix(in srgb, oklch(27.8% 0.033 256.848) 60%, transparent);
+    @supports (color: color-mix(in lab, red, red)) {
+      background-color: color-mix(in oklab, var(--color-gray-800) 60%, transparent);
+    }
+  }
   .dark\:bg-input\/30:is(.dark *) {
     background-color: var(--input);
     @supports (color: color-mix(in lab, red, red)) {
@@ -4170,6 +4416,9 @@
         background-color: color-mix(in oklab, var(--destructive) 30%, transparent);
       }
     }
+    .dark\:hover\:bg-gray-700:is(.dark *):hover {
+      background-color: var(--color-gray-700);
+    }
     .dark\:hover\:bg-input\/50:is(.dark *):hover {
       background-color: var(--input);
     }
@@ -4505,6 +4754,10 @@
     width: calc(var(--spacing) * 4);
     height: calc(var(--spacing) * 4);
   }
+  .\[\&_svg\:not\(\[class\*\=\'size-\'\]\)\]\:size-6 svg:not([class*='size-']) {
+    width: calc(var(--spacing) * 6);
+    height: calc(var(--spacing) * 6);
+  }
   .\[\&_svg\:not\(\[class\*\=\'text-\'\]\)\]\:text-muted-foreground svg:not([class*='text-']) {
     color: var(--muted-foreground);
   }
@@ -4604,6 +4857,49 @@
   :is(.data-\[variant\=destructive\]\:\*\:\[svg\]\:text-destructive[data-variant="destructive"] > *):is(svg) {
     color: var(--destructive);
   }
+  .\[\&\>\*\:nth-child\(-n\+2\)\]\:border-b > :nth-child(-n+2) {
+    border-bottom-style: var(--tw-border-style);
+    border-bottom-width: 1px;
+  }
+  .\[\&\>\*\:nth-child\(-n\+2\)\]\:pb-1 > :nth-child(-n+2) {
+    padding-bottom: var(--spacing);
+  }
+  @media (width >= 48rem) {
+    .\[\&\>\*\:nth-child\(-n\+2\)\]\:md\:pb-2\.5 > :nth-child(-n+2) {
+      padding-bottom: calc(var(--spacing) * 2.5);
+    }
+  }
+  @media (width >= 64rem) {
+    .\[\&\>\*\:nth-child\(-n\+2\)\]\:lg\:pb-5 > :nth-child(-n+2) {
+      padding-bottom: calc(var(--spacing) * 5);
+    }
+  }
+  .\[\&\>\*\:nth-child\(n\+3\)\]\:pt-1 > :nth-child(n+3) {
+    padding-top: var(--spacing);
+  }
+  @media (width >= 48rem) {
+    .\[\&\>\*\:nth-child\(n\+3\)\]\:md\:pt-2\.5 > :nth-child(n+3) {
+      padding-top: calc(var(--spacing) * 2.5);
+    }
+  }
+  @media (width >= 64rem) {
+    .\[\&\>\*\:nth-child\(n\+3\)\]\:lg\:pt-5 > :nth-child(n+3) {
+      padding-top: calc(var(--spacing) * 5);
+    }
+  }
+  .\[\&\>\*\:nth-child\(odd\)\]\:border-r > :nth-child(odd) {
+    border-right-style: var(--tw-border-style);
+    border-right-width: 1px;
+  }
+  .\[\&\>a\]\:underline > a {
+    text-decoration-line: underline;
+  }
+  .\[\&\>a\]\:underline-offset-4 > a {
+    text-underline-offset: 4px;
+  }
+  .\[\&\>a\:hover\]\:text-primary > a:hover {
+    color: var(--primary);
+  }
   .\[\&\>button\]\:hidden > button {
     display: none;
   }