@cl-light-ds/ui 0.1.0 → 0.3.0

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.
Files changed (148) hide show
  1. package/package.json +1 -1
  2. package/src/components/accordion/CHANGELOG.md +41 -41
  3. package/src/components/accordion/index.ts +4 -4
  4. package/src/components/alert/CHANGELOG.md +5 -5
  5. package/src/components/alert/index.ts +4 -4
  6. package/src/components/avatar/CHANGELOG.md +44 -44
  7. package/src/components/avatar/index.ts +6 -6
  8. package/src/components/badge/CHANGELOG.md +49 -49
  9. package/src/components/badge/index.ts +2 -2
  10. package/src/components/breadcrumb/CHANGELOG.md +24 -24
  11. package/src/components/breadcrumb/index.ts +5 -5
  12. package/src/components/button/CHANGELOG.md +41 -41
  13. package/src/components/button/index.ts +2 -2
  14. package/src/components/button-group/CHANGELOG.md +34 -34
  15. package/src/components/button-group/index.ts +3 -3
  16. package/src/components/card/CHANGELOG.md +162 -119
  17. package/src/components/card/Card.astro +23 -8
  18. package/src/components/card/CardContent.astro +1 -1
  19. package/src/components/card/CardDescription.astro +1 -1
  20. package/src/components/card/CardMedia.astro +1 -1
  21. package/src/components/card/CardMediaActions.astro +21 -0
  22. package/src/components/card/CardMediaSelect.astro +21 -0
  23. package/src/components/card/index.ts +12 -10
  24. package/src/components/carousel/CHANGELOG.md +5 -5
  25. package/src/components/carousel/index.ts +3 -3
  26. package/src/components/checkbox/CHANGELOG.md +58 -58
  27. package/src/components/checkbox/Checkbox.astro +2 -2
  28. package/src/components/checkbox/index.ts +1 -1
  29. package/src/components/collapsible/CHANGELOG.md +5 -5
  30. package/src/components/collapsible/index.ts +4 -4
  31. package/src/components/combobox/CHANGELOG.md +27 -27
  32. package/src/components/combobox/index.ts +11 -11
  33. package/src/components/date/CHANGELOG.md +18 -18
  34. package/src/components/date/index.ts +2 -2
  35. package/src/components/dialog/CHANGELOG.md +39 -39
  36. package/src/components/dialog/index.ts +9 -9
  37. package/src/components/dropdown-menu/CHANGELOG.md +194 -194
  38. package/src/components/dropdown-menu/DropdownMenuItemContent.astro +79 -79
  39. package/src/components/dropdown-menu/DropdownMenuPortal.astro +13 -13
  40. package/src/components/dropdown-menu/DropdownMenuRadioGroup.astro +13 -13
  41. package/src/components/dropdown-menu/dropdown-menu-item-variants.ts +24 -24
  42. package/src/components/dropdown-menu/index.ts +12 -12
  43. package/src/components/field/CHANGELOG.md +33 -33
  44. package/src/components/field/index.ts +10 -10
  45. package/src/components/hover-card/CHANGELOG.md +20 -20
  46. package/src/components/hover-card/index.ts +3 -3
  47. package/src/components/input/CHANGELOG.md +29 -29
  48. package/src/components/input/index.ts +2 -2
  49. package/src/components/input-group/CHANGELOG.md +49 -49
  50. package/src/components/input-group/controlClasses.ts +2 -2
  51. package/src/components/input-group/index.ts +6 -6
  52. package/src/components/item/CHANGELOG.md +27 -27
  53. package/src/components/item/index.ts +10 -10
  54. package/src/components/kbd/CHANGELOG.md +5 -5
  55. package/src/components/kbd/index.ts +2 -2
  56. package/src/components/label/CHANGELOG.md +28 -28
  57. package/src/components/label/index.ts +2 -2
  58. package/src/components/link-group/CHANGELOG.md +75 -75
  59. package/src/components/link-group/index.ts +5 -5
  60. package/src/components/link-group/link-group-list-variants.ts +15 -15
  61. package/src/components/marquee/CHANGELOG.md +5 -5
  62. package/src/components/marquee/index.ts +2 -2
  63. package/src/components/native-select/CHANGELOG.md +5 -5
  64. package/src/components/native-select/NativeSelectOption.astro +9 -9
  65. package/src/components/native-select/index.ts +3 -3
  66. package/src/components/navigation-menu/CHANGELOG.md +63 -63
  67. package/src/components/navigation-menu/index.ts +10 -10
  68. package/src/components/organisms/lightning-sidebar-nav/CHANGELOG.md +50 -0
  69. package/src/components/organisms/lightning-sidebar-nav/LightningSidebarNav.astro +176 -0
  70. package/src/components/organisms/lightning-sidebar-nav/SidebarNav.astro +50 -0
  71. package/src/components/organisms/lightning-sidebar-nav/SidebarNavGroup.astro +74 -0
  72. package/src/components/organisms/lightning-sidebar-nav/SidebarNavItem.astro +94 -0
  73. package/src/components/organisms/lightning-sidebar-nav/SidebarNavProBadge.astro +26 -0
  74. package/src/components/organisms/lightning-sidebar-nav/SidebarNavSection.astro +71 -0
  75. package/src/components/organisms/lightning-sidebar-nav/SidebarNavSkeleton.astro +67 -0
  76. package/src/components/organisms/lightning-sidebar-nav/SidebarNavSubItem.astro +69 -0
  77. package/src/components/organisms/lightning-sidebar-nav/SidebarNavUsage.astro +78 -0
  78. package/src/components/organisms/lightning-sidebar-nav/SidebarNavWorkspaceAvatar.astro +46 -0
  79. package/src/components/organisms/lightning-sidebar-nav/SidebarNavWorkspaceSwitcher.astro +130 -0
  80. package/src/components/organisms/lightning-sidebar-nav/icons.ts +46 -0
  81. package/src/components/organisms/lightning-sidebar-nav/index.ts +18 -0
  82. package/src/components/organisms/lightning-sidebar-nav/types.ts +77 -0
  83. package/src/components/popover/CHANGELOG.md +20 -5
  84. package/src/components/popover/Popover.astro +1 -0
  85. package/src/components/popover/PopoverContent.astro +6 -5
  86. package/src/components/popover/PopoverHeader.astro +1 -1
  87. package/src/components/popover/PopoverTrigger.astro +7 -1
  88. package/src/components/popover/index.ts +7 -7
  89. package/src/components/radio-group/CHANGELOG.md +31 -9
  90. package/src/components/radio-group/RadioGroup.astro +1 -1
  91. package/src/components/radio-group/RadioGroupItem.astro +12 -3
  92. package/src/components/radio-group/index.ts +3 -3
  93. package/src/components/select/CHANGELOG.md +39 -39
  94. package/src/components/select/index.ts +8 -8
  95. package/src/components/separator/CHANGELOG.md +5 -5
  96. package/src/components/separator/index.ts +2 -2
  97. package/src/components/skeleton/CHANGELOG.md +5 -5
  98. package/src/components/skeleton/index.ts +1 -1
  99. package/src/components/slider/CHANGELOG.md +5 -5
  100. package/src/components/slider/index.ts +1 -1
  101. package/src/components/spinner/CHANGELOG.md +18 -5
  102. package/src/components/spinner/Spinner.astro +3 -2
  103. package/src/components/spinner/index.ts +1 -1
  104. package/src/components/sticky-surface/CHANGELOG.md +5 -5
  105. package/src/components/sticky-surface/index.ts +2 -2
  106. package/src/components/switch/CHANGELOG.md +29 -9
  107. package/src/components/switch/Switch.astro +4 -4
  108. package/src/components/switch/index.ts +1 -1
  109. package/src/components/table/CHANGELOG.md +24 -5
  110. package/src/components/table/Table.astro +120 -12
  111. package/src/components/table/TableBody.astro +1 -2
  112. package/src/components/table/TableBulkToolbar.astro +37 -0
  113. package/src/components/table/TableCell.astro +25 -1
  114. package/src/components/table/TableCellText.astro +17 -0
  115. package/src/components/table/TableColumnMenu.astro +50 -0
  116. package/src/components/table/TableEditableCell.astro +287 -0
  117. package/src/components/table/TableEmpty.astro +17 -0
  118. package/src/components/table/TableFolderCell.astro +38 -0
  119. package/src/components/table/TableFooter.astro +1 -1
  120. package/src/components/table/TableHead.astro +71 -2
  121. package/src/components/table/TableHeader.astro +1 -1
  122. package/src/components/table/TablePagination.astro +57 -0
  123. package/src/components/table/TableRow.astro +32 -1
  124. package/src/components/table/TableSelectAllBanner.astro +34 -0
  125. package/src/components/table/TableSelectCell.astro +50 -0
  126. package/src/components/table/TableSkeletonRow.astro +21 -0
  127. package/src/components/table/index.ts +19 -9
  128. package/src/components/table/table-cell-variants.ts +29 -0
  129. package/src/components/tabs/CHANGELOG.md +5 -5
  130. package/src/components/tabs/index.ts +6 -6
  131. package/src/components/textarea/CHANGELOG.md +22 -5
  132. package/src/components/textarea/Textarea.astro +25 -3
  133. package/src/components/textarea/index.ts +2 -2
  134. package/src/components/toggle/CHANGELOG.md +23 -5
  135. package/src/components/toggle/Toggle.astro +13 -1
  136. package/src/components/toggle/index.ts +1 -1
  137. package/src/components/toggle-group/CHANGELOG.md +18 -5
  138. package/src/components/toggle-group/ToggleGroup.astro +14 -2
  139. package/src/components/toggle-group/index.ts +2 -2
  140. package/src/components/tooltip/CHANGELOG.md +22 -5
  141. package/src/components/tooltip/Tooltip.astro +26 -0
  142. package/src/components/tooltip/TooltipContent.astro +34 -9
  143. package/src/components/tooltip/index.ts +3 -3
  144. package/src/lib/table-controller.ts +1090 -0
  145. package/src/lib/toggle-group-controller.ts +113 -113
  146. package/src/lib/toggle-shared.ts +27 -26
  147. package/src/lib/utils.ts +6 -6
  148. package/src/styles/globals.css +197 -177
package/src/styles/globals.css CHANGED
@@ -1,177 +1,197 @@
1
- @import "tailwindcss";
2
- @import "tw-animate-css";
3
- @import "bejamas/tailwind.css";
4
-
5
- @source "../../../apps/**/*.{ts,tsx,astro}";
6
- @source "../../../components/**/*.{ts,tsx,astro}";
7
- @source "../**/*.{ts,tsx,astro}";
8
-
9
- @custom-variant dark (&:is(.dark *));
10
-
11
- @theme inline {
12
- --font-sans: var(--font-sans);
13
- --font-heading: var(--font-heading);
14
- --radius-xs: var(--radius-xs);
15
- --radius-sm: var(--radius-sm);
16
- --radius-md: var(--radius-md);
17
- --radius-lg: var(--radius-lg);
18
- --radius-xl: var(--radius-xl);
19
- --radius-card: var(--radius-card);
20
- --color-background: var(--background);
21
- --color-foreground: var(--foreground);
22
- --color-card: var(--card);
23
- --color-card-foreground: var(--card-foreground);
24
- --color-popover: var(--popover);
25
- --color-popover-foreground: var(--popover-foreground);
26
- --color-primary: var(--primary);
27
- --color-primary-foreground: var(--primary-foreground);
28
- --color-secondary: var(--secondary);
29
- --color-secondary-foreground: var(--secondary-foreground);
30
- --color-muted: var(--muted);
31
- --color-muted-foreground: var(--muted-foreground);
32
- --color-accent: var(--accent);
33
- --color-accent-foreground: var(--accent-foreground);
34
- --color-destructive: var(--destructive);
35
- --color-destructive-foreground: var(--destructive-foreground);
36
- --color-success: var(--success);
37
- --color-success-foreground: var(--success-foreground);
38
- --color-badge-success: var(--badge-success);
39
- --color-badge-success-foreground: var(--badge-success-foreground);
40
- --color-badge-warning: var(--badge-warning);
41
- --color-badge-warning-foreground: var(--badge-warning-foreground);
42
- --color-badge-accent: var(--badge-accent);
43
- --color-badge-accent-foreground: var(--badge-accent-foreground);
44
- --color-badge-accent-hover: var(--badge-accent-hover);
45
- --color-background-button-hover: var(--background-button-hover);
46
- --color-destructive-hover: var(--destructive-hover);
47
- --color-background-hover: var(--background-hover);
48
- --color-background-light: var(--background-light);
49
- --color-border: var(--border);
50
- --color-input: var(--input);
51
- --color-ring: var(--ring);
52
- --color-chart-1: var(--chart-1);
53
- --color-chart-2: var(--chart-2);
54
- --color-chart-3: var(--chart-3);
55
- --color-chart-4: var(--chart-4);
56
- --color-chart-5: var(--chart-5);
57
- --color-slider-background-disabled: var(--slider-background-disabled);
58
- --color-slider-dot-background-disabled: var(--slider-dot-background-disabled);
59
- }
60
-
61
- :root {
62
- --font-heading: var(--font-sans);
63
- --primary-50: #ebf3fc;
64
- --primary-100: #d7e7f9;
65
- --primary-200: #afcef3;
66
- --primary-300: #87b6ec;
67
- --primary-400: #5f9de6;
68
- --primary-500: #3785e0;
69
- --primary-600: #2873cc;
70
- --primary-700: #1f5faa;
71
- --primary-800: #0e417e;
72
- --primary-900: #103158;
73
- --primary-950: #112843;
74
- --background: var(--color-white);
75
- --foreground: var(--color-zinc-950);
76
- --card: var(--color-white);
77
- --card-foreground: var(--color-zinc-950);
78
- --popover: var(--color-white);
79
- --popover-foreground: var(--color-zinc-950);
80
- --primary: var(--primary-500);
81
- --primary-foreground: var(--color-white);
82
- --secondary: var(--color-zinc-100);
83
- --secondary-foreground: var(--color-zinc-900);
84
- --muted: var(--color-zinc-100);
85
- --muted-foreground: var(--color-zinc-500);
86
- --accent: oklch(0.97 0 0);
87
- --accent-foreground: oklch(0.205 0 0);
88
- --destructive: var(--color-red-600);
89
- --destructive-foreground: var(--color-white);
90
- --success: var(--color-green-600);
91
- --success-foreground: var(--color-white);
92
- --badge-success: var(--color-green-700);
93
- --badge-success-foreground: var(--color-white);
94
- --badge-warning: var(--color-yellow-500);
95
- --badge-warning-foreground: var(--color-white);
96
- --badge-accent: var(--primary-50);
97
- --badge-accent-foreground: var(--primary-950);
98
- --badge-accent-hover: var(--primary-100);
99
- --background-button-hover: var(--color-zinc-200);
100
- --destructive-hover: var(--color-red-500);
101
- --background-hover: var(--color-zinc-100);
102
- --background-light: var(--primary-100);
103
- --border: var(--color-zinc-200);
104
- --input: var(--color-zinc-200);
105
- --ring: var(--primary-400);
106
- --chart-1: var(--primary-200);
107
- --chart-2: var(--primary-400);
108
- --chart-3: var(--primary-500);
109
- --chart-4: var(--primary-700);
110
- --chart-5: var(--primary-900);
111
- --slider-background-disabled: color-mix(in oklab, var(--primary) 40%, transparent);
112
- --slider-dot-background-disabled: color-mix(in oklab, var(--background) 40%, transparent);
113
- --radius: 0.625rem;
114
- --radius-xs: 0.125rem;
115
- --radius-sm: 0.25rem;
116
- --radius-md: 0.375rem;
117
- --radius-lg: 0.5rem;
118
- --radius-xl: 0.875rem;
119
- --radius-card: 1.5rem;
120
- --sidebar: oklch(0.985 0 0);
121
- --sidebar-foreground: oklch(0.145 0 0);
122
- --sidebar-primary: oklch(0.4634 0.2647 264.76);
123
- --sidebar-primary-foreground: oklch(0.97 0.014 264.76);
124
- --sidebar-accent: oklch(0.97 0 0);
125
- --sidebar-accent-foreground: oklch(0.205 0 0);
126
- --sidebar-border: oklch(0.922 0 0);
127
- --sidebar-ring: oklch(0.708 0 0);
128
- }
129
-
130
- .dark {
131
- --background: oklch(0.145 0 0);
132
- --foreground: oklch(0.985 0 0);
133
- --card: oklch(0.205 0 0);
134
- --card-foreground: oklch(0.985 0 0);
135
- --popover: oklch(0.205 0 0);
136
- --popover-foreground: oklch(0.985 0 0);
137
- --primary: var(--primary);
138
- --primary-foreground: oklch(0.97 0.014 264.76);
139
- --secondary: oklch(0.274 0.006 286.033);
140
- --secondary-foreground: oklch(0.985 0 0);
141
- --muted: oklch(0.269 0 0);
142
- --muted-foreground: oklch(0.708 0 0);
143
- --accent: oklch(0.371 0 0);
144
- --accent-foreground: oklch(0.985 0 0);
145
- --destructive: oklch(0.704 0.191 22.216);
146
- --border: oklch(1 0 0 / 10%);
147
- --input: oklch(1 0 0 / 15%);
148
- --ring: oklch(0.556 0 0);
149
- --chart-1: oklch(0.729 0.132 267.96);
150
- --chart-2: oklch(0.579 0.237 266.56);
151
- --chart-3: oklch(0.493 0.277 263.66);
152
- --chart-4: oklch(0.463 0.265 264.76);
153
- --chart-5: oklch(0.373 0.213 261.56);
154
- --sidebar: oklch(0.205 0 0);
155
- --sidebar-foreground: oklch(0.985 0 0);
156
- --sidebar-primary: oklch(0.4634 0.2647 264.76);
157
- --sidebar-primary-foreground: oklch(0.97 0.014 264.76);
158
- --sidebar-accent: oklch(0.269 0 0);
159
- --sidebar-accent-foreground: oklch(0.985 0 0);
160
- --sidebar-border: oklch(1 0 0 / 10%);
161
- --sidebar-ring: oklch(0.556 0 0);
162
- }
163
-
164
- @layer base {
165
- * {
166
- @apply border-border outline-ring/50;
167
- }
168
- body {
169
- @apply bg-background text-foreground;
170
- }
171
- .cn-font-heading {
172
- @apply font-heading;
173
- }
174
- html {
175
- @apply font-sans;
176
- }
177
- }
1
+ @import "tailwindcss";
2
+ @import "tw-animate-css";
3
+ @import "bejamas/tailwind.css";
4
+
5
+ @source "../../../apps/**/*.{ts,tsx,astro}";
6
+ @source "../../../components/**/*.{ts,tsx,astro}";
7
+ @source "../**/*.{ts,tsx,astro}";
8
+
9
+ @custom-variant dark (&:is(.dark *));
10
+
11
+ @theme inline {
12
+ --font-sans: var(--font-sans);
13
+ --font-heading: var(--font-heading);
14
+ --radius-xs: var(--radius-xs);
15
+ --radius-sm: var(--radius-sm);
16
+ --radius-md: var(--radius-md);
17
+ --radius-lg: var(--radius-lg);
18
+ --radius-xl: var(--radius-xl);
19
+ --radius-card: var(--radius-card);
20
+ --color-background: var(--background);
21
+ --color-foreground: var(--foreground);
22
+ --color-card: var(--card);
23
+ --color-card-foreground: var(--card-foreground);
24
+ --color-card-hover: var(--card-hover);
25
+ --shadow-card-light: var(--shadow-card-light);
26
+ --color-popover: var(--popover);
27
+ --color-popover-foreground: var(--popover-foreground);
28
+ --color-primary: var(--primary);
29
+ --color-primary-foreground: var(--primary-foreground);
30
+ --color-secondary: var(--secondary);
31
+ --color-secondary-foreground: var(--secondary-foreground);
32
+ --color-muted: var(--muted);
33
+ --color-muted-foreground: var(--muted-foreground);
34
+ --color-accent: var(--accent);
35
+ --color-accent-foreground: var(--accent-foreground);
36
+ --color-destructive: var(--destructive);
37
+ --color-destructive-foreground: var(--destructive-foreground);
38
+ --color-success: var(--success);
39
+ --color-success-foreground: var(--success-foreground);
40
+ --color-badge-success: var(--badge-success);
41
+ --color-badge-success-foreground: var(--badge-success-foreground);
42
+ --color-badge-warning: var(--badge-warning);
43
+ --color-badge-warning-foreground: var(--badge-warning-foreground);
44
+ --color-badge-accent: var(--badge-accent);
45
+ --color-badge-accent-foreground: var(--badge-accent-foreground);
46
+ --color-badge-accent-hover: var(--badge-accent-hover);
47
+ --color-background-button-hover: var(--background-button-hover);
48
+ --color-destructive-hover: var(--destructive-hover);
49
+ --color-background-hover: var(--background-hover);
50
+ --color-background-light: var(--background-light);
51
+ --color-table-row-hover: var(--table-row-hover);
52
+ --color-table-row-selected: var(--table-row-selected);
53
+ --color-border: var(--border);
54
+ --color-input: var(--input);
55
+ --color-ring: var(--ring);
56
+ --color-chart-1: var(--chart-1);
57
+ --color-chart-2: var(--chart-2);
58
+ --color-chart-3: var(--chart-3);
59
+ --color-chart-4: var(--chart-4);
60
+ --color-chart-5: var(--chart-5);
61
+ --color-slider-background-disabled: var(--slider-background-disabled);
62
+ --color-slider-dot-background-disabled: var(--slider-dot-background-disabled);
63
+ --color-sidebar: var(--sidebar);
64
+ --color-sidebar-foreground: var(--sidebar-foreground);
65
+ --color-sidebar-primary: var(--sidebar-primary);
66
+ --color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
67
+ --color-sidebar-accent: var(--sidebar-accent);
68
+ --color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
69
+ --color-sidebar-border: var(--sidebar-border);
70
+ --color-sidebar-ring: var(--sidebar-ring);
71
+ --color-sidebar-rail: var(--sidebar-rail);
72
+ }
73
+
74
+ :root {
75
+ --font-heading: var(--font-sans);
76
+ --primary-50: #ebf3fc;
77
+ --primary-100: #d7e7f9;
78
+ --primary-200: #afcef3;
79
+ --primary-300: #87b6ec;
80
+ --primary-400: #5f9de6;
81
+ --primary-500: #3785e0;
82
+ --primary-600: #2873cc;
83
+ --primary-700: #1f5faa;
84
+ --primary-800: #0e417e;
85
+ --primary-900: #103158;
86
+ --primary-950: #112843;
87
+ --background: var(--color-white);
88
+ --foreground: var(--color-zinc-950);
89
+ --card: var(--color-white);
90
+ --card-foreground: var(--color-zinc-950);
91
+ --card-hover: color-mix(in oklab, var(--primary-950) 70%, transparent);
92
+ --shadow-card-light: 0 1px 1px 0 rgb(5 23 41 / 0.06);
93
+ --popover: var(--color-white);
94
+ --popover-foreground: var(--color-zinc-950);
95
+ --primary: var(--primary-500);
96
+ --primary-foreground: var(--color-white);
97
+ --secondary: var(--color-zinc-100);
98
+ --secondary-foreground: var(--color-zinc-900);
99
+ --muted: var(--color-zinc-100);
100
+ --muted-foreground: var(--color-zinc-500);
101
+ --accent: oklch(0.97 0 0);
102
+ --accent-foreground: oklch(0.205 0 0);
103
+ --destructive: var(--color-red-600);
104
+ --destructive-foreground: var(--color-white);
105
+ --success: var(--color-green-600);
106
+ --success-foreground: var(--color-white);
107
+ --badge-success: var(--color-green-700);
108
+ --badge-success-foreground: var(--color-white);
109
+ --badge-warning: var(--color-yellow-500);
110
+ --badge-warning-foreground: var(--color-white);
111
+ --badge-accent: var(--primary-50);
112
+ --badge-accent-foreground: var(--primary-950);
113
+ --badge-accent-hover: var(--primary-100);
114
+ --background-button-hover: var(--color-zinc-200);
115
+ --destructive-hover: var(--color-red-500);
116
+ --background-hover: var(--color-zinc-100);
117
+ --background-light: var(--primary-100);
118
+ --table-row-hover: var(--muted);
119
+ --table-row-selected: var(--primary-50);
120
+ --border: var(--color-zinc-200);
121
+ --input: var(--color-zinc-200);
122
+ --ring: var(--primary-400);
123
+ --chart-1: var(--primary-200);
124
+ --chart-2: var(--primary-400);
125
+ --chart-3: var(--primary-500);
126
+ --chart-4: var(--primary-700);
127
+ --chart-5: var(--primary-900);
128
+ --slider-background-disabled: color-mix(in oklab, var(--primary) 40%, transparent);
129
+ --slider-dot-background-disabled: color-mix(in oklab, var(--background) 40%, transparent);
130
+ --radius: 0.625rem;
131
+ --radius-xs: 0.125rem;
132
+ --radius-sm: 0.25rem;
133
+ --radius-md: 0.375rem;
134
+ --radius-lg: 0.5rem;
135
+ --radius-xl: 0.875rem;
136
+ --radius-card: 1.5rem;
137
+ --sidebar: var(--color-zinc-50);
138
+ --sidebar-foreground: var(--foreground);
139
+ --sidebar-primary: var(--primary);
140
+ --sidebar-primary-foreground: var(--primary-foreground);
141
+ --sidebar-accent: var(--primary-50);
142
+ --sidebar-accent-foreground: var(--primary-950);
143
+ --sidebar-border: var(--border);
144
+ --sidebar-ring: var(--ring);
145
+ --sidebar-rail: var(--color-zinc-300);
146
+ }
147
+
148
+ .dark {
149
+ --background: oklch(0.145 0 0);
150
+ --foreground: oklch(0.985 0 0);
151
+ --card: oklch(0.205 0 0);
152
+ --card-foreground: oklch(0.985 0 0);
153
+ --popover: oklch(0.205 0 0);
154
+ --popover-foreground: oklch(0.985 0 0);
155
+ --primary: var(--primary);
156
+ --primary-foreground: oklch(0.97 0.014 264.76);
157
+ --secondary: oklch(0.274 0.006 286.033);
158
+ --secondary-foreground: oklch(0.985 0 0);
159
+ --muted: oklch(0.269 0 0);
160
+ --muted-foreground: oklch(0.708 0 0);
161
+ --accent: oklch(0.371 0 0);
162
+ --accent-foreground: oklch(0.985 0 0);
163
+ --destructive: oklch(0.704 0.191 22.216);
164
+ --border: oklch(1 0 0 / 10%);
165
+ --input: oklch(1 0 0 / 15%);
166
+ --ring: oklch(0.556 0 0);
167
+ --chart-1: oklch(0.729 0.132 267.96);
168
+ --chart-2: oklch(0.579 0.237 266.56);
169
+ --chart-3: oklch(0.493 0.277 263.66);
170
+ --chart-4: oklch(0.463 0.265 264.76);
171
+ --chart-5: oklch(0.373 0.213 261.56);
172
+ --sidebar: oklch(0.205 0 0);
173
+ --sidebar-foreground: oklch(0.985 0 0);
174
+ --sidebar-primary: var(--primary-500);
175
+ --sidebar-primary-foreground: var(--color-white);
176
+ --sidebar-accent: color-mix(in oklab, var(--primary-500) 20%, transparent);
177
+ --sidebar-accent-foreground: var(--primary-100);
178
+ --sidebar-border: oklch(1 0 0 / 10%);
179
+ --sidebar-ring: var(--primary-400);
180
+ --sidebar-rail: oklch(1 0 0 / 15%);
181
+ --table-row-selected: color-mix(in oklab, var(--primary-500) 20%, var(--background));
182
+ }
183
+
184
+ @layer base {
185
+ * {
186
+ @apply border-border outline-ring/50;
187
+ }
188
+ body {
189
+ @apply bg-background text-foreground;
190
+ }
191
+ .cn-font-heading {
192
+ @apply font-heading;
193
+ }
194
+ html {
195
+ @apply font-sans;
196
+ }
197
+ }