@uselets/ui 0.6.1 → 1.1.0

package/dist/styles/max.css

@@ -0,0 +1,203 @@
+:root {
+  /* palette tokens */
+  --primary-50: oklch(0.969 0.015 17.418); /* #FFF1F1 */
+  --primary-100: oklch(0.932 0.034 17.784); /* #FFE0E0 */
+  --primary-200: oklch(0.857 0.078 17.808); /* #FFBCBD */
+  --primary-300: oklch(0.759 0.144 17.923); /* #FF888E */
+  --primary-400: oklch(0.678 0.201 19.93); /* #FB5562 */
+  --primary-500: oklch(0.644 0.226 23.049); /* #F93846 */
+  --primary-600: oklch(0.576 0.226 25.087); /* #E01429 */
+  --primary-700: oklch(0.507 0.2 24.989); /* #BD0E21 */
+  --primary-800: oklch(0.439 0.169 24.647); /* #9A0F1C */
+  --primary-900: oklch(0.381 0.142 23.935); /* #7D1019 */
+  --primary-950: oklch(0.248 0.092 23.922); /* #430509 */
+
+  --brand-50: oklch(0.973 0.011 39.44); /* #FDF4F1 */
+  --brand-100: oklch(0.93 0.033 38.63); /* #FDE1D8 */
+  --brand-200: oklch(0.864 0.072 39.865); /* #FDC3AF */
+  --brand-300: oklch(0.794 0.121 39); /* #FEA081 */
+  --brand-400: oklch(0.739 0.164 38.91); /* #FF8157 */
+  --brand-500: oklch(0.686 0.205 34.607); /* #FF5C35 */
+  --brand-600: oklch(0.637 0.213 35.811); /* #F0470F */
+  --brand-700: oklch(0.537 0.172 36.579); /* #BC3B10 */
+  --brand-800: oklch(0.423 0.128 37.154); /* #852C0F */
+  --brand-900: oklch(0.309 0.087 38.386); /* #531C09 */
+  --brand-950: oklch(0.216 0.051 40.042); /* #2D1006 */
+
+  --gray-50: oklch(1 0 0); /* #FFFFFF */
+  --gray-100: oklch(0.981 0.005 247.876); /* #F6F9FC */
+  --gray-200: oklch(0.952 0.01 247.935); /* #EAF0F6 */
+  --gray-300: oklch(0.915 0.016 247.999); /* #DBE4ED */
+  --gray-400: oklch(0.821 0.028 244.747); /* #B6C7D6 */
+  --gray-500: oklch(0.744 0.039 247.107); /* #99AFC4 */
+  --gray-600: oklch(0.646 0.052 249.575); /* #7691AD */
+  --gray-700: oklch(0.532 0.063 251.386); /* #516F90 */
+  --gray-800: oklch(0.454 0.055 249.121); /* #3E5974 */
+  --gray-900: oklch(0.313 0.037 246.164); /* #213343 */
+  --gray-950: oklch(0.266 0.03 245.1); /* #192733 */
+
+  --zinc-50: oklch(1 0 0); /* #FFFFFF */
+  --zinc-100: oklch(0.979 0 0); /* #F8F8F8 */
+  --zinc-200: oklch(0.952 0 0); /* #EFEFEF */
+  --zinc-300: oklch(0.885 0 0); /* #D9D9D9 */
+  --zinc-400: oklch(0.798 0 0); /* #BDBDBD */
+  --zinc-500: oklch(0.68 0 0); /* #989898 */
+  --zinc-600: oklch(0.586 0 0); /* #7C7C7C */
+  --zinc-700: oklch(0.507 0 0); /* #656565 */
+  --zinc-800: oklch(0.394 0 0); /* #464646 */
+  --zinc-900: oklch(0.305 0.002 106.504); /* #2F2F2E */
+  --zinc-950: oklch(0.207 0.004 48.535); /* #191716 */
+
+  --red-50: oklch(0.974 0.004 359.996); /* #F9F5F6 */
+  --red-100: oklch(0.928 0.016 12.798); /* #F2E3E4 */
+  --red-200: oklch(0.84 0.05 11.897); /* #E9BEC2 */
+  --red-300: oklch(0.741 0.105 13.147); /* #E58F98 */
+  --red-400: oklch(0.647 0.181 17.734); /* #E75564 */
+  --red-500: oklch(0.585 0.218 23.835); /* #E02535 */
+  --red-600: oklch(0.524 0.189 22.069); /* #BF2434 */
+  --red-700: oklch(0.45 0.161 21.978); /* #9B1C29 */
+  --red-800: oklch(0.368 0.128 20.619); /* #741520 */
+  --red-900: oklch(0.284 0.093 19.546); /* #4E0F16 */
+  --red-950: oklch(0.207 0.058 20.395); /* #2D0A0C */
+
+  --yellow-50: oklch(0.988 0.014 88.681); /* #FFFBF1 */
+  --yellow-100: oklch(0.974 0.029 89.569); /* #FEF6E1 */
+  --yellow-200: oklch(0.944 0.059 84.511); /* #FFEAC0 */
+  --yellow-300: oklch(0.885 0.104 78.009); /* #FFD189 */
+  --yellow-400: oklch(0.827 0.142 71.92); /* #FFB652 */
+  --yellow-500: oklch(0.798 0.158 67.669); /* #FFA736 */
+  --yellow-600: oklch(0.709 0.171 55.903); /* #EF7F0A */
+  --yellow-700: oklch(0.564 0.138 53.071); /* #B25A0E */
+  --yellow-800: oklch(0.433 0.1 52.359); /* #7A3E11 */
+  --yellow-900: oklch(0.324 0.069 50.591); /* #4F280F */
+  --yellow-950: oklch(0.249 0.046 47.281); /* #331A0D */
+
+  --green-50: oklch(0.98 0.003 145.55); /* #F7F9F7 */
+  --green-100: oklch(0.957 0.012 145.482); /* #ECF3EC */
+  --green-200: oklch(0.912 0.032 143.849); /* #D6E8D5 */
+  --green-300: oklch(0.838 0.073 143.695); /* #AED7AC */
+  --green-400: oklch(0.767 0.12 142.694); /* #85C780 */
+  --green-500: oklch(0.675 0.165 142.096); /* #52AF4A */
+  --green-600: oklch(0.567 0.13 141.644); /* #45893D */
+  --green-700: oklch(0.467 0.097 140.77); /* #396731 */
+  --green-800: oklch(0.366 0.066 140.101); /* #2B4725 */
+  --green-900: oklch(0.281 0.041 139.471); /* #1E2E1A */
+  --green-950: oklch(0.222 0.026 138.012); /* #151E12 */
+
+  --blue-50: oklch(0.976 0.002 247.839); /* #F6F7F8 */
+  --blue-100: oklch(0.948 0.006 255.476); /* #EBEEF2 */
+  --blue-200: oklch(0.891 0.018 240.018); /* #D1DDE6 */
+  --blue-300: oklch(0.8 0.044 240.87); /* #A5C2D8 */
+  --blue-400: oklch(0.715 0.077 240.176); /* #76AACF */
+  --blue-500: oklch(0.622 0.113 242.424); /* #408EC5 */
+  --blue-600: oklch(0.538 0.097 239.26); /* #2F75A0 */
+  --blue-700: oklch(0.452 0.072 234.642); /* #275C78 */
+  --blue-800: oklch(0.363 0.05 228.7); /* #1E4353 */
+  --blue-900: oklch(0.282 0.032 222.574); /* #162D35 */
+  --blue-950: oklch(0.224 0.021 217.756); /* #101E22 */
+
+  --indigo-50: oklch(0.969 0.009 286.225); /* #F4F4FB */
+  --indigo-100: oklch(0.924 0.026 283.478); /* #E3E4F7 */
+  --indigo-200: oklch(0.845 0.057 282.903); /* #C6C8F1 */
+  --indigo-300: oklch(0.737 0.105 281.065); /* #9EA2EB */
+  --indigo-400: oklch(0.624 0.155 278.421); /* #747AE2 */
+  --indigo-500: oklch(0.532 0.184 276.037); /* #545AD4 */
+  --indigo-600: oklch(0.46 0.163 275.857); /* #4348B0 */
+  --indigo-700: oklch(0.383 0.14 275.071); /* #31368C */
+  --indigo-800: oklch(0.3 0.109 275.563); /* #212463 */
+  --indigo-900: oklch(0.225 0.073 276.527); /* #14163D */
+  --indigo-950: oklch(0.172 0.043 278.782); /* #0C0D22 */
+
+  --pink-50: oklch(0.893 0.047 335.372);
+  --pink-100: oklch(0.839 0.076 336.368);
+  --pink-200: oklch(0.732 0.133 338.361);
+  --pink-300: oklch(0.624 0.191 340.354);
+  --pink-400: oklch(0.581 0.205 342.54);
+  --pink-500: oklch(0.538 0.22 344.727);
+  --pink-600: oklch(0.478 0.195 344.211);
+  --pink-700: oklch(0.418 0.17 343.696);
+  --pink-800: oklch(0.358 0.144 343.18);
+  --pink-900: oklch(0.298 0.119 342.664);
+  --pink-950: oklch(0.268 0.106 342.406);
+
+  /* gradient tokens */
+  --gradient-primary: linear-gradient(
+    87.14044870021029deg,
+    oklch(0.644 0.226 23.049) 0%,
+    oklch(0.686 0.205 34.607) 50%,
+    oklch(0.71 0.167 13.3) 100%
+  );
+
+  /* semantic tokens */
+  --background: var(--zinc-50);
+  --foreground: var(--zinc-950);
+  --card: var(--zinc-50);
+  --card-foreground: var(--zinc-950);
+  --popover: var(--zinc-50);
+  --popover-foreground: var(--zinc-950);
+  --primary: var(--primary-500);
+  --primary-foreground: var(--zinc-50);
+  --brand: var(--brand-500);
+  --brand-foreground: var(--zinc-50);
+  --secondary: var(--zinc-100);
+  --secondary-foreground: var(--zinc-900);
+  --muted: var(--zinc-100);
+  --muted-foreground: var(--zinc-600);
+  --accent: var(--zinc-200);
+  --accent-foreground: var(--zinc-950);
+  --destructive: var(--red-500);
+  --destructive-foreground: var(--zinc-50);
+  --border: var(--zinc-200);
+  --input: var(--zinc-200);
+  --ring: var(--primary-300);
+  --chart-1: var(--primary-500);
+  --chart-2: var(--green-500);
+  --chart-3: var(--blue-500);
+  --chart-4: var(--indigo-500);
+  --chart-5: var(--pink-500);
+  --sidebar: var(--zinc-100);
+  --sidebar-foreground: var(--zinc-950);
+  --sidebar-primary: var(--primary-500);
+  --sidebar-primary-foreground: var(--zinc-50);
+  --sidebar-accent: var(--zinc-200);
+  --sidebar-accent-foreground: var(--zinc-900);
+  --sidebar-border: var(--zinc-200);
+  --sidebar-ring: var(--primary-300);
+}
+
+.dark {
+  --background: var(--zinc-950);
+  --foreground: var(--zinc-50);
+  --card: var(--zinc-900);
+  --card-foreground: var(--zinc-50);
+  --popover: var(--zinc-900);
+  --popover-foreground: var(--zinc-50);
+  --primary: var(--primary-400);
+  --primary-foreground: var(--zinc-50);
+  --brand: var(--brand-400);
+  --brand-foreground: var(--zinc-50);
+  --secondary: var(--zinc-800);
+  --secondary-foreground: var(--zinc-50);
+  --muted: var(--zinc-800);
+  --muted-foreground: var(--zinc-300);
+  --accent: var(--zinc-800);
+  --accent-foreground: var(--zinc-50);
+  --destructive: var(--red-400);
+  --destructive-foreground: var(--zinc-950);
+  --border: var(--zinc-800);
+  --input: var(--zinc-700);
+  --ring: var(--primary-400);
+  --chart-1: var(--primary-400);
+  --chart-2: var(--green-400);
+  --chart-3: var(--blue-400);
+  --chart-4: var(--indigo-400);
+  --chart-5: var(--pink-300);
+  --sidebar: var(--zinc-900);
+  --sidebar-foreground: var(--zinc-50);
+  --sidebar-primary: var(--primary-400);
+  --sidebar-primary-foreground: var(--zinc-50);
+  --sidebar-accent: var(--zinc-800);
+  --sidebar-accent-foreground: var(--zinc-50);
+  --sidebar-border: var(--zinc-800);
+  --sidebar-ring: var(--primary-400);
+}

