@srcroot/ui 0.0.43 → 0.0.45

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/dist/index.js CHANGED
@@ -425,7 +425,8 @@ var REGISTRY = {
425
425
  file: "ui/input.tsx",
426
426
  description: "Text input field",
427
427
  category: "Forms",
428
- dependencies: []
428
+ dependencies: [],
429
+ registryDependencies: ["react-icons"]
429
430
  },
430
431
  textarea: {
431
432
  file: "ui/textarea.tsx",
@@ -643,6 +644,18 @@ var REGISTRY = {
643
644
  category: "Forms",
644
645
  dependencies: ["popover", "command", "button", "badge"]
645
646
  },
647
+ "form-field": {
648
+ file: "ui/form-field.tsx",
649
+ description: "Wrapper for form inputs with label and error",
650
+ category: "Forms",
651
+ dependencies: ["label"]
652
+ },
653
+ "input-group": {
654
+ file: "ui/input-group.tsx",
655
+ description: "Input with add-ons",
656
+ category: "Forms",
657
+ dependencies: ["input"]
658
+ },
646
659
  command: {
647
660
  file: "ui/command.tsx",
648
661
  description: "Command palette / search menu",
@@ -913,7 +926,7 @@ Please manually install: ${packages.join(" ")}`);
913
926
  }
914
927
  spinner.start("Adding components...");
915
928
  }
916
- const registryPath = path4.resolve(__dirname4, "..", "..", "registry", comp.file);
929
+ const registryPath = path4.resolve(__dirname4, "..", "src", "registry", comp.file);
917
930
  if (!fs4.existsSync(registryPath)) {
918
931
  spinner.warn(`Registry file not found for ${name}: ${registryPath}`);
919
932
  continue;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@srcroot/ui",
3
- "version": "0.0.43",
3
+ "version": "0.0.45",
4
4
  "description": "A UI library with polymorphic, accessible React components",
5
5
  "type": "module",
6
6
  "bin": {
@@ -63,4 +63,4 @@
63
63
  "optional": true
64
64
  }
65
65
  }
66
- }
66
+ }
@@ -48,7 +48,7 @@ const GoogleTagManager: FC<GoogleTagManagerProps> = ({ containers }) => {
48
48
  {containers.map(({ gtmId, tagServerUrl = defaultServer }) => (
49
49
  <iframe
50
50
  key={gtmId}
51
- src={`${tagServer}/ns.html?id=${gtmId}`}
51
+ src={`${tagServerUrl}/ns.html?id=${gtmId}`}
52
52
  height="0"
53
53
  width="0"
54
54
  style={{ display: 'none', visibility: 'hidden' }}
@@ -126,54 +126,52 @@
126
126
  }
127
127
  }
128
128
 
129
- @media (prefers-color-scheme: dark) {
130
- :root {
131
- --background: hsl(221.2 40% 6%);
132
- --foreground: hsl(210 40% 98%);
129
+ .dark {
130
+ --background: hsl(221.2 40% 6%);
131
+ --foreground: hsl(210 40% 98%);
133
132
 
134
- --card: hsl(221.2 40% 8%);
135
- --card-foreground: hsl(210 40% 98%);
133
+ --card: hsl(221.2 40% 8%);
134
+ --card-foreground: hsl(210 40% 98%);
136
135
 
137
- --popover: hsl(221.2 40% 8%);
138
- --popover-foreground: hsl(210 40% 98%);
136
+ --popover: hsl(221.2 40% 8%);
137
+ --popover-foreground: hsl(210 40% 98%);
139
138
 
140
- --primary: hsl(221.2 83.2% 53.3%);
141
- --primary-foreground: hsl(210 40% 98%);
139
+ --primary: hsl(221.2 83.2% 53.3%);
140
+ --primary-foreground: hsl(210 40% 98%);
142
141
 
143
- --secondary: hsl(221.2 30% 15%);
144
- --secondary-foreground: hsl(210 40% 98%);
142
+ --secondary: hsl(221.2 30% 15%);
143
+ --secondary-foreground: hsl(210 40% 98%);
145
144
 
146
- --muted: hsl(221.2 30% 15%);
147
- --muted-foreground: hsl(221.2 20% 65%);
145
+ --muted: hsl(221.2 30% 15%);
146
+ --muted-foreground: hsl(221.2 20% 65%);
148
147
 
149
- --accent: hsl(221.2 30% 15%);
150
- --accent-foreground: hsl(210 40% 98%);
148
+ --accent: hsl(221.2 30% 15%);
149
+ --accent-foreground: hsl(210 40% 98%);
151
150
 
152
- --destructive: hsl(0 62.8% 30.6%);
153
- --destructive-foreground: hsl(0 0% 100%);
151
+ --destructive: hsl(0 62.8% 30.6%);
152
+ --destructive-foreground: hsl(0 0% 100%);
154
153
 
155
- --success: hsl(142.1 70.6% 45.3%);
156
- --success-foreground: hsl(221.2 83.2% 53.3%);
154
+ --success: hsl(142.1 70.6% 45.3%);
155
+ --success-foreground: hsl(221.2 83.2% 53.3%);
157
156
 
158
- --warning: hsl(48 96.5% 53.1%);
159
- --warning-foreground: hsl(221.2 83.2% 53.3%);
157
+ --warning: hsl(48 96.5% 53.1%);
158
+ --warning-foreground: hsl(221.2 83.2% 53.3%);
160
159
 
161
- --info: hsl(199.4 95.5% 53.8%);
162
- --info-foreground: hsl(221.2 83.2% 53.3%);
160
+ --info: hsl(199.4 95.5% 53.8%);
161
+ --info-foreground: hsl(221.2 83.2% 53.3%);
163
162
 
164
- --border: hsl(221.2 30% 18%);
165
- --input: hsl(221.2 30% 18%);
166
- --ring: hsl(221.2 83.2% 53.3%);
163
+ --border: hsl(221.2 30% 18%);
164
+ --input: hsl(221.2 30% 18%);
165
+ --ring: hsl(221.2 83.2% 53.3%);
167
166
 
168
- --sidebar-background: hsl(221.2 40% 10%);
169
- --sidebar-foreground: hsl(210 40% 98%);
170
- --sidebar-primary: hsl(221.2 83.2% 53.3%);
171
- --sidebar-primary-foreground: hsl(210 40% 98%);
172
- --sidebar-accent: hsl(221.2 30% 15%);
173
- --sidebar-accent-foreground: hsl(210 40% 98%);
174
- --sidebar-border: hsl(221.2 30% 18%);
175
- --sidebar-ring: hsl(221.2 83.2% 53.3%);
176
- }
167
+ --sidebar-background: hsl(221.2 40% 10%);
168
+ --sidebar-foreground: hsl(210 40% 98%);
169
+ --sidebar-primary: hsl(221.2 83.2% 53.3%);
170
+ --sidebar-primary-foreground: hsl(210 40% 98%);
171
+ --sidebar-accent: hsl(221.2 30% 15%);
172
+ --sidebar-accent-foreground: hsl(210 40% 98%);
173
+ --sidebar-border: hsl(221.2 30% 18%);
174
+ --sidebar-ring: hsl(221.2 83.2% 53.3%);
177
175
  }
178
176
 
179
177
  body {
@@ -126,54 +126,52 @@
126
126
  }
127
127
  }
128
128
 
129
- @media (prefers-color-scheme: dark) {
130
- :root {
131
- --background: hsl(224 71.4% 4.1%);
132
- --foreground: hsl(210 20% 98%);
129
+ .dark {
130
+ --background: hsl(224 71.4% 4.1%);
131
+ --foreground: hsl(210 20% 98%);
133
132
 
134
- --card: hsl(224 71.4% 4.1%);
135
- --card-foreground: hsl(210 20% 98%);
133
+ --card: hsl(224 71.4% 4.1%);
134
+ --card-foreground: hsl(210 20% 98%);
136
135
 
137
- --popover: hsl(224 71.4% 4.1%);
138
- --popover-foreground: hsl(210 20% 98%);
136
+ --popover: hsl(224 71.4% 4.1%);
137
+ --popover-foreground: hsl(210 20% 98%);
139
138
 
140
- --primary: hsl(210 20% 98%);
141
- --primary-foreground: hsl(220.9 39.3% 11%);
139
+ --primary: hsl(210 20% 98%);
140
+ --primary-foreground: hsl(220.9 39.3% 11%);
142
141
 
143
- --secondary: hsl(215 27.9% 16.9%);
144
- --secondary-foreground: hsl(210 20% 98%);
142
+ --secondary: hsl(215 27.9% 16.9%);
143
+ --secondary-foreground: hsl(210 20% 98%);
145
144
 
146
- --muted: hsl(215 27.9% 16.9%);
147
- --muted-foreground: hsl(217.9 10.6% 64.9%);
145
+ --muted: hsl(215 27.9% 16.9%);
146
+ --muted-foreground: hsl(217.9 10.6% 64.9%);
148
147
 
149
- --accent: hsl(215 27.9% 16.9%);
150
- --accent-foreground: hsl(210 20% 98%);
148
+ --accent: hsl(215 27.9% 16.9%);
149
+ --accent-foreground: hsl(210 20% 98%);
151
150
 
152
- --destructive: hsl(0 62.8% 30.6%);
153
- --destructive-foreground: hsl(210 20% 98%);
154
-
155
- --success: hsl(142.1 70.6% 45.3%);
156
- --success-foreground: hsl(220.9 39.3% 11%);
157
-
158
- --warning: hsl(48 96.5% 53.1%);
159
- --warning-foreground: hsl(220.9 39.3% 11%);
151
+ --destructive: hsl(0 62.8% 30.6%);
152
+ --destructive-foreground: hsl(210 20% 98%);
160
153
 
161
- --info: hsl(199.4 95.5% 53.8%);
162
- --info-foreground: hsl(220.9 39.3% 11%);
154
+ --success: hsl(142.1 70.6% 45.3%);
155
+ --success-foreground: hsl(220.9 39.3% 11%);
163
156
 
164
- --border: hsl(215 27.9% 16.9%);
165
- --input: hsl(215 27.9% 16.9%);
166
- --ring: hsl(216 12.2% 83.9%);
157
+ --warning: hsl(48 96.5% 53.1%);
158
+ --warning-foreground: hsl(220.9 39.3% 11%);
167
159
 
168
- --sidebar-background: hsl(224 71.4% 10%);
169
- --sidebar-foreground: hsl(210 20% 98%);
170
- --sidebar-primary: hsl(210 20% 98%);
171
- --sidebar-primary-foreground: hsl(220.9 39.3% 11%);
172
- --sidebar-accent: hsl(215 27.9% 16.9%);
173
- --sidebar-accent-foreground: hsl(210 20% 98%);
174
- --sidebar-border: hsl(215 27.9% 16.9%);
175
- --sidebar-ring: hsl(216 12.2% 83.9%);
176
- }
160
+ --info: hsl(199.4 95.5% 53.8%);
161
+ --info-foreground: hsl(220.9 39.3% 11%);
162
+
163
+ --border: hsl(215 27.9% 16.9%);
164
+ --input: hsl(215 27.9% 16.9%);
165
+ --ring: hsl(216 12.2% 83.9%);
166
+
167
+ --sidebar-background: hsl(224 71.4% 10%);
168
+ --sidebar-foreground: hsl(210 20% 98%);
169
+ --sidebar-primary: hsl(210 20% 98%);
170
+ --sidebar-primary-foreground: hsl(220.9 39.3% 11%);
171
+ --sidebar-accent: hsl(215 27.9% 16.9%);
172
+ --sidebar-accent-foreground: hsl(210 20% 98%);
173
+ --sidebar-border: hsl(215 27.9% 16.9%);
174
+ --sidebar-ring: hsl(216 12.2% 83.9%);
177
175
  }
178
176
 
179
177
  body {
@@ -126,54 +126,52 @@
126
126
  }
127
127
  }
128
128
 
129
- @media (prefers-color-scheme: dark) {
130
- :root {
131
- --background: hsl(142.1 40% 6%);
132
- --foreground: hsl(355.7 100% 97.3%);
129
+ .dark {
130
+ --background: hsl(142.1 40% 6%);
131
+ --foreground: hsl(355.7 100% 97.3%);
133
132
 
134
- --card: hsl(142.1 40% 8%);
135
- --card-foreground: hsl(355.7 100% 97.3%);
133
+ --card: hsl(142.1 40% 8%);
134
+ --card-foreground: hsl(355.7 100% 97.3%);
136
135
 
137
- --popover: hsl(142.1 40% 8%);
138
- --popover-foreground: hsl(355.7 100% 97.3%);
136
+ --popover: hsl(142.1 40% 8%);
137
+ --popover-foreground: hsl(355.7 100% 97.3%);
139
138
 
140
- --primary: hsl(142.1 76.2% 36.3%);
141
- --primary-foreground: hsl(355.7 100% 97.3%);
139
+ --primary: hsl(142.1 76.2% 36.3%);
140
+ --primary-foreground: hsl(355.7 100% 97.3%);
142
141
 
143
- --secondary: hsl(142.1 30% 15%);
144
- --secondary-foreground: hsl(355.7 100% 97.3%);
142
+ --secondary: hsl(142.1 30% 15%);
143
+ --secondary-foreground: hsl(355.7 100% 97.3%);
145
144
 
146
- --muted: hsl(142.1 30% 15%);
147
- --muted-foreground: hsl(142.1 20% 65%);
145
+ --muted: hsl(142.1 30% 15%);
146
+ --muted-foreground: hsl(142.1 20% 65%);
148
147
 
149
- --accent: hsl(142.1 30% 15%);
150
- --accent-foreground: hsl(355.7 100% 97.3%);
148
+ --accent: hsl(142.1 30% 15%);
149
+ --accent-foreground: hsl(355.7 100% 97.3%);
151
150
 
152
- --destructive: hsl(0 62.8% 30.6%);
153
- --destructive-foreground: hsl(0 0% 100%);
151
+ --destructive: hsl(0 62.8% 30.6%);
152
+ --destructive-foreground: hsl(0 0% 100%);
154
153
 
155
- --success: hsl(142.1 70.6% 45.3%);
156
- --success-foreground: hsl(142.1 76.2% 36.3%);
154
+ --success: hsl(142.1 70.6% 45.3%);
155
+ --success-foreground: hsl(142.1 76.2% 36.3%);
157
156
 
158
- --warning: hsl(48 96.5% 53.1%);
159
- --warning-foreground: hsl(142.1 76.2% 36.3%);
157
+ --warning: hsl(48 96.5% 53.1%);
158
+ --warning-foreground: hsl(142.1 76.2% 36.3%);
160
159
 
161
- --info: hsl(199.4 95.5% 53.8%);
162
- --info-foreground: hsl(142.1 76.2% 36.3%);
160
+ --info: hsl(199.4 95.5% 53.8%);
161
+ --info-foreground: hsl(142.1 76.2% 36.3%);
163
162
 
164
- --border: hsl(142.1 30% 18%);
165
- --input: hsl(142.1 30% 18%);
166
- --ring: hsl(142.1 76.2% 36.3%);
163
+ --border: hsl(142.1 30% 18%);
164
+ --input: hsl(142.1 30% 18%);
165
+ --ring: hsl(142.1 76.2% 36.3%);
167
166
 
168
- --sidebar-background: hsl(142.1 40% 10%);
169
- --sidebar-foreground: hsl(355.7 100% 97.3%);
170
- --sidebar-primary: hsl(142.1 76.2% 36.3%);
171
- --sidebar-primary-foreground: hsl(355.7 100% 97.3%);
172
- --sidebar-accent: hsl(142.1 30% 15%);
173
- --sidebar-accent-foreground: hsl(355.7 100% 97.3%);
174
- --sidebar-border: hsl(142.1 30% 18%);
175
- --sidebar-ring: hsl(142.1 76.2% 36.3%);
176
- }
167
+ --sidebar-background: hsl(142.1 40% 10%);
168
+ --sidebar-foreground: hsl(355.7 100% 97.3%);
169
+ --sidebar-primary: hsl(142.1 76.2% 36.3%);
170
+ --sidebar-primary-foreground: hsl(355.7 100% 97.3%);
171
+ --sidebar-accent: hsl(142.1 30% 15%);
172
+ --sidebar-accent-foreground: hsl(355.7 100% 97.3%);
173
+ --sidebar-border: hsl(142.1 30% 18%);
174
+ --sidebar-ring: hsl(142.1 76.2% 36.3%);
177
175
  }
178
176
 
179
177
  body {
@@ -126,54 +126,52 @@
126
126
  }
127
127
  }
128
128
 
129
- @media (prefers-color-scheme: dark) {
130
- :root {
131
- --background: hsl(0 0% 3.9%);
132
- --foreground: hsl(0 0% 98%);
129
+ .dark {
130
+ --background: hsl(0 0% 3.9%);
131
+ --foreground: hsl(0 0% 98%);
133
132
 
134
- --card: hsl(0 0% 3.9%);
135
- --card-foreground: hsl(0 0% 98%);
133
+ --card: hsl(0 0% 3.9%);
134
+ --card-foreground: hsl(0 0% 98%);
136
135
 
137
- --popover: hsl(0 0% 3.9%);
138
- --popover-foreground: hsl(0 0% 98%);
136
+ --popover: hsl(0 0% 3.9%);
137
+ --popover-foreground: hsl(0 0% 98%);
139
138
 
140
- --primary: hsl(0 0% 98%);
141
- --primary-foreground: hsl(0 0% 9%);
139
+ --primary: hsl(0 0% 98%);
140
+ --primary-foreground: hsl(0 0% 9%);
142
141
 
143
- --secondary: hsl(0 0% 14.9%);
144
- --secondary-foreground: hsl(0 0% 98%);
142
+ --secondary: hsl(0 0% 14.9%);
143
+ --secondary-foreground: hsl(0 0% 98%);
145
144
 
146
- --muted: hsl(0 0% 14.9%);
147
- --muted-foreground: hsl(0 0% 63.9%);
145
+ --muted: hsl(0 0% 14.9%);
146
+ --muted-foreground: hsl(0 0% 63.9%);
148
147
 
149
- --accent: hsl(0 0% 14.9%);
150
- --accent-foreground: hsl(0 0% 98%);
148
+ --accent: hsl(0 0% 14.9%);
149
+ --accent-foreground: hsl(0 0% 98%);
151
150
 
152
- --destructive: hsl(0 62.8% 30.6%);
153
- --destructive-foreground: hsl(0 0% 98%);
154
-
155
- --success: hsl(142.1 70.6% 45.3%);
156
- --success-foreground: hsl(0 0% 9%);
157
-
158
- --warning: hsl(48 96.5% 53.1%);
159
- --warning-foreground: hsl(0 0% 9%);
151
+ --destructive: hsl(0 62.8% 30.6%);
152
+ --destructive-foreground: hsl(0 0% 98%);
160
153
 
161
- --info: hsl(199.4 95.5% 53.8%);
162
- --info-foreground: hsl(0 0% 9%);
154
+ --success: hsl(142.1 70.6% 45.3%);
155
+ --success-foreground: hsl(0 0% 9%);
163
156
 
164
- --border: hsl(0 0% 14.9%);
165
- --input: hsl(0 0% 14.9%);
166
- --ring: hsl(0 0% 83.1%);
157
+ --warning: hsl(48 96.5% 53.1%);
158
+ --warning-foreground: hsl(0 0% 9%);
167
159
 
168
- --sidebar-background: hsl(0 0% 10%);
169
- --sidebar-foreground: hsl(0 0% 98%);
170
- --sidebar-primary: hsl(0 0% 98%);
171
- --sidebar-primary-foreground: hsl(0 0% 9%);
172
- --sidebar-accent: hsl(0 0% 14.9%);
173
- --sidebar-accent-foreground: hsl(0 0% 98%);
174
- --sidebar-border: hsl(0 0% 14.9%);
175
- --sidebar-ring: hsl(0 0% 83.1%);
176
- }
160
+ --info: hsl(199.4 95.5% 53.8%);
161
+ --info-foreground: hsl(0 0% 9%);
162
+
163
+ --border: hsl(0 0% 14.9%);
164
+ --input: hsl(0 0% 14.9%);
165
+ --ring: hsl(0 0% 83.1%);
166
+
167
+ --sidebar-background: hsl(0 0% 10%);
168
+ --sidebar-foreground: hsl(0 0% 98%);
169
+ --sidebar-primary: hsl(0 0% 98%);
170
+ --sidebar-primary-foreground: hsl(0 0% 9%);
171
+ --sidebar-accent: hsl(0 0% 14.9%);
172
+ --sidebar-accent-foreground: hsl(0 0% 98%);
173
+ --sidebar-border: hsl(0 0% 14.9%);
174
+ --sidebar-ring: hsl(0 0% 83.1%);
177
175
  }
178
176
 
179
177
  body {
@@ -126,54 +126,52 @@
126
126
  }
127
127
  }
128
128
 
129
- @media (prefers-color-scheme: dark) {
130
- :root {
131
- --background: hsl(24.6 40% 6%);
132
- --foreground: hsl(355.7 100% 97.3%);
129
+ .dark {
130
+ --background: hsl(24.6 40% 6%);
131
+ --foreground: hsl(355.7 100% 97.3%);
133
132
 
134
- --card: hsl(24.6 40% 8%);
135
- --card-foreground: hsl(355.7 100% 97.3%);
133
+ --card: hsl(24.6 40% 8%);
134
+ --card-foreground: hsl(355.7 100% 97.3%);
136
135
 
137
- --popover: hsl(24.6 40% 8%);
138
- --popover-foreground: hsl(355.7 100% 97.3%);
136
+ --popover: hsl(24.6 40% 8%);
137
+ --popover-foreground: hsl(355.7 100% 97.3%);
139
138
 
140
- --primary: hsl(24.6 95% 53.1%);
141
- --primary-foreground: hsl(355.7 100% 97.3%);
139
+ --primary: hsl(24.6 95% 53.1%);
140
+ --primary-foreground: hsl(355.7 100% 97.3%);
142
141
 
143
- --secondary: hsl(24.6 30% 15%);
144
- --secondary-foreground: hsl(355.7 100% 97.3%);
142
+ --secondary: hsl(24.6 30% 15%);
143
+ --secondary-foreground: hsl(355.7 100% 97.3%);
145
144
 
146
- --muted: hsl(24.6 30% 15%);
147
- --muted-foreground: hsl(24.6 20% 65%);
145
+ --muted: hsl(24.6 30% 15%);
146
+ --muted-foreground: hsl(24.6 20% 65%);
148
147
 
149
- --accent: hsl(24.6 30% 15%);
150
- --accent-foreground: hsl(355.7 100% 97.3%);
148
+ --accent: hsl(24.6 30% 15%);
149
+ --accent-foreground: hsl(355.7 100% 97.3%);
151
150
 
152
- --destructive: hsl(0 62.8% 30.6%);
153
- --destructive-foreground: hsl(0 0% 100%);
151
+ --destructive: hsl(0 62.8% 30.6%);
152
+ --destructive-foreground: hsl(0 0% 100%);
154
153
 
155
- --success: hsl(142.1 70.6% 45.3%);
156
- --success-foreground: hsl(24.6 95% 53.1%);
154
+ --success: hsl(142.1 70.6% 45.3%);
155
+ --success-foreground: hsl(24.6 95% 53.1%);
157
156
 
158
- --warning: hsl(48 96.5% 53.1%);
159
- --warning-foreground: hsl(24.6 95% 53.1%);
157
+ --warning: hsl(48 96.5% 53.1%);
158
+ --warning-foreground: hsl(24.6 95% 53.1%);
160
159
 
161
- --info: hsl(199.4 95.5% 53.8%);
162
- --info-foreground: hsl(24.6 95% 53.1%);
160
+ --info: hsl(199.4 95.5% 53.8%);
161
+ --info-foreground: hsl(24.6 95% 53.1%);
163
162
 
164
- --border: hsl(24.6 30% 18%);
165
- --input: hsl(24.6 30% 18%);
166
- --ring: hsl(24.6 95% 53.1%);
163
+ --border: hsl(24.6 30% 18%);
164
+ --input: hsl(24.6 30% 18%);
165
+ --ring: hsl(24.6 95% 53.1%);
167
166
 
168
- --sidebar-background: hsl(24.6 40% 10%);
169
- --sidebar-foreground: hsl(355.7 100% 97.3%);
170
- --sidebar-primary: hsl(24.6 95% 53.1%);
171
- --sidebar-primary-foreground: hsl(355.7 100% 97.3%);
172
- --sidebar-accent: hsl(24.6 30% 15%);
173
- --sidebar-accent-foreground: hsl(355.7 100% 97.3%);
174
- --sidebar-border: hsl(24.6 30% 18%);
175
- --sidebar-ring: hsl(24.6 95% 53.1%);
176
- }
167
+ --sidebar-background: hsl(24.6 40% 10%);
168
+ --sidebar-foreground: hsl(355.7 100% 97.3%);
169
+ --sidebar-primary: hsl(24.6 95% 53.1%);
170
+ --sidebar-primary-foreground: hsl(355.7 100% 97.3%);
171
+ --sidebar-accent: hsl(24.6 30% 15%);
172
+ --sidebar-accent-foreground: hsl(355.7 100% 97.3%);
173
+ --sidebar-border: hsl(24.6 30% 18%);
174
+ --sidebar-ring: hsl(24.6 95% 53.1%);
177
175
  }
178
176
 
179
177
  body {
@@ -126,54 +126,52 @@
126
126
  }
127
127
  }
128
128
 
129
- @media (prefers-color-scheme: dark) {
130
- :root {
131
- --background: hsl(346.8 40% 6%);
132
- --foreground: hsl(355.7 100% 97.3%);
129
+ .dark {
130
+ --background: hsl(346.8 40% 6%);
131
+ --foreground: hsl(355.7 100% 97.3%);
133
132
 
134
- --card: hsl(346.8 40% 8%);
135
- --card-foreground: hsl(355.7 100% 97.3%);
133
+ --card: hsl(346.8 40% 8%);
134
+ --card-foreground: hsl(355.7 100% 97.3%);
136
135
 
137
- --popover: hsl(346.8 40% 8%);
138
- --popover-foreground: hsl(355.7 100% 97.3%);
136
+ --popover: hsl(346.8 40% 8%);
137
+ --popover-foreground: hsl(355.7 100% 97.3%);
139
138
 
140
- --primary: hsl(346.8 77.2% 49.8%);
141
- --primary-foreground: hsl(355.7 100% 97.3%);
139
+ --primary: hsl(346.8 77.2% 49.8%);
140
+ --primary-foreground: hsl(355.7 100% 97.3%);
142
141
 
143
- --secondary: hsl(346.8 30% 15%);
144
- --secondary-foreground: hsl(355.7 100% 97.3%);
142
+ --secondary: hsl(346.8 30% 15%);
143
+ --secondary-foreground: hsl(355.7 100% 97.3%);
145
144
 
146
- --muted: hsl(346.8 30% 15%);
147
- --muted-foreground: hsl(346.8 20% 65%);
145
+ --muted: hsl(346.8 30% 15%);
146
+ --muted-foreground: hsl(346.8 20% 65%);
148
147
 
149
- --accent: hsl(346.8 30% 15%);
150
- --accent-foreground: hsl(355.7 100% 97.3%);
148
+ --accent: hsl(346.8 30% 15%);
149
+ --accent-foreground: hsl(355.7 100% 97.3%);
151
150
 
152
- --destructive: hsl(0 62.8% 30.6%);
153
- --destructive-foreground: hsl(0 0% 100%);
151
+ --destructive: hsl(0 62.8% 30.6%);
152
+ --destructive-foreground: hsl(0 0% 100%);
154
153
 
155
- --success: hsl(142.1 70.6% 45.3%);
156
- --success-foreground: hsl(346.8 77.2% 49.8%);
154
+ --success: hsl(142.1 70.6% 45.3%);
155
+ --success-foreground: hsl(346.8 77.2% 49.8%);
157
156
 
158
- --warning: hsl(48 96.5% 53.1%);
159
- --warning-foreground: hsl(346.8 77.2% 49.8%);
157
+ --warning: hsl(48 96.5% 53.1%);
158
+ --warning-foreground: hsl(346.8 77.2% 49.8%);
160
159
 
161
- --info: hsl(199.4 95.5% 53.8%);
162
- --info-foreground: hsl(346.8 77.2% 49.8%);
160
+ --info: hsl(199.4 95.5% 53.8%);
161
+ --info-foreground: hsl(346.8 77.2% 49.8%);
163
162
 
164
- --border: hsl(346.8 30% 18%);
165
- --input: hsl(346.8 30% 18%);
166
- --ring: hsl(346.8 77.2% 49.8%);
163
+ --border: hsl(346.8 30% 18%);
164
+ --input: hsl(346.8 30% 18%);
165
+ --ring: hsl(346.8 77.2% 49.8%);
167
166
 
168
- --sidebar-background: hsl(346.8 40% 10%);
169
- --sidebar-foreground: hsl(355.7 100% 97.3%);
170
- --sidebar-primary: hsl(346.8 77.2% 49.8%);
171
- --sidebar-primary-foreground: hsl(355.7 100% 97.3%);
172
- --sidebar-accent: hsl(346.8 30% 15%);
173
- --sidebar-accent-foreground: hsl(355.7 100% 97.3%);
174
- --sidebar-border: hsl(346.8 30% 18%);
175
- --sidebar-ring: hsl(346.8 77.2% 49.8%);
176
- }
167
+ --sidebar-background: hsl(346.8 40% 10%);
168
+ --sidebar-foreground: hsl(355.7 100% 97.3%);
169
+ --sidebar-primary: hsl(346.8 77.2% 49.8%);
170
+ --sidebar-primary-foreground: hsl(355.7 100% 97.3%);
171
+ --sidebar-accent: hsl(346.8 30% 15%);
172
+ --sidebar-accent-foreground: hsl(355.7 100% 97.3%);
173
+ --sidebar-border: hsl(346.8 30% 18%);
174
+ --sidebar-ring: hsl(346.8 77.2% 49.8%);
177
175
  }
178
176
 
179
177
  body {