sigma-ui 1.0.15 → 1.0.17
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +23 -8
- package/__generated/registry-schemes/colors/blue.json +2 -10
- package/__generated/registry-schemes/colors/frosted-glass.json +90 -0
- package/__generated/registry-schemes/colors/grayscale.json +90 -0
- package/__generated/registry-schemes/colors/green.json +2 -10
- package/__generated/registry-schemes/colors/index.json +2 -92
- package/__generated/registry-schemes/colors/orange.json +2 -10
- package/__generated/registry-schemes/colors/red.json +2 -10
- package/__generated/registry-schemes/colors/rose.json +2 -10
- package/__generated/registry-schemes/colors/yellow.json +2 -10
- package/__generated/registry-schemes/style-system/css/alert.json +1 -1
- package/__generated/registry-schemes/style-system/css/button.json +1 -1
- package/__generated/registry-schemes/style-system/css/calendar.json +4 -4
- package/__generated/registry-schemes/style-system/css/card-lightbox.json +1 -1
- package/__generated/registry-schemes/style-system/css/combobox.json +3 -3
- package/__generated/registry-schemes/style-system/css/command.json +1 -1
- package/__generated/registry-schemes/style-system/css/context-menu.json +6 -6
- package/__generated/registry-schemes/style-system/css/dialog.json +1 -1
- package/__generated/registry-schemes/style-system/css/dropdown-menu.json +6 -6
- package/__generated/registry-schemes/style-system/css/input.json +1 -1
- package/__generated/registry-schemes/style-system/css/menubar.json +7 -7
- package/__generated/registry-schemes/style-system/css/navigation-menu.json +2 -2
- package/__generated/registry-schemes/style-system/css/number-field.json +1 -1
- package/__generated/registry-schemes/style-system/css/popover.json +1 -1
- package/__generated/registry-schemes/style-system/css/range-calendar.json +2 -2
- package/__generated/registry-schemes/style-system/css/select.json +3 -3
- package/__generated/registry-schemes/style-system/css/sheet.json +1 -1
- package/__generated/registry-schemes/style-system/css/switch.json +1 -1
- package/__generated/registry-schemes/style-system/css/tabs.json +1 -1
- package/__generated/registry-schemes/style-system/css/tags-input.json +1 -1
- package/__generated/registry-schemes/style-system/css/textarea.json +1 -1
- package/__generated/registry-schemes/style-system/css/toggle.json +1 -1
- package/__generated/registry-schemes/style-system/tailwind/button.json +1 -1
- package/__generated/registry-schemes/style-system/tailwind/calendar.json +2 -2
- package/__generated/registry-schemes/style-system/tailwind/card-lightbox.json +1 -1
- package/__generated/registry-schemes/style-system/tailwind/combobox.json +3 -3
- package/__generated/registry-schemes/style-system/tailwind/command.json +1 -1
- package/__generated/registry-schemes/style-system/tailwind/context-menu.json +6 -6
- package/__generated/registry-schemes/style-system/tailwind/dialog.json +1 -1
- package/__generated/registry-schemes/style-system/tailwind/dropdown-menu.json +6 -6
- package/__generated/registry-schemes/style-system/tailwind/input.json +1 -1
- package/__generated/registry-schemes/style-system/tailwind/menubar.json +7 -7
- package/__generated/registry-schemes/style-system/tailwind/navigation-menu.json +2 -2
- package/__generated/registry-schemes/style-system/tailwind/number-field.json +1 -1
- package/__generated/registry-schemes/style-system/tailwind/popover.json +1 -1
- package/__generated/registry-schemes/style-system/tailwind/range-calendar.json +2 -2
- package/__generated/registry-schemes/style-system/tailwind/select.json +3 -3
- package/__generated/registry-schemes/style-system/tailwind/switch.json +1 -1
- package/__generated/registry-schemes/style-system/tailwind/tabs.json +1 -1
- package/__generated/registry-schemes/style-system/tailwind/tags-input.json +1 -1
- package/__generated/registry-schemes/style-system/tailwind/textarea.json +1 -1
- package/__generated/registry-schemes/style-system/tailwind/toggle.json +1 -1
- package/dist/index.js +4 -9
- package/dist/index.js.map +1 -1
- package/package.json +10 -1
- package/__generated/registry-schemes/colors/gray.json +0 -98
- package/__generated/registry-schemes/colors/violet.json +0 -98
- package/__generated/registry-schemes/colors/zinc.json +0 -98
package/README.md
CHANGED
|
@@ -9,11 +9,18 @@ It takes away the burden of recreating the same components from scratch for ever
|
|
|
9
9
|
|
|
10
10
|
|
|
11
11
|
|
|
12
|
+
|
|
12
13
|
## About
|
|
13
14
|
|
|
14
15
|
**Website**: https://sigma-ui.dev
|
|
15
16
|
<br/>**NPM**: https://www.npmjs.com/package/sigma-ui
|
|
16
17
|
|
|
18
|
+
## Community links
|
|
19
|
+
[Discord](https://discord.gg/jH2X4VGBA4) | [YouTube](https://www.youtube.com/@sigma-dev) | [X (Twitter)](https://twitter.com/sigma__dev) | [Telegram](https://t.me/sigma_devs)
|
|
20
|
+
<br>Thanks to everyone who has been sharing this project with others!
|
|
21
|
+
|
|
22
|
+
## Features
|
|
23
|
+
|
|
17
24
|
- **Supported frameworks**: Vue, Nuxt, Laravel, Astro.
|
|
18
25
|
- **Supported languages**: TS (all components are typed, JS projects are not supported).
|
|
19
26
|
- **Supported vue versions**: 3 and above.
|
|
@@ -21,15 +28,23 @@ It takes away the burden of recreating the same components from scratch for ever
|
|
|
21
28
|
- **Is open-source**: Yes, MIT licensed.
|
|
22
29
|
- **Accessibility**: Supported.
|
|
23
30
|
- **Based upon**: Radix Vue primitives.
|
|
24
|
-
- **Installation method**: GOAT (Git Obtained As Template)
|
|
25
|
-
- **Main problem it solves**: You are a developer, you create a new project, it needs 20+ components like dialogs, selects, skeletons, etc, and they all need to follow your companies' / your own design system:
|
|
26
|
-
- **What sad devs do:** spend a year creating every component from scratch for every new project they work on, end up with a broken buggy mess of components without any basic keyboard navigation support, modals that you cannot close with Esc, and no accessibility at all.
|
|
27
|
-
- **What Beta devs do:** use a conventional library (e.g Vuetify, Quasar) and monkey patch components' css with `!important`, trying to make their components follow their design system, and failing to modify baked-in Material design and animations.
|
|
28
|
-
- **What Sigma devs do:** add these GOAT components directly to your main (or uikit) project "components" dir, spend a little time modifying their design and functionality as needed. Profit.
|
|
31
|
+
- **Installation method**: The components are distributed via the method I call GOAT (Git Obtained As Template) - run `npx` commands to clone the components from git registry directly to your project components directory. Unlike NPM modules, these components are copied from git registry directly into your project and give you full control over customization, instead of using just props and css overrides.
|
|
29
32
|
|
|
30
|
-
##
|
|
31
|
-
|
|
32
|
-
|
|
33
|
+
## Usage
|
|
34
|
+
|
|
35
|
+
Step 1: Initialize SIGMA-UI config in your project:
|
|
36
|
+
|
|
37
|
+
```
|
|
38
|
+
npx sigma-ui init
|
|
39
|
+
```
|
|
40
|
+
|
|
41
|
+
Step 2: Add components to your project:
|
|
42
|
+
|
|
43
|
+
```
|
|
44
|
+
npx sigma-ui add
|
|
45
|
+
```
|
|
46
|
+
|
|
47
|
+
Step 3: Use the added components, modify their code to your needs.
|
|
33
48
|
|
|
34
49
|
|
|
35
50
|
## Credits
|
|
@@ -13,8 +13,6 @@
|
|
|
13
13
|
"secondary-foreground": "blue-900",
|
|
14
14
|
"muted": "blue-100",
|
|
15
15
|
"muted-foreground": "blue-500",
|
|
16
|
-
"accent": "blue-100",
|
|
17
|
-
"accent-foreground": "blue-900",
|
|
18
16
|
"destructive": "red-500",
|
|
19
17
|
"destructive-foreground": "blue-50",
|
|
20
18
|
"border": "blue-200",
|
|
@@ -34,8 +32,6 @@
|
|
|
34
32
|
"secondary-foreground": "blue-50",
|
|
35
33
|
"muted": "blue-800",
|
|
36
34
|
"muted-foreground": "blue-400",
|
|
37
|
-
"accent": "blue-800",
|
|
38
|
-
"accent-foreground": "blue-50",
|
|
39
35
|
"destructive": "red-900",
|
|
40
36
|
"destructive-foreground": "blue-50",
|
|
41
37
|
"border": "blue-800",
|
|
@@ -57,8 +53,6 @@
|
|
|
57
53
|
"secondary-foreground": "224.4 64.3% 32.9%",
|
|
58
54
|
"muted": "214.3 94.6% 92.7%",
|
|
59
55
|
"muted-foreground": "217.2 91.2% 59.8%",
|
|
60
|
-
"accent": "214.3 94.6% 92.7%",
|
|
61
|
-
"accent-foreground": "224.4 64.3% 32.9%",
|
|
62
56
|
"destructive": "0 84.2% 60.2%",
|
|
63
57
|
"destructive-foreground": "213.8 100% 96.9%",
|
|
64
58
|
"border": "213.3 96.9% 87.3%",
|
|
@@ -78,8 +72,6 @@
|
|
|
78
72
|
"secondary-foreground": "213.8 100% 96.9%",
|
|
79
73
|
"muted": "225.9 70.7% 40.2%",
|
|
80
74
|
"muted-foreground": "213.1 93.9% 67.8%",
|
|
81
|
-
"accent": "225.9 70.7% 40.2%",
|
|
82
|
-
"accent-foreground": "213.8 100% 96.9%",
|
|
83
75
|
"destructive": "0 62.8% 30.6%",
|
|
84
76
|
"destructive-foreground": "213.8 100% 96.9%",
|
|
85
77
|
"border": "225.9 70.7% 40.2%",
|
|
@@ -89,10 +81,10 @@
|
|
|
89
81
|
},
|
|
90
82
|
"templates": {
|
|
91
83
|
"tailwind": {
|
|
92
|
-
"withVariables": "@import \"tailwindcss\";\n@config \"../../tailwind.config.js\";\n\n@layer base {\n /* Override Tailwind 4 default hover cursor for buttons and button-like elements */\n button:not(:disabled),\n [role=\"button\"]:not(:disabled) {\n cursor: pointer;\n }\n\n :root {\n --radius: 0.5rem;\n
|
|
84
|
+
"withVariables": "@import \"tailwindcss\";\n@config \"../../tailwind.config.js\";\n\n@layer base {\n /* Override Tailwind 4 default hover cursor for buttons and button-like elements */\n button:not(:disabled),\n [role=\"button\"]:not(:disabled) {\n cursor: pointer;\n }\n\n :root {\n --backdrop-filter-blur: 32px;\n --radius: 0.5rem;\n\n --background: 0 0% 100%;\n --foreground: 226.2 57% 21%;\n --muted: 214.3 94.6% 92.7%;\n --muted-foreground: 217.2 91.2% 59.8%;\n --popover: 0 0% 100%;\n --popover-foreground: 226.2 57% 21%;\n --card: 0 0% 100%;\n --card-foreground: 226.2 57% 21%;\n --border: 213.3 96.9% 87.3%;\n --input: 213.3 96.9% 87.3%;\n --primary: 224.4 64.3% 32.9%;\n --primary-foreground: 213.8 100% 96.9%;\n --secondary: 214.3 94.6% 92.7%;\n --secondary-foreground: 224.4 64.3% 32.9%;\n --destructive: 0 84.2% 60.2%;\n --destructive-foreground: 213.8 100% 96.9%;\n --ring: 226.2 57% 21%;\n }\n \n .dark {\n --background: 226.2 57% 21%;\n --foreground: 213.8 100% 96.9%;\n --muted: 225.9 70.7% 40.2%;\n --muted-foreground: 213.1 93.9% 67.8%;\n --popover: 226.2 57% 21%;\n --popover-foreground: 213.8 100% 96.9%;\n --card: 226.2 57% 21%;\n --card-foreground: 213.8 100% 96.9%;\n --border: 225.9 70.7% 40.2%;\n --input: 225.9 70.7% 40.2%;\n --primary: 213.8 100% 96.9%;\n --primary-foreground: 224.4 64.3% 32.9%;\n --secondary: 225.9 70.7% 40.2%;\n --secondary-foreground: 213.8 100% 96.9%;\n --destructive: 0 62.8% 30.6%;\n --destructive-foreground: 213.8 100% 96.9%;\n --ring: 211.7 96.4% 78.4%;\n }\n\n * {\n @apply border-border;\n }\n\n body {\n @apply bg-background text-foreground;\n }\n\n .fade-slide-top-enter-active,\n .fade-slide-top-leave-active {\n transition: all 0.3s ease;\n }\n\n .fade-slide-top-enter-from,\n .fade-slide-top-leave-to {\n opacity: 0;\n filter: blur(4px);\n transform: translateY(8px);\n }\n}"
|
|
93
85
|
},
|
|
94
86
|
"css": {
|
|
95
|
-
"withVariables": "@layer base {\n /* Override preflight default hover cursor for buttons and button-like elements */\n button:not(:disabled),\n [role=\"button\"]:not(:disabled) {\n cursor: pointer;\n }\n\n :root {\n --radius: 0.5rem;\n --radius-full: 9999px;\n --radius-xl: calc(var(--radius) + 4px);\n --radius-lg: var(--radius);\n --radius-md: calc(var(--radius) - 2px);\n --radius-sm: calc(var(--radius) - 4px);\n --radius-xs: min(calc(var(--radius) / 2.5), 6px);\n --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace;\n --shadow-md: \n 0 4px 6px -1px rgba(0, 0, 0, 0.02), \n 0 2px 4px -1px rgba(0, 0, 0, 0.02),\n 0 12px 24px rgba(0, 0, 0, 0.05);\n
|
|
87
|
+
"withVariables": "@layer base {\n /* Override preflight default hover cursor for buttons and button-like elements */\n button:not(:disabled),\n [role=\"button\"]:not(:disabled) {\n cursor: pointer;\n }\n \n :root {\n --backdrop-filter-blur: 32px;\n --radius: 0.5rem;\n --radius-full: 9999px;\n --radius-xl: calc(var(--radius) + 4px);\n --radius-lg: var(--radius);\n --radius-md: calc(var(--radius) - 2px);\n --radius-sm: calc(var(--radius) - 4px);\n --radius-xs: min(calc(var(--radius) / 2.5), 6px);\n --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace;\n --shadow-md: \n 0 4px 6px -1px rgba(0, 0, 0, 0.02), \n 0 2px 4px -1px rgba(0, 0, 0, 0.02),\n 0 12px 24px rgba(0, 0, 0, 0.05);\n \n --background: 0 0% 100%;\n --foreground: 226.2 57% 21%;\n --muted: 214.3 94.6% 92.7%;\n --muted-foreground: 217.2 91.2% 59.8%;\n --popover: 0 0% 100%;\n --popover-foreground: 226.2 57% 21%;\n --card: 0 0% 100%;\n --card-foreground: 226.2 57% 21%;\n --border: 213.3 96.9% 87.3%;\n --input: 213.3 96.9% 87.3%;\n --primary: 224.4 64.3% 32.9%;\n --primary-foreground: 213.8 100% 96.9%;\n --secondary: 214.3 94.6% 92.7%;\n --secondary-foreground: 224.4 64.3% 32.9%;\n --destructive: 0 84.2% 60.2%;\n --destructive-foreground: 213.8 100% 96.9%;\n --ring: 226.2 57% 21%;\n }\n \n .dark {\n --background: 226.2 57% 21%;\n --foreground: 213.8 100% 96.9%;\n --muted: 225.9 70.7% 40.2%;\n --muted-foreground: 213.1 93.9% 67.8%;\n --popover: 226.2 57% 21%;\n --popover-foreground: 213.8 100% 96.9%;\n --card: 226.2 57% 21%;\n --card-foreground: 213.8 100% 96.9%;\n --border: 225.9 70.7% 40.2%;\n --input: 225.9 70.7% 40.2%;\n --primary: 213.8 100% 96.9%;\n --primary-foreground: 224.4 64.3% 32.9%;\n --secondary: 225.9 70.7% 40.2%;\n --secondary-foreground: 213.8 100% 96.9%;\n --destructive: 0 62.8% 30.6%;\n --destructive-foreground: 213.8 100% 96.9%;\n --ring: 211.7 96.4% 78.4%;\n }\n\n * {\n border-color: hsl(var(--border));\n }\n \n body {\n background-color: hsl(var(--background));\n color: hsl(var(--foreground));\n }\n\n .sr-only {\n position: absolute;\n width: 1px;\n height: 1px;\n padding: 0;\n margin: -1px;\n overflow: hidden;\n clip: rect(0, 0, 0, 0);\n white-space: nowrap;\n border-width: 0;\n }\n \n @keyframes fade-in {\n from {\n opacity: 0;\n }\n to {\n opacity: 1;\n }\n }\n\n @keyframes spin {\n from {\n transform: rotate(0deg);\n }\n to {\n transform: rotate(360deg);\n }\n }\n\n @keyframes collapsible-down {\n from {\n height: 0;\n }\n to {\n height: var(--reka-collapsible-content-height);\n }\n }\n\n @keyframes collapsible-up {\n from {\n height: var(--reka-collapsible-content-height);\n }\n to {\n height: 0;\n }\n }\n\n .animate-fade-in {\n animation: fade-in 0.5s ease;\n }\n\n .animate-spin {\n animation: spin 1s linear infinite;\n }\n\n .fade-slide-top-enter-active,\n .fade-slide-top-leave-active {\n transition: all 0.3s ease;\n }\n\n .fade-slide-top-enter-from,\n .fade-slide-top-leave-to {\n opacity: 0;\n filter: blur(4px);\n transform: translateY(8px);\n }\n}"
|
|
96
88
|
}
|
|
97
89
|
}
|
|
98
90
|
}
|
|
@@ -0,0 +1,90 @@
|
|
|
1
|
+
{
|
|
2
|
+
"inlineColors": {
|
|
3
|
+
"light": {
|
|
4
|
+
"background": "white",
|
|
5
|
+
"foreground": "frosted-glass-950",
|
|
6
|
+
"card": "white",
|
|
7
|
+
"card-foreground": "frosted-glass-950",
|
|
8
|
+
"popover": "white",
|
|
9
|
+
"popover-foreground": "frosted-glass-950",
|
|
10
|
+
"primary": "frosted-glass-900",
|
|
11
|
+
"primary-foreground": "frosted-glass-50",
|
|
12
|
+
"secondary": "frosted-glass-100",
|
|
13
|
+
"secondary-foreground": "frosted-glass-900",
|
|
14
|
+
"muted": "frosted-glass-100",
|
|
15
|
+
"muted-foreground": "frosted-glass-500",
|
|
16
|
+
"destructive": "red-500",
|
|
17
|
+
"destructive-foreground": "frosted-glass-50",
|
|
18
|
+
"border": "frosted-glass-200",
|
|
19
|
+
"input": "frosted-glass-200",
|
|
20
|
+
"ring": "frosted-glass-950"
|
|
21
|
+
},
|
|
22
|
+
"dark": {
|
|
23
|
+
"background": "frosted-glass-950",
|
|
24
|
+
"foreground": "frosted-glass-50",
|
|
25
|
+
"card": "frosted-glass-950",
|
|
26
|
+
"card-foreground": "frosted-glass-50",
|
|
27
|
+
"popover": "frosted-glass-950",
|
|
28
|
+
"popover-foreground": "frosted-glass-50",
|
|
29
|
+
"primary": "frosted-glass-50",
|
|
30
|
+
"primary-foreground": "frosted-glass-900",
|
|
31
|
+
"secondary": "frosted-glass-800",
|
|
32
|
+
"secondary-foreground": "frosted-glass-50",
|
|
33
|
+
"muted": "frosted-glass-800",
|
|
34
|
+
"muted-foreground": "frosted-glass-400",
|
|
35
|
+
"destructive": "red-900",
|
|
36
|
+
"destructive-foreground": "frosted-glass-50",
|
|
37
|
+
"border": "frosted-glass-800",
|
|
38
|
+
"input": "frosted-glass-800",
|
|
39
|
+
"ring": "frosted-glass-300"
|
|
40
|
+
}
|
|
41
|
+
},
|
|
42
|
+
"cssVars": {
|
|
43
|
+
"light": {
|
|
44
|
+
"background": "0 0% 100%",
|
|
45
|
+
"foreground": "224 71.4% 4.1%",
|
|
46
|
+
"card": "0 0% 100%",
|
|
47
|
+
"card-foreground": "224 71.4% 4.1%",
|
|
48
|
+
"popover": "0 0% 100%",
|
|
49
|
+
"popover-foreground": "224 71.4% 4.1%",
|
|
50
|
+
"primary": "220.9 39.3% 11%",
|
|
51
|
+
"primary-foreground": "210 20% 98%",
|
|
52
|
+
"secondary": "220 14.3% 95.9%",
|
|
53
|
+
"secondary-foreground": "220.9 39.3% 11%",
|
|
54
|
+
"muted": "220 14.3% 95.9%",
|
|
55
|
+
"muted-foreground": "220 8.9% 46.1%",
|
|
56
|
+
"destructive": "0 84.2% 60.2%",
|
|
57
|
+
"destructive-foreground": "210 20% 98%",
|
|
58
|
+
"border": "220 13% 91%",
|
|
59
|
+
"input": "220 13% 91%",
|
|
60
|
+
"ring": "224 71.4% 4.1%"
|
|
61
|
+
},
|
|
62
|
+
"dark": {
|
|
63
|
+
"background": "224 71.4% 4.1%",
|
|
64
|
+
"foreground": "210 20% 98%",
|
|
65
|
+
"card": "224 71.4% 4.1%",
|
|
66
|
+
"card-foreground": "210 20% 98%",
|
|
67
|
+
"popover": "224 71.4% 4.1%",
|
|
68
|
+
"popover-foreground": "210 20% 98%",
|
|
69
|
+
"primary": "210 20% 98%",
|
|
70
|
+
"primary-foreground": "220.9 39.3% 11%",
|
|
71
|
+
"secondary": "215 27.9% 16.9%",
|
|
72
|
+
"secondary-foreground": "210 20% 98%",
|
|
73
|
+
"muted": "215 27.9% 16.9%",
|
|
74
|
+
"muted-foreground": "217.9 10.6% 64.9%",
|
|
75
|
+
"destructive": "0 62.8% 30.6%",
|
|
76
|
+
"destructive-foreground": "210 20% 98%",
|
|
77
|
+
"border": "215 27.9% 16.9%",
|
|
78
|
+
"input": "215 27.9% 16.9%",
|
|
79
|
+
"ring": "216 12.2% 83.9%"
|
|
80
|
+
}
|
|
81
|
+
},
|
|
82
|
+
"templates": {
|
|
83
|
+
"tailwind": {
|
|
84
|
+
"withVariables": "@import \"tailwindcss\";\n@config \"../../tailwind.config.js\";\n\n@layer base {\n /* Override Tailwind 4 default hover cursor for buttons and button-like elements */\n button:not(:disabled),\n [role=\"button\"]:not(:disabled) {\n cursor: pointer;\n }\n\n :root {\n --backdrop-filter-blur: 32px;\n --radius: 0.5rem;\n\n --background: 0 0% 100%;\n --foreground: 224 71.4% 4.1%;\n --muted: 220 14.3% 95.9%;\n --muted-foreground: 220 8.9% 46.1%;\n --popover: 0 0% 100%;\n --popover-foreground: 224 71.4% 4.1%;\n --card: 0 0% 100%;\n --card-foreground: 224 71.4% 4.1%;\n --border: 220 13% 91%;\n --input: 220 13% 91%;\n --primary: 220.9 39.3% 11%;\n --primary-foreground: 210 20% 98%;\n --secondary: 220 14.3% 95.9%;\n --secondary-foreground: 220.9 39.3% 11%;\n --destructive: 0 84.2% 60.2%;\n --destructive-foreground: 210 20% 98%;\n --ring: 224 71.4% 4.1%;\n }\n \n .dark {\n --background: 224 71.4% 4.1%;\n --foreground: 210 20% 98%;\n --muted: 215 27.9% 16.9%;\n --muted-foreground: 217.9 10.6% 64.9%;\n --popover: 224 71.4% 4.1%;\n --popover-foreground: 210 20% 98%;\n --card: 224 71.4% 4.1%;\n --card-foreground: 210 20% 98%;\n --border: 215 27.9% 16.9%;\n --input: 215 27.9% 16.9%;\n --primary: 210 20% 98%;\n --primary-foreground: 220.9 39.3% 11%;\n --secondary: 215 27.9% 16.9%;\n --secondary-foreground: 210 20% 98%;\n --destructive: 0 62.8% 30.6%;\n --destructive-foreground: 210 20% 98%;\n --ring: 216 12.2% 83.9%;\n }\n\n * {\n @apply border-border;\n }\n\n body {\n @apply bg-background text-foreground;\n }\n\n .fade-slide-top-enter-active,\n .fade-slide-top-leave-active {\n transition: all 0.3s ease;\n }\n\n .fade-slide-top-enter-from,\n .fade-slide-top-leave-to {\n opacity: 0;\n filter: blur(4px);\n transform: translateY(8px);\n }\n}"
|
|
85
|
+
},
|
|
86
|
+
"css": {
|
|
87
|
+
"withVariables": "@layer base {\n /* Override preflight default hover cursor for buttons and button-like elements */\n button:not(:disabled),\n [role=\"button\"]:not(:disabled) {\n cursor: pointer;\n }\n \n :root {\n --backdrop-filter-blur: 32px;\n --radius: 0.5rem;\n --radius-full: 9999px;\n --radius-xl: calc(var(--radius) + 4px);\n --radius-lg: var(--radius);\n --radius-md: calc(var(--radius) - 2px);\n --radius-sm: calc(var(--radius) - 4px);\n --radius-xs: min(calc(var(--radius) / 2.5), 6px);\n --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace;\n --shadow-md: \n 0 4px 6px -1px rgba(0, 0, 0, 0.02), \n 0 2px 4px -1px rgba(0, 0, 0, 0.02),\n 0 12px 24px rgba(0, 0, 0, 0.05);\n \n --background: 0 0% 100%;\n --foreground: 224 71.4% 4.1%;\n --muted: 220 14.3% 95.9%;\n --muted-foreground: 220 8.9% 46.1%;\n --popover: 0 0% 100%;\n --popover-foreground: 224 71.4% 4.1%;\n --card: 0 0% 100%;\n --card-foreground: 224 71.4% 4.1%;\n --border: 220 13% 91%;\n --input: 220 13% 91%;\n --primary: 220.9 39.3% 11%;\n --primary-foreground: 210 20% 98%;\n --secondary: 220 14.3% 95.9%;\n --secondary-foreground: 220.9 39.3% 11%;\n --destructive: 0 84.2% 60.2%;\n --destructive-foreground: 210 20% 98%;\n --ring: 224 71.4% 4.1%;\n }\n \n .dark {\n --background: 224 71.4% 4.1%;\n --foreground: 210 20% 98%;\n --muted: 215 27.9% 16.9%;\n --muted-foreground: 217.9 10.6% 64.9%;\n --popover: 224 71.4% 4.1%;\n --popover-foreground: 210 20% 98%;\n --card: 224 71.4% 4.1%;\n --card-foreground: 210 20% 98%;\n --border: 215 27.9% 16.9%;\n --input: 215 27.9% 16.9%;\n --primary: 210 20% 98%;\n --primary-foreground: 220.9 39.3% 11%;\n --secondary: 215 27.9% 16.9%;\n --secondary-foreground: 210 20% 98%;\n --destructive: 0 62.8% 30.6%;\n --destructive-foreground: 210 20% 98%;\n --ring: 216 12.2% 83.9%;\n }\n\n * {\n border-color: hsl(var(--border));\n }\n \n body {\n background-color: hsl(var(--background));\n color: hsl(var(--foreground));\n }\n\n .sr-only {\n position: absolute;\n width: 1px;\n height: 1px;\n padding: 0;\n margin: -1px;\n overflow: hidden;\n clip: rect(0, 0, 0, 0);\n white-space: nowrap;\n border-width: 0;\n }\n \n @keyframes fade-in {\n from {\n opacity: 0;\n }\n to {\n opacity: 1;\n }\n }\n\n @keyframes spin {\n from {\n transform: rotate(0deg);\n }\n to {\n transform: rotate(360deg);\n }\n }\n\n @keyframes collapsible-down {\n from {\n height: 0;\n }\n to {\n height: var(--reka-collapsible-content-height);\n }\n }\n\n @keyframes collapsible-up {\n from {\n height: var(--reka-collapsible-content-height);\n }\n to {\n height: 0;\n }\n }\n\n .animate-fade-in {\n animation: fade-in 0.5s ease;\n }\n\n .animate-spin {\n animation: spin 1s linear infinite;\n }\n\n .fade-slide-top-enter-active,\n .fade-slide-top-leave-active {\n transition: all 0.3s ease;\n }\n\n .fade-slide-top-enter-from,\n .fade-slide-top-leave-to {\n opacity: 0;\n filter: blur(4px);\n transform: translateY(8px);\n }\n}"
|
|
88
|
+
}
|
|
89
|
+
}
|
|
90
|
+
}
|
|
@@ -0,0 +1,90 @@
|
|
|
1
|
+
{
|
|
2
|
+
"inlineColors": {
|
|
3
|
+
"light": {
|
|
4
|
+
"background": "white",
|
|
5
|
+
"foreground": "grayscale-950",
|
|
6
|
+
"card": "white",
|
|
7
|
+
"card-foreground": "grayscale-950",
|
|
8
|
+
"popover": "white",
|
|
9
|
+
"popover-foreground": "grayscale-950",
|
|
10
|
+
"primary": "grayscale-900",
|
|
11
|
+
"primary-foreground": "grayscale-50",
|
|
12
|
+
"secondary": "grayscale-100",
|
|
13
|
+
"secondary-foreground": "grayscale-900",
|
|
14
|
+
"muted": "grayscale-100",
|
|
15
|
+
"muted-foreground": "grayscale-500",
|
|
16
|
+
"destructive": "red-500",
|
|
17
|
+
"destructive-foreground": "grayscale-50",
|
|
18
|
+
"border": "grayscale-200",
|
|
19
|
+
"input": "grayscale-200",
|
|
20
|
+
"ring": "grayscale-950"
|
|
21
|
+
},
|
|
22
|
+
"dark": {
|
|
23
|
+
"background": "grayscale-950",
|
|
24
|
+
"foreground": "grayscale-50",
|
|
25
|
+
"card": "grayscale-950",
|
|
26
|
+
"card-foreground": "grayscale-50",
|
|
27
|
+
"popover": "grayscale-950",
|
|
28
|
+
"popover-foreground": "grayscale-50",
|
|
29
|
+
"primary": "grayscale-50",
|
|
30
|
+
"primary-foreground": "grayscale-900",
|
|
31
|
+
"secondary": "grayscale-800",
|
|
32
|
+
"secondary-foreground": "grayscale-50",
|
|
33
|
+
"muted": "grayscale-800",
|
|
34
|
+
"muted-foreground": "grayscale-400",
|
|
35
|
+
"destructive": "red-900",
|
|
36
|
+
"destructive-foreground": "grayscale-50",
|
|
37
|
+
"border": "grayscale-800",
|
|
38
|
+
"input": "grayscale-800",
|
|
39
|
+
"ring": "grayscale-300"
|
|
40
|
+
}
|
|
41
|
+
},
|
|
42
|
+
"cssVars": {
|
|
43
|
+
"light": {
|
|
44
|
+
"background": "0 0% 100%",
|
|
45
|
+
"foreground": "240 10% 3.9%",
|
|
46
|
+
"card": "0 0% 100%",
|
|
47
|
+
"card-foreground": "240 10% 3.9%",
|
|
48
|
+
"popover": "0 0% 100%",
|
|
49
|
+
"popover-foreground": "240 10% 3.9%",
|
|
50
|
+
"primary": "240 5.9% 10%",
|
|
51
|
+
"primary-foreground": "0 0% 98%",
|
|
52
|
+
"secondary": "240 4.8% 95.9%",
|
|
53
|
+
"secondary-foreground": "240 5.9% 10%",
|
|
54
|
+
"muted": "240 4.8% 95.9%",
|
|
55
|
+
"muted-foreground": "240 3.8% 46.1%",
|
|
56
|
+
"destructive": "0 84.2% 60.2%",
|
|
57
|
+
"destructive-foreground": "0 0% 98%",
|
|
58
|
+
"border": "240 5.9% 90%",
|
|
59
|
+
"input": "240 5.9% 90%",
|
|
60
|
+
"ring": "240 10% 3.9%"
|
|
61
|
+
},
|
|
62
|
+
"dark": {
|
|
63
|
+
"background": "240 10% 3.9%",
|
|
64
|
+
"foreground": "0 0% 98%",
|
|
65
|
+
"card": "240 10% 3.9%",
|
|
66
|
+
"card-foreground": "0 0% 98%",
|
|
67
|
+
"popover": "240 10% 3.9%",
|
|
68
|
+
"popover-foreground": "0 0% 98%",
|
|
69
|
+
"primary": "0 0% 98%",
|
|
70
|
+
"primary-foreground": "240 5.9% 10%",
|
|
71
|
+
"secondary": "240 3.7% 15.9%",
|
|
72
|
+
"secondary-foreground": "0 0% 98%",
|
|
73
|
+
"muted": "240 3.7% 15.9%",
|
|
74
|
+
"muted-foreground": "240 5% 64.9%",
|
|
75
|
+
"destructive": "0 62.8% 30.6%",
|
|
76
|
+
"destructive-foreground": "0 0% 98%",
|
|
77
|
+
"border": "240 3.7% 15.9%",
|
|
78
|
+
"input": "240 3.7% 15.9%",
|
|
79
|
+
"ring": "240 4.9% 83.9%"
|
|
80
|
+
}
|
|
81
|
+
},
|
|
82
|
+
"templates": {
|
|
83
|
+
"tailwind": {
|
|
84
|
+
"withVariables": "@import \"tailwindcss\";\n@config \"../../tailwind.config.js\";\n\n@layer base {\n /* Override Tailwind 4 default hover cursor for buttons and button-like elements */\n button:not(:disabled),\n [role=\"button\"]:not(:disabled) {\n cursor: pointer;\n }\n\n :root {\n --backdrop-filter-blur: 32px;\n --radius: 0.5rem;\n\n --background: 0 0% 100%;\n --foreground: 240 10% 3.9%;\n --muted: 240 4.8% 95.9%;\n --muted-foreground: 240 3.8% 46.1%;\n --popover: 0 0% 100%;\n --popover-foreground: 240 10% 3.9%;\n --card: 0 0% 100%;\n --card-foreground: 240 10% 3.9%;\n --border: 240 5.9% 90%;\n --input: 240 5.9% 90%;\n --primary: 240 5.9% 10%;\n --primary-foreground: 0 0% 98%;\n --secondary: 240 4.8% 95.9%;\n --secondary-foreground: 240 5.9% 10%;\n --destructive: 0 84.2% 60.2%;\n --destructive-foreground: 0 0% 98%;\n --ring: 240 10% 3.9%;\n }\n \n .dark {\n --background: 240 10% 3.9%;\n --foreground: 0 0% 98%;\n --muted: 240 3.7% 15.9%;\n --muted-foreground: 240 5% 64.9%;\n --popover: 240 10% 3.9%;\n --popover-foreground: 0 0% 98%;\n --card: 240 10% 3.9%;\n --card-foreground: 0 0% 98%;\n --border: 240 3.7% 15.9%;\n --input: 240 3.7% 15.9%;\n --primary: 0 0% 98%;\n --primary-foreground: 240 5.9% 10%;\n --secondary: 240 3.7% 15.9%;\n --secondary-foreground: 0 0% 98%;\n --destructive: 0 62.8% 30.6%;\n --destructive-foreground: 0 0% 98%;\n --ring: 240 4.9% 83.9%;\n }\n\n * {\n @apply border-border;\n }\n\n body {\n @apply bg-background text-foreground;\n }\n\n .fade-slide-top-enter-active,\n .fade-slide-top-leave-active {\n transition: all 0.3s ease;\n }\n\n .fade-slide-top-enter-from,\n .fade-slide-top-leave-to {\n opacity: 0;\n filter: blur(4px);\n transform: translateY(8px);\n }\n}"
|
|
85
|
+
},
|
|
86
|
+
"css": {
|
|
87
|
+
"withVariables": "@layer base {\n /* Override preflight default hover cursor for buttons and button-like elements */\n button:not(:disabled),\n [role=\"button\"]:not(:disabled) {\n cursor: pointer;\n }\n \n :root {\n --backdrop-filter-blur: 32px;\n --radius: 0.5rem;\n --radius-full: 9999px;\n --radius-xl: calc(var(--radius) + 4px);\n --radius-lg: var(--radius);\n --radius-md: calc(var(--radius) - 2px);\n --radius-sm: calc(var(--radius) - 4px);\n --radius-xs: min(calc(var(--radius) / 2.5), 6px);\n --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace;\n --shadow-md: \n 0 4px 6px -1px rgba(0, 0, 0, 0.02), \n 0 2px 4px -1px rgba(0, 0, 0, 0.02),\n 0 12px 24px rgba(0, 0, 0, 0.05);\n \n --background: 0 0% 100%;\n --foreground: 240 10% 3.9%;\n --muted: 240 4.8% 95.9%;\n --muted-foreground: 240 3.8% 46.1%;\n --popover: 0 0% 100%;\n --popover-foreground: 240 10% 3.9%;\n --card: 0 0% 100%;\n --card-foreground: 240 10% 3.9%;\n --border: 240 5.9% 90%;\n --input: 240 5.9% 90%;\n --primary: 240 5.9% 10%;\n --primary-foreground: 0 0% 98%;\n --secondary: 240 4.8% 95.9%;\n --secondary-foreground: 240 5.9% 10%;\n --destructive: 0 84.2% 60.2%;\n --destructive-foreground: 0 0% 98%;\n --ring: 240 10% 3.9%;\n }\n \n .dark {\n --background: 240 10% 3.9%;\n --foreground: 0 0% 98%;\n --muted: 240 3.7% 15.9%;\n --muted-foreground: 240 5% 64.9%;\n --popover: 240 10% 3.9%;\n --popover-foreground: 0 0% 98%;\n --card: 240 10% 3.9%;\n --card-foreground: 0 0% 98%;\n --border: 240 3.7% 15.9%;\n --input: 240 3.7% 15.9%;\n --primary: 0 0% 98%;\n --primary-foreground: 240 5.9% 10%;\n --secondary: 240 3.7% 15.9%;\n --secondary-foreground: 0 0% 98%;\n --destructive: 0 62.8% 30.6%;\n --destructive-foreground: 0 0% 98%;\n --ring: 240 4.9% 83.9%;\n }\n\n * {\n border-color: hsl(var(--border));\n }\n \n body {\n background-color: hsl(var(--background));\n color: hsl(var(--foreground));\n }\n\n .sr-only {\n position: absolute;\n width: 1px;\n height: 1px;\n padding: 0;\n margin: -1px;\n overflow: hidden;\n clip: rect(0, 0, 0, 0);\n white-space: nowrap;\n border-width: 0;\n }\n \n @keyframes fade-in {\n from {\n opacity: 0;\n }\n to {\n opacity: 1;\n }\n }\n\n @keyframes spin {\n from {\n transform: rotate(0deg);\n }\n to {\n transform: rotate(360deg);\n }\n }\n\n @keyframes collapsible-down {\n from {\n height: 0;\n }\n to {\n height: var(--reka-collapsible-content-height);\n }\n }\n\n @keyframes collapsible-up {\n from {\n height: var(--reka-collapsible-content-height);\n }\n to {\n height: 0;\n }\n }\n\n .animate-fade-in {\n animation: fade-in 0.5s ease;\n }\n\n .animate-spin {\n animation: spin 1s linear infinite;\n }\n\n .fade-slide-top-enter-active,\n .fade-slide-top-leave-active {\n transition: all 0.3s ease;\n }\n\n .fade-slide-top-enter-from,\n .fade-slide-top-leave-to {\n opacity: 0;\n filter: blur(4px);\n transform: translateY(8px);\n }\n}"
|
|
88
|
+
}
|
|
89
|
+
}
|
|
90
|
+
}
|
|
@@ -13,8 +13,6 @@
|
|
|
13
13
|
"secondary-foreground": "green-900",
|
|
14
14
|
"muted": "green-100",
|
|
15
15
|
"muted-foreground": "green-500",
|
|
16
|
-
"accent": "green-100",
|
|
17
|
-
"accent-foreground": "green-900",
|
|
18
16
|
"destructive": "red-500",
|
|
19
17
|
"destructive-foreground": "green-50",
|
|
20
18
|
"border": "green-200",
|
|
@@ -34,8 +32,6 @@
|
|
|
34
32
|
"secondary-foreground": "green-50",
|
|
35
33
|
"muted": "green-800",
|
|
36
34
|
"muted-foreground": "green-400",
|
|
37
|
-
"accent": "green-800",
|
|
38
|
-
"accent-foreground": "green-50",
|
|
39
35
|
"destructive": "red-900",
|
|
40
36
|
"destructive-foreground": "green-50",
|
|
41
37
|
"border": "green-800",
|
|
@@ -57,8 +53,6 @@
|
|
|
57
53
|
"secondary-foreground": "143.8 61.2% 20.2%",
|
|
58
54
|
"muted": "140.6 84.2% 92.5%",
|
|
59
55
|
"muted-foreground": "142.1 70.6% 45.3%",
|
|
60
|
-
"accent": "140.6 84.2% 92.5%",
|
|
61
|
-
"accent-foreground": "143.8 61.2% 20.2%",
|
|
62
56
|
"destructive": "0 84.2% 60.2%",
|
|
63
57
|
"destructive-foreground": "138.5 76.5% 96.7%",
|
|
64
58
|
"border": "141 78.9% 85.1%",
|
|
@@ -78,8 +72,6 @@
|
|
|
78
72
|
"secondary-foreground": "138.5 76.5% 96.7%",
|
|
79
73
|
"muted": "142.8 64.2% 24.1%",
|
|
80
74
|
"muted-foreground": "141.9 69.2% 58%",
|
|
81
|
-
"accent": "142.8 64.2% 24.1%",
|
|
82
|
-
"accent-foreground": "138.5 76.5% 96.7%",
|
|
83
75
|
"destructive": "0 62.8% 30.6%",
|
|
84
76
|
"destructive-foreground": "138.5 76.5% 96.7%",
|
|
85
77
|
"border": "142.8 64.2% 24.1%",
|
|
@@ -89,10 +81,10 @@
|
|
|
89
81
|
},
|
|
90
82
|
"templates": {
|
|
91
83
|
"tailwind": {
|
|
92
|
-
"withVariables": "@import \"tailwindcss\";\n@config \"../../tailwind.config.js\";\n\n@layer base {\n /* Override Tailwind 4 default hover cursor for buttons and button-like elements */\n button:not(:disabled),\n [role=\"button\"]:not(:disabled) {\n cursor: pointer;\n }\n\n :root {\n --radius: 0.5rem;\n
|
|
84
|
+
"withVariables": "@import \"tailwindcss\";\n@config \"../../tailwind.config.js\";\n\n@layer base {\n /* Override Tailwind 4 default hover cursor for buttons and button-like elements */\n button:not(:disabled),\n [role=\"button\"]:not(:disabled) {\n cursor: pointer;\n }\n\n :root {\n --backdrop-filter-blur: 32px;\n --radius: 0.5rem;\n\n --background: 0 0% 100%;\n --foreground: 144.9 80.4% 10%;\n --muted: 140.6 84.2% 92.5%;\n --muted-foreground: 142.1 70.6% 45.3%;\n --popover: 0 0% 100%;\n --popover-foreground: 144.9 80.4% 10%;\n --card: 0 0% 100%;\n --card-foreground: 144.9 80.4% 10%;\n --border: 141 78.9% 85.1%;\n --input: 141 78.9% 85.1%;\n --primary: 143.8 61.2% 20.2%;\n --primary-foreground: 138.5 76.5% 96.7%;\n --secondary: 140.6 84.2% 92.5%;\n --secondary-foreground: 143.8 61.2% 20.2%;\n --destructive: 0 84.2% 60.2%;\n --destructive-foreground: 138.5 76.5% 96.7%;\n --ring: 144.9 80.4% 10%;\n }\n \n .dark {\n --background: 144.9 80.4% 10%;\n --foreground: 138.5 76.5% 96.7%;\n --muted: 142.8 64.2% 24.1%;\n --muted-foreground: 141.9 69.2% 58%;\n --popover: 144.9 80.4% 10%;\n --popover-foreground: 138.5 76.5% 96.7%;\n --card: 144.9 80.4% 10%;\n --card-foreground: 138.5 76.5% 96.7%;\n --border: 142.8 64.2% 24.1%;\n --input: 142.8 64.2% 24.1%;\n --primary: 138.5 76.5% 96.7%;\n --primary-foreground: 143.8 61.2% 20.2%;\n --secondary: 142.8 64.2% 24.1%;\n --secondary-foreground: 138.5 76.5% 96.7%;\n --destructive: 0 62.8% 30.6%;\n --destructive-foreground: 138.5 76.5% 96.7%;\n --ring: 141.7 76.6% 73.1%;\n }\n\n * {\n @apply border-border;\n }\n\n body {\n @apply bg-background text-foreground;\n }\n\n .fade-slide-top-enter-active,\n .fade-slide-top-leave-active {\n transition: all 0.3s ease;\n }\n\n .fade-slide-top-enter-from,\n .fade-slide-top-leave-to {\n opacity: 0;\n filter: blur(4px);\n transform: translateY(8px);\n }\n}"
|
|
93
85
|
},
|
|
94
86
|
"css": {
|
|
95
|
-
"withVariables": "@layer base {\n /* Override preflight default hover cursor for buttons and button-like elements */\n button:not(:disabled),\n [role=\"button\"]:not(:disabled) {\n cursor: pointer;\n }\n\n :root {\n --radius: 0.5rem;\n --radius-full: 9999px;\n --radius-xl: calc(var(--radius) + 4px);\n --radius-lg: var(--radius);\n --radius-md: calc(var(--radius) - 2px);\n --radius-sm: calc(var(--radius) - 4px);\n --radius-xs: min(calc(var(--radius) / 2.5), 6px);\n --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace;\n --shadow-md: \n 0 4px 6px -1px rgba(0, 0, 0, 0.02), \n 0 2px 4px -1px rgba(0, 0, 0, 0.02),\n 0 12px 24px rgba(0, 0, 0, 0.05);\n
|
|
87
|
+
"withVariables": "@layer base {\n /* Override preflight default hover cursor for buttons and button-like elements */\n button:not(:disabled),\n [role=\"button\"]:not(:disabled) {\n cursor: pointer;\n }\n \n :root {\n --backdrop-filter-blur: 32px;\n --radius: 0.5rem;\n --radius-full: 9999px;\n --radius-xl: calc(var(--radius) + 4px);\n --radius-lg: var(--radius);\n --radius-md: calc(var(--radius) - 2px);\n --radius-sm: calc(var(--radius) - 4px);\n --radius-xs: min(calc(var(--radius) / 2.5), 6px);\n --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace;\n --shadow-md: \n 0 4px 6px -1px rgba(0, 0, 0, 0.02), \n 0 2px 4px -1px rgba(0, 0, 0, 0.02),\n 0 12px 24px rgba(0, 0, 0, 0.05);\n \n --background: 0 0% 100%;\n --foreground: 144.9 80.4% 10%;\n --muted: 140.6 84.2% 92.5%;\n --muted-foreground: 142.1 70.6% 45.3%;\n --popover: 0 0% 100%;\n --popover-foreground: 144.9 80.4% 10%;\n --card: 0 0% 100%;\n --card-foreground: 144.9 80.4% 10%;\n --border: 141 78.9% 85.1%;\n --input: 141 78.9% 85.1%;\n --primary: 143.8 61.2% 20.2%;\n --primary-foreground: 138.5 76.5% 96.7%;\n --secondary: 140.6 84.2% 92.5%;\n --secondary-foreground: 143.8 61.2% 20.2%;\n --destructive: 0 84.2% 60.2%;\n --destructive-foreground: 138.5 76.5% 96.7%;\n --ring: 144.9 80.4% 10%;\n }\n \n .dark {\n --background: 144.9 80.4% 10%;\n --foreground: 138.5 76.5% 96.7%;\n --muted: 142.8 64.2% 24.1%;\n --muted-foreground: 141.9 69.2% 58%;\n --popover: 144.9 80.4% 10%;\n --popover-foreground: 138.5 76.5% 96.7%;\n --card: 144.9 80.4% 10%;\n --card-foreground: 138.5 76.5% 96.7%;\n --border: 142.8 64.2% 24.1%;\n --input: 142.8 64.2% 24.1%;\n --primary: 138.5 76.5% 96.7%;\n --primary-foreground: 143.8 61.2% 20.2%;\n --secondary: 142.8 64.2% 24.1%;\n --secondary-foreground: 138.5 76.5% 96.7%;\n --destructive: 0 62.8% 30.6%;\n --destructive-foreground: 138.5 76.5% 96.7%;\n --ring: 141.7 76.6% 73.1%;\n }\n\n * {\n border-color: hsl(var(--border));\n }\n \n body {\n background-color: hsl(var(--background));\n color: hsl(var(--foreground));\n }\n\n .sr-only {\n position: absolute;\n width: 1px;\n height: 1px;\n padding: 0;\n margin: -1px;\n overflow: hidden;\n clip: rect(0, 0, 0, 0);\n white-space: nowrap;\n border-width: 0;\n }\n \n @keyframes fade-in {\n from {\n opacity: 0;\n }\n to {\n opacity: 1;\n }\n }\n\n @keyframes spin {\n from {\n transform: rotate(0deg);\n }\n to {\n transform: rotate(360deg);\n }\n }\n\n @keyframes collapsible-down {\n from {\n height: 0;\n }\n to {\n height: var(--reka-collapsible-content-height);\n }\n }\n\n @keyframes collapsible-up {\n from {\n height: var(--reka-collapsible-content-height);\n }\n to {\n height: 0;\n }\n }\n\n .animate-fade-in {\n animation: fade-in 0.5s ease;\n }\n\n .animate-spin {\n animation: spin 1s linear infinite;\n }\n\n .fade-slide-top-enter-active,\n .fade-slide-top-leave-active {\n transition: all 0.3s ease;\n }\n\n .fade-slide-top-enter-from,\n .fade-slide-top-leave-to {\n opacity: 0;\n filter: blur(4px);\n transform: translateY(8px);\n }\n}"
|
|
96
88
|
}
|
|
97
89
|
}
|
|
98
90
|
}
|
|
@@ -16,7 +16,7 @@
|
|
|
16
16
|
"rgbChannel": "255 255 255",
|
|
17
17
|
"hslChannel": "0 0% 100%"
|
|
18
18
|
},
|
|
19
|
-
"
|
|
19
|
+
"frosted-glass": [
|
|
20
20
|
{
|
|
21
21
|
"scale": 50,
|
|
22
22
|
"hex": "#f9fafb",
|
|
@@ -106,7 +106,7 @@
|
|
|
106
106
|
"hslChannel": "224 71.4% 4.1%"
|
|
107
107
|
}
|
|
108
108
|
],
|
|
109
|
-
"
|
|
109
|
+
"grayscale": [
|
|
110
110
|
{
|
|
111
111
|
"scale": 50,
|
|
112
112
|
"hex": "#fafafa",
|
|
@@ -646,96 +646,6 @@
|
|
|
646
646
|
"hslChannel": "226.2 57% 21%"
|
|
647
647
|
}
|
|
648
648
|
],
|
|
649
|
-
"violet": [
|
|
650
|
-
{
|
|
651
|
-
"scale": 50,
|
|
652
|
-
"hex": "#f5f3ff",
|
|
653
|
-
"rgb": "rgb(245,243,255)",
|
|
654
|
-
"hsl": "hsl(250,100%,97.6%)",
|
|
655
|
-
"rgbChannel": "245 243 255",
|
|
656
|
-
"hslChannel": "250 100% 97.6%"
|
|
657
|
-
},
|
|
658
|
-
{
|
|
659
|
-
"scale": 100,
|
|
660
|
-
"hex": "#ede9fe",
|
|
661
|
-
"rgb": "rgb(237,233,254)",
|
|
662
|
-
"hsl": "hsl(251.4,91.3%,95.5%)",
|
|
663
|
-
"rgbChannel": "237 233 254",
|
|
664
|
-
"hslChannel": "251.4 91.3% 95.5%"
|
|
665
|
-
},
|
|
666
|
-
{
|
|
667
|
-
"scale": 200,
|
|
668
|
-
"hex": "#ddd6fe",
|
|
669
|
-
"rgb": "rgb(221,214,254)",
|
|
670
|
-
"hsl": "hsl(250.5,95.2%,91.8%)",
|
|
671
|
-
"rgbChannel": "221 214 254",
|
|
672
|
-
"hslChannel": "250.5 95.2% 91.8%"
|
|
673
|
-
},
|
|
674
|
-
{
|
|
675
|
-
"scale": 300,
|
|
676
|
-
"hex": "#c4b5fd",
|
|
677
|
-
"rgb": "rgb(196,181,253)",
|
|
678
|
-
"hsl": "hsl(252.5,94.7%,85.1%)",
|
|
679
|
-
"rgbChannel": "196 181 253",
|
|
680
|
-
"hslChannel": "252.5 94.7% 85.1%"
|
|
681
|
-
},
|
|
682
|
-
{
|
|
683
|
-
"scale": 400,
|
|
684
|
-
"hex": "#a78bfa",
|
|
685
|
-
"rgb": "rgb(167,139,250)",
|
|
686
|
-
"hsl": "hsl(255.1,91.7%,76.3%)",
|
|
687
|
-
"rgbChannel": "167 139 250",
|
|
688
|
-
"hslChannel": "255.1 91.7% 76.3%"
|
|
689
|
-
},
|
|
690
|
-
{
|
|
691
|
-
"scale": 500,
|
|
692
|
-
"hex": "#8b5cf6",
|
|
693
|
-
"rgb": "rgb(139,92,246)",
|
|
694
|
-
"hsl": "hsl(258.3,89.5%,66.3%)",
|
|
695
|
-
"rgbChannel": "139 92 246",
|
|
696
|
-
"hslChannel": "258.3 89.5% 66.3%"
|
|
697
|
-
},
|
|
698
|
-
{
|
|
699
|
-
"scale": 600,
|
|
700
|
-
"hex": "#7c3aed",
|
|
701
|
-
"rgb": "rgb(124,58,237)",
|
|
702
|
-
"hsl": "hsl(262.1,83.3%,57.8%)",
|
|
703
|
-
"rgbChannel": "124 58 237",
|
|
704
|
-
"hslChannel": "262.1 83.3% 57.8%"
|
|
705
|
-
},
|
|
706
|
-
{
|
|
707
|
-
"scale": 700,
|
|
708
|
-
"hex": "#6d28d9",
|
|
709
|
-
"rgb": "rgb(109,40,217)",
|
|
710
|
-
"hsl": "hsl(263.4,70%,50.4%)",
|
|
711
|
-
"rgbChannel": "109 40 217",
|
|
712
|
-
"hslChannel": "263.4 70% 50.4%"
|
|
713
|
-
},
|
|
714
|
-
{
|
|
715
|
-
"scale": 800,
|
|
716
|
-
"hex": "#5b21b6",
|
|
717
|
-
"rgb": "rgb(91,33,182)",
|
|
718
|
-
"hsl": "hsl(263.4,69.3%,42.2%)",
|
|
719
|
-
"rgbChannel": "91 33 182",
|
|
720
|
-
"hslChannel": "263.4 69.3% 42.2%"
|
|
721
|
-
},
|
|
722
|
-
{
|
|
723
|
-
"scale": 900,
|
|
724
|
-
"hex": "#4c1d95",
|
|
725
|
-
"rgb": "rgb(76,29,149)",
|
|
726
|
-
"hsl": "hsl(263.5,67.4%,34.9%)",
|
|
727
|
-
"rgbChannel": "76 29 149",
|
|
728
|
-
"hslChannel": "263.5 67.4% 34.9%"
|
|
729
|
-
},
|
|
730
|
-
{
|
|
731
|
-
"scale": 950,
|
|
732
|
-
"hex": "#1e1b4b",
|
|
733
|
-
"rgb": "rgb(46,16,101)",
|
|
734
|
-
"hsl": "hsl(261.2,72.6%,22.9%)",
|
|
735
|
-
"rgbChannel": "46 16 101",
|
|
736
|
-
"hslChannel": "261.2 72.6% 22.9%"
|
|
737
|
-
}
|
|
738
|
-
],
|
|
739
649
|
"rose": [
|
|
740
650
|
{
|
|
741
651
|
"scale": 50,
|
|
@@ -13,8 +13,6 @@
|
|
|
13
13
|
"secondary-foreground": "orange-900",
|
|
14
14
|
"muted": "orange-100",
|
|
15
15
|
"muted-foreground": "orange-500",
|
|
16
|
-
"accent": "orange-100",
|
|
17
|
-
"accent-foreground": "orange-900",
|
|
18
16
|
"destructive": "red-500",
|
|
19
17
|
"destructive-foreground": "orange-50",
|
|
20
18
|
"border": "orange-200",
|
|
@@ -34,8 +32,6 @@
|
|
|
34
32
|
"secondary-foreground": "orange-50",
|
|
35
33
|
"muted": "orange-800",
|
|
36
34
|
"muted-foreground": "orange-400",
|
|
37
|
-
"accent": "orange-800",
|
|
38
|
-
"accent-foreground": "orange-50",
|
|
39
35
|
"destructive": "red-900",
|
|
40
36
|
"destructive-foreground": "orange-50",
|
|
41
37
|
"border": "orange-800",
|
|
@@ -57,8 +53,6 @@
|
|
|
57
53
|
"secondary-foreground": "15.3 74.6% 27.8%",
|
|
58
54
|
"muted": "34.3 100% 91.8%",
|
|
59
55
|
"muted-foreground": "24.6 95% 53.1%",
|
|
60
|
-
"accent": "34.3 100% 91.8%",
|
|
61
|
-
"accent-foreground": "15.3 74.6% 27.8%",
|
|
62
56
|
"destructive": "0 84.2% 60.2%",
|
|
63
57
|
"destructive-foreground": "33.3 100% 96.5%",
|
|
64
58
|
"border": "32.1 97.7% 83.1%",
|
|
@@ -78,8 +72,6 @@
|
|
|
78
72
|
"secondary-foreground": "33.3 100% 96.5%",
|
|
79
73
|
"muted": "15 79.1% 33.7%",
|
|
80
74
|
"muted-foreground": "27 96% 61%",
|
|
81
|
-
"accent": "15 79.1% 33.7%",
|
|
82
|
-
"accent-foreground": "33.3 100% 96.5%",
|
|
83
75
|
"destructive": "0 62.8% 30.6%",
|
|
84
76
|
"destructive-foreground": "33.3 100% 96.5%",
|
|
85
77
|
"border": "15 79.1% 33.7%",
|
|
@@ -89,10 +81,10 @@
|
|
|
89
81
|
},
|
|
90
82
|
"templates": {
|
|
91
83
|
"tailwind": {
|
|
92
|
-
"withVariables": "@import \"tailwindcss\";\n@config \"../../tailwind.config.js\";\n\n@layer base {\n /* Override Tailwind 4 default hover cursor for buttons and button-like elements */\n button:not(:disabled),\n [role=\"button\"]:not(:disabled) {\n cursor: pointer;\n }\n\n :root {\n --radius: 0.5rem;\n
|
|
84
|
+
"withVariables": "@import \"tailwindcss\";\n@config \"../../tailwind.config.js\";\n\n@layer base {\n /* Override Tailwind 4 default hover cursor for buttons and button-like elements */\n button:not(:disabled),\n [role=\"button\"]:not(:disabled) {\n cursor: pointer;\n }\n\n :root {\n --backdrop-filter-blur: 32px;\n --radius: 0.5rem;\n\n --background: 0 0% 100%;\n --foreground: 13 81.1% 14.5%;\n --muted: 34.3 100% 91.8%;\n --muted-foreground: 24.6 95% 53.1%;\n --popover: 0 0% 100%;\n --popover-foreground: 13 81.1% 14.5%;\n --card: 0 0% 100%;\n --card-foreground: 13 81.1% 14.5%;\n --border: 32.1 97.7% 83.1%;\n --input: 32.1 97.7% 83.1%;\n --primary: 15.3 74.6% 27.8%;\n --primary-foreground: 33.3 100% 96.5%;\n --secondary: 34.3 100% 91.8%;\n --secondary-foreground: 15.3 74.6% 27.8%;\n --destructive: 0 84.2% 60.2%;\n --destructive-foreground: 33.3 100% 96.5%;\n --ring: 13 81.1% 14.5%;\n }\n \n .dark {\n --background: 13 81.1% 14.5%;\n --foreground: 33.3 100% 96.5%;\n --muted: 15 79.1% 33.7%;\n --muted-foreground: 27 96% 61%;\n --popover: 13 81.1% 14.5%;\n --popover-foreground: 33.3 100% 96.5%;\n --card: 13 81.1% 14.5%;\n --card-foreground: 33.3 100% 96.5%;\n --border: 15 79.1% 33.7%;\n --input: 15 79.1% 33.7%;\n --primary: 33.3 100% 96.5%;\n --primary-foreground: 15.3 74.6% 27.8%;\n --secondary: 15 79.1% 33.7%;\n --secondary-foreground: 33.3 100% 96.5%;\n --destructive: 0 62.8% 30.6%;\n --destructive-foreground: 33.3 100% 96.5%;\n --ring: 30.7 97.2% 72.4%;\n }\n\n * {\n @apply border-border;\n }\n\n body {\n @apply bg-background text-foreground;\n }\n\n .fade-slide-top-enter-active,\n .fade-slide-top-leave-active {\n transition: all 0.3s ease;\n }\n\n .fade-slide-top-enter-from,\n .fade-slide-top-leave-to {\n opacity: 0;\n filter: blur(4px);\n transform: translateY(8px);\n }\n}"
|
|
93
85
|
},
|
|
94
86
|
"css": {
|
|
95
|
-
"withVariables": "@layer base {\n /* Override preflight default hover cursor for buttons and button-like elements */\n button:not(:disabled),\n [role=\"button\"]:not(:disabled) {\n cursor: pointer;\n }\n\n :root {\n --radius: 0.5rem;\n --radius-full: 9999px;\n --radius-xl: calc(var(--radius) + 4px);\n --radius-lg: var(--radius);\n --radius-md: calc(var(--radius) - 2px);\n --radius-sm: calc(var(--radius) - 4px);\n --radius-xs: min(calc(var(--radius) / 2.5), 6px);\n --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace;\n --shadow-md: \n 0 4px 6px -1px rgba(0, 0, 0, 0.02), \n 0 2px 4px -1px rgba(0, 0, 0, 0.02),\n 0 12px 24px rgba(0, 0, 0, 0.05);\n
|
|
87
|
+
"withVariables": "@layer base {\n /* Override preflight default hover cursor for buttons and button-like elements */\n button:not(:disabled),\n [role=\"button\"]:not(:disabled) {\n cursor: pointer;\n }\n \n :root {\n --backdrop-filter-blur: 32px;\n --radius: 0.5rem;\n --radius-full: 9999px;\n --radius-xl: calc(var(--radius) + 4px);\n --radius-lg: var(--radius);\n --radius-md: calc(var(--radius) - 2px);\n --radius-sm: calc(var(--radius) - 4px);\n --radius-xs: min(calc(var(--radius) / 2.5), 6px);\n --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace;\n --shadow-md: \n 0 4px 6px -1px rgba(0, 0, 0, 0.02), \n 0 2px 4px -1px rgba(0, 0, 0, 0.02),\n 0 12px 24px rgba(0, 0, 0, 0.05);\n \n --background: 0 0% 100%;\n --foreground: 13 81.1% 14.5%;\n --muted: 34.3 100% 91.8%;\n --muted-foreground: 24.6 95% 53.1%;\n --popover: 0 0% 100%;\n --popover-foreground: 13 81.1% 14.5%;\n --card: 0 0% 100%;\n --card-foreground: 13 81.1% 14.5%;\n --border: 32.1 97.7% 83.1%;\n --input: 32.1 97.7% 83.1%;\n --primary: 15.3 74.6% 27.8%;\n --primary-foreground: 33.3 100% 96.5%;\n --secondary: 34.3 100% 91.8%;\n --secondary-foreground: 15.3 74.6% 27.8%;\n --destructive: 0 84.2% 60.2%;\n --destructive-foreground: 33.3 100% 96.5%;\n --ring: 13 81.1% 14.5%;\n }\n \n .dark {\n --background: 13 81.1% 14.5%;\n --foreground: 33.3 100% 96.5%;\n --muted: 15 79.1% 33.7%;\n --muted-foreground: 27 96% 61%;\n --popover: 13 81.1% 14.5%;\n --popover-foreground: 33.3 100% 96.5%;\n --card: 13 81.1% 14.5%;\n --card-foreground: 33.3 100% 96.5%;\n --border: 15 79.1% 33.7%;\n --input: 15 79.1% 33.7%;\n --primary: 33.3 100% 96.5%;\n --primary-foreground: 15.3 74.6% 27.8%;\n --secondary: 15 79.1% 33.7%;\n --secondary-foreground: 33.3 100% 96.5%;\n --destructive: 0 62.8% 30.6%;\n --destructive-foreground: 33.3 100% 96.5%;\n --ring: 30.7 97.2% 72.4%;\n }\n\n * {\n border-color: hsl(var(--border));\n }\n \n body {\n background-color: hsl(var(--background));\n color: hsl(var(--foreground));\n }\n\n .sr-only {\n position: absolute;\n width: 1px;\n height: 1px;\n padding: 0;\n margin: -1px;\n overflow: hidden;\n clip: rect(0, 0, 0, 0);\n white-space: nowrap;\n border-width: 0;\n }\n \n @keyframes fade-in {\n from {\n opacity: 0;\n }\n to {\n opacity: 1;\n }\n }\n\n @keyframes spin {\n from {\n transform: rotate(0deg);\n }\n to {\n transform: rotate(360deg);\n }\n }\n\n @keyframes collapsible-down {\n from {\n height: 0;\n }\n to {\n height: var(--reka-collapsible-content-height);\n }\n }\n\n @keyframes collapsible-up {\n from {\n height: var(--reka-collapsible-content-height);\n }\n to {\n height: 0;\n }\n }\n\n .animate-fade-in {\n animation: fade-in 0.5s ease;\n }\n\n .animate-spin {\n animation: spin 1s linear infinite;\n }\n\n .fade-slide-top-enter-active,\n .fade-slide-top-leave-active {\n transition: all 0.3s ease;\n }\n\n .fade-slide-top-enter-from,\n .fade-slide-top-leave-to {\n opacity: 0;\n filter: blur(4px);\n transform: translateY(8px);\n }\n}"
|
|
96
88
|
}
|
|
97
89
|
}
|
|
98
90
|
}
|