package/dist/styles/theme.css

@@ -0,0 +1,195 @@
+@import "tw-animate-css";
+@import "shadcn/tailwind.css";
+
+@custom-variant dark (&:is(.dark *));
+
+:root {
+  --radius: 0.875rem;
+}
+
+@theme inline {
+  --font-sans: "Inter Variable", sans-serif;
+  --text-xs: 0.75rem;
+  --text-xs--line-height: 1.125rem;
+  --text-sm: 0.875rem;
+  --text-sm--line-height: 1.3125rem;
+  --text-base: 1rem;
+  --text-base--line-height: 1.5rem;
+  --text-lg: 1.125rem;
+  --text-lg--line-height: 1.6875rem;
+  --text-xl: 1.25rem;
+  --text-xl--line-height: 1.875rem;
+  --text-2xl: 1.5rem;
+  --text-2xl--line-height: 2.25rem;
+  --text-3xl: 1.875rem;
+  --text-3xl--line-height: 2.8125rem;
+  --text-4xl: 2.25rem;
+  --text-4xl--line-height: 3.375rem;
+  --text-5xl: 3rem;
+  --text-5xl--line-height: 4.5rem;
+  --text-6xl: 3.75rem;
+  --text-6xl--line-height: 5.625rem;
+
+  --color-primary-50: var(--primary-50);
+  --color-primary-100: var(--primary-100);
+  --color-primary-200: var(--primary-200);
+  --color-primary-300: var(--primary-300);
+  --color-primary-400: var(--primary-400);
+  --color-primary-500: var(--primary-500);
+  --color-primary-600: var(--primary-600);
+  --color-primary-700: var(--primary-700);
+  --color-primary-800: var(--primary-800);
+  --color-primary-900: var(--primary-900);
+  --color-primary-950: var(--primary-950);
+
+  --color-brand-50: var(--brand-50);
+  --color-brand-100: var(--brand-100);
+  --color-brand-200: var(--brand-200);
+  --color-brand-300: var(--brand-300);
+  --color-brand-400: var(--brand-400);
+  --color-brand-500: var(--brand-500);
+  --color-brand-600: var(--brand-600);
+  --color-brand-700: var(--brand-700);
+  --color-brand-800: var(--brand-800);
+  --color-brand-900: var(--brand-900);
+  --color-brand-950: var(--brand-950);
+
+  --color-gray-50: var(--gray-50);
+  --color-gray-100: var(--gray-100);
+  --color-gray-200: var(--gray-200);
+  --color-gray-300: var(--gray-300);
+  --color-gray-400: var(--gray-400);
+  --color-gray-500: var(--gray-500);
+  --color-gray-600: var(--gray-600);
+  --color-gray-700: var(--gray-700);
+  --color-gray-800: var(--gray-800);
+  --color-gray-900: var(--gray-900);
+  --color-gray-950: var(--gray-950);
+
+  --color-zinc-50: var(--zinc-50);
+  --color-zinc-100: var(--zinc-100);
+  --color-zinc-200: var(--zinc-200);
+  --color-zinc-300: var(--zinc-300);
+  --color-zinc-400: var(--zinc-400);
+  --color-zinc-500: var(--zinc-500);
+  --color-zinc-600: var(--zinc-600);
+  --color-zinc-700: var(--zinc-700);
+  --color-zinc-800: var(--zinc-800);
+  --color-zinc-900: var(--zinc-900);
+  --color-zinc-950: var(--zinc-950);
+
+  --color-blue-50: var(--blue-50);
+  --color-blue-100: var(--blue-100);
+  --color-blue-200: var(--blue-200);
+  --color-blue-300: var(--blue-300);
+  --color-blue-400: var(--blue-400);
+  --color-blue-500: var(--blue-500);
+  --color-blue-600: var(--blue-600);
+  --color-blue-700: var(--blue-700);
+  --color-blue-800: var(--blue-800);
+  --color-blue-900: var(--blue-900);
+  --color-blue-950: var(--blue-950);
+
+  --color-indigo-50: var(--indigo-50);
+  --color-indigo-100: var(--indigo-100);
+  --color-indigo-200: var(--indigo-200);
+  --color-indigo-300: var(--indigo-300);
+  --color-indigo-400: var(--indigo-400);
+  --color-indigo-500: var(--indigo-500);
+  --color-indigo-600: var(--indigo-600);
+  --color-indigo-700: var(--indigo-700);
+  --color-indigo-800: var(--indigo-800);
+  --color-indigo-900: var(--indigo-900);
+  --color-indigo-950: var(--indigo-950);
+
+  --color-pink-50: var(--pink-50);
+  --color-pink-100: var(--pink-100);
+  --color-pink-200: var(--pink-200);
+  --color-pink-300: var(--pink-300);
+  --color-pink-400: var(--pink-400);
+  --color-pink-500: var(--pink-500);
+  --color-pink-600: var(--pink-600);
+  --color-pink-700: var(--pink-700);
+  --color-pink-800: var(--pink-800);
+  --color-pink-900: var(--pink-900);
+  --color-pink-950: var(--pink-950);
+
+  --color-red-50: var(--red-50);
+  --color-red-100: var(--red-100);
+  --color-red-200: var(--red-200);
+  --color-red-300: var(--red-300);
+  --color-red-400: var(--red-400);
+  --color-red-500: var(--red-500);
+  --color-red-600: var(--red-600);
+  --color-red-700: var(--red-700);
+  --color-red-800: var(--red-800);
+  --color-red-900: var(--red-900);
+  --color-red-950: var(--red-950);
+
+  --color-yellow-50: var(--yellow-50);
+  --color-yellow-100: var(--yellow-100);
+  --color-yellow-200: var(--yellow-200);
+  --color-yellow-300: var(--yellow-300);
+  --color-yellow-400: var(--yellow-400);
+  --color-yellow-500: var(--yellow-500);
+  --color-yellow-600: var(--yellow-600);
+  --color-yellow-700: var(--yellow-700);
+  --color-yellow-800: var(--yellow-800);
+  --color-yellow-900: var(--yellow-900);
+  --color-yellow-950: var(--yellow-950);
+
+  --color-green-50: var(--green-50);
+  --color-green-100: var(--green-100);
+  --color-green-200: var(--green-200);
+  --color-green-300: var(--green-300);
+  --color-green-400: var(--green-400);
+  --color-green-500: var(--green-500);
+  --color-green-600: var(--green-600);
+  --color-green-700: var(--green-700);
+  --color-green-800: var(--green-800);
+  --color-green-900: var(--green-900);
+  --color-green-950: var(--green-950);
+
+  --color-sidebar-ring: var(--sidebar-ring);
+  --color-sidebar-border: var(--sidebar-border);
+  --color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
+  --color-sidebar-accent: var(--sidebar-accent);
+  --color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
+  --color-sidebar-primary: var(--sidebar-primary);
+  --color-sidebar-foreground: var(--sidebar-foreground);
+  --color-sidebar: var(--sidebar);
+  --color-chart-5: var(--chart-5);
+  --color-chart-4: var(--chart-4);
+  --color-chart-3: var(--chart-3);
+  --color-chart-2: var(--chart-2);
+  --color-chart-1: var(--chart-1);
+  --color-ring: var(--ring);
+  --color-input: var(--input);
+  --color-border: var(--border);
+  --color-destructive-foreground: var(--destructive-foreground);
+  --color-destructive: var(--destructive);
+  --color-accent-foreground: var(--accent-foreground);
+  --color-accent: var(--accent);
+  --color-muted-foreground: var(--muted-foreground);
+  --color-muted: var(--muted);
+  --color-secondary-foreground: var(--secondary-foreground);
+  --color-secondary: var(--secondary);
+  --color-primary-foreground: var(--primary-foreground);
+  --color-primary: var(--primary);
+  --color-brand-foreground: var(--brand-foreground);
+  --color-brand: var(--brand);
+  --color-popover-foreground: var(--popover-foreground);
+  --color-popover: var(--popover);
+  --color-card-foreground: var(--card-foreground);
+  --color-card: var(--card);
+  --color-foreground: var(--foreground);
+  --color-background: var(--background);
+  --radius-xs: calc(var(--radius) - 4px);
+  --radius-sm: calc(var(--radius) - 2px);
+  --radius-md: var(--radius);
+  --radius-lg: calc(var(--radius) + 2px);
+  --radius-xl: calc(var(--radius) + 4px);
+  --radius-2xl: calc(var(--radius) + 8px);
+  --radius-3xl: calc(var(--radius) + 12px);
+  --radius-4xl: calc(var(--radius) + 16px);
+}