update: fix some stuffs

components.json

@@ -5,7 +5,7 @@
 	"tsx": true,
 	"tailwind": {
 		"config": "tailwind.config.ts",
-		"css": "app/global.css",
+		"css": "src/app/globals.css",
 		"baseColor": "zinc",
 		"cssVariables": true,
 		"prefix": ""

package.json

@@ -15,8 +15,7 @@
 		"update-deps": "ncu --filter !@types/node"
 	},
 	"dependencies": {
-		"@radix-ui/react-slot": "^1.1.1",
-		"autoprefixer": "10.4.20",
+		"@radix-ui/react-slot": "1.1.1",
 		"class-variance-authority": "0.7.1",
 		"clsx": "2.1.1",
 		"lucide-react": "0.471.1",
@@ -35,11 +34,12 @@
 		"@types/node": "20.17.0",
 		"@types/react": "19.0.7",
 		"@types/react-dom": "19.0.3",
+		"autoprefixer": "10.4.20",
 		"eslint": "9.18.0",
 		"eslint-config-next": "15.1.4",
 		"husky": "9.1.7",
-		"lint-staged": "15.3.0",
-		"npm-check-updates": "17.1.13",
+		"lint-staged": "15.4.1",
+		"npm-check-updates": "17.1.14",
 		"postcss": "8.5.1",
 		"prettier": "3.4.2",
 		"tailwindcss": "3.4.17",

src/app/globals.css

@@ -5,47 +5,57 @@
 @layer base {
 	:root {
 		--background: 0 0% 100%;
-		--foreground: 222.2 47.4% 11.2%;
-		--muted: 210 40% 96.1%;
-		--muted-foreground: 215.4 16.3% 46.9%;
+		--foreground: 240 10% 3.9%;
+		--muted: 240 4.8% 95.9%;
+		--muted-foreground: 240 3.8% 46.1%;
 		--popover: 0 0% 100%;
-		--popover-foreground: 222.2 47.4% 11.2%;
-		--border: 214.3 31.8% 91.4%;
-		--input: 214.3 31.8% 91.4%;
+		--popover-foreground: 240 10% 3.9%;
+		--border: 240 5.9% 90%;
+		--input: 240 5.9% 90%;
 		--card: 0 0% 100%;
-		--card-foreground: 222.2 47.4% 11.2%;
-		--primary: 222.2 47.4% 11.2%;
-		--primary-foreground: 210 40% 98%;
-		--secondary: 210 40% 96.1%;
-		--secondary-foreground: 222.2 47.4% 11.2%;
-		--accent: 210 40% 96.1%;
-		--accent-foreground: 222.2 47.4% 11.2%;
-		--destructive: 0 100% 50%;
-		--destructive-foreground: 210 40% 98%;
-		--ring: 215 20.2% 65.1%;
+		--card-foreground: 240 10% 3.9%;
+		--primary: 240 5.9% 10%;
+		--primary-foreground: 0 0% 98%;
+		--secondary: 240 4.8% 95.9%;
+		--secondary-foreground: 240 5.9% 10%;
+		--accent: 240 4.8% 95.9%;
+		--accent-foreground: 240 5.9% 10%;
+		--destructive: 0 84.2% 60.2%;
+		--destructive-foreground: 0 0% 98%;
+		--ring: 240 10% 3.9%;
 		--radius: 0.5rem;
+		--chart-1: 12 76% 61%;
+		--chart-2: 173 58% 39%;
+		--chart-3: 197 37% 24%;
+		--chart-4: 43 74% 66%;
+		--chart-5: 27 87% 67%;
 	}
 
 	.dark {
-		--background: 224 71% 4%;
-		--foreground: 213 31% 91%;
-		--muted: 223 47% 11%;
-		--muted-foreground: 215.4 16.3% 56.9%;
-		--accent: 216 34% 17%;
-		--accent-foreground: 210 40% 98%;
-		--popover: 224 71% 4%;
-		--popover-foreground: 215 20.2% 65.1%;
-		--border: 216 34% 17%;
-		--input: 216 34% 17%;
-		--card: 224 71% 4%;
-		--card-foreground: 213 31% 91%;
-		--primary: 210 40% 98%;
-		--primary-foreground: 222.2 47.4% 1.2%;
-		--secondary: 222.2 47.4% 11.2%;
-		--secondary-foreground: 210 40% 98%;
-		--destructive: 0 63% 31%;
-		--destructive-foreground: 210 40% 98%;
-		--ring: 216 34% 17%;
+		--background: 240 10% 3.9%;
+		--foreground: 0 0% 98%;
+		--muted: 240 3.7% 15.9%;
+		--muted-foreground: 240 5% 64.9%;
+		--accent: 240 3.7% 15.9%;
+		--accent-foreground: 0 0% 98%;
+		--popover: 240 10% 3.9%;
+		--popover-foreground: 0 0% 98%;
+		--border: 240 3.7% 15.9%;
+		--input: 240 3.7% 15.9%;
+		--card: 240 10% 3.9%;
+		--card-foreground: 0 0% 98%;
+		--primary: 0 0% 98%;
+		--primary-foreground: 240 5.9% 10%;
+		--secondary: 240 3.7% 15.9%;
+		--secondary-foreground: 0 0% 98%;
+		--destructive: 0 62.8% 30.6%;
+		--destructive-foreground: 0 0% 98%;
+		--ring: 240 4.9% 83.9%;
+		--chart-1: 220 70% 50%;
+		--chart-2: 160 60% 45%;
+		--chart-3: 30 80% 55%;
+		--chart-4: 280 65% 60%;
+		--chart-5: 340 75% 55%;
 	}
 }
 
@@ -60,7 +70,14 @@
 }
 
 body {
-	color: var(--foreground);
-	background: var(--background);
 	font-family: Arial, Helvetica, sans-serif;
 }
+
+@layer base {
+	* {
+		@apply border-border;
+	}
+	body {
+		@apply bg-background text-foreground;
+	}
+}

tailwind.config.ts

@@ -44,10 +44,17 @@ export default {
 					DEFAULT: 'hsl(var(--card))',
 					foreground: 'hsl(var(--card-foreground))',
 				},
+				chart: {
+					'1': 'hsl(var(--chart-1))',
+					'2': 'hsl(var(--chart-2))',
+					'3': 'hsl(var(--chart-3))',
+					'4': 'hsl(var(--chart-4))',
+					'5': 'hsl(var(--chart-5))',
+				},
 			},
 			borderRadius: {
-				lg: `var(--radius)`,
-				md: `calc(var(--radius) - 2px)`,
+				lg: 'var(--radius)',
+				md: 'calc(var(--radius) - 2px)',
 				sm: 'calc(var(--radius) - 4px)',
 			},
 		},