From 7c8d2cff313e5a6593b7257003c6768a593d2a03 Mon Sep 17 00:00:00 2001 From: highperfocused Date: Sun, 28 Dec 2025 22:15:40 +0100 Subject: [PATCH] fix: update color variables for consistency in RecentActivityChart and CSS --- .../dashboard/RecentActivityChart.tsx | 2 +- src/index.css | 186 +++++++++--------- 2 files changed, 89 insertions(+), 99 deletions(-) diff --git a/src/components/dashboard/RecentActivityChart.tsx b/src/components/dashboard/RecentActivityChart.tsx index 833e885..c03f24b 100644 --- a/src/components/dashboard/RecentActivityChart.tsx +++ b/src/components/dashboard/RecentActivityChart.tsx @@ -27,7 +27,7 @@ export const description = "Activity timeline showing events per day" const chartConfig = { events: { label: "Events", - color: "hsl(var(--chart-1))", + color: "var(--chart-1)", }, } satisfies ChartConfig diff --git a/src/index.css b/src/index.css index 78a8649..745eecf 100644 --- a/src/index.css +++ b/src/index.css @@ -5,110 +5,100 @@ @layer base { :root { --background: 0 0% 100%; - --foreground: 0 0% 14.9020%; + --foreground: 222.2 84% 4.9%; + --card: 0 0% 100%; - --card-foreground: 0 0% 14.9020%; + --card-foreground: 222.2 84% 4.9%; + --popover: 0 0% 100%; - --popover-foreground: 0 0% 14.9020%; - --primary: 37.6923 92.1260% 50.1961%; - --primary-foreground: 0 0% 0%; - --secondary: 220.0000 14.2857% 95.8824%; - --secondary-foreground: 215 13.7931% 34.1176%; - --muted: 210 20.0000% 98.0392%; - --muted-foreground: 220 8.9362% 46.0784%; - --accent: 48.0000 100.0000% 96.0784%; - --accent-foreground: 22.7273 82.5000% 31.3725%; - --destructive: 0 84.2365% 60.1961%; - --destructive-foreground: 0 0% 100%; - --border: 220 13.0435% 90.9804%; - --input: 220 13.0435% 90.9804%; - --ring: 37.6923 92.1260% 50.1961%; - --chart-1: 37.6923 92.1260% 50.1961%; - --chart-2: 32.1327 94.6188% 43.7255%; - --chart-3: 25.9649 90.4762% 37.0588%; - --chart-4: 22.7273 82.5000% 31.3725%; - --chart-5: 21.7143 77.7778% 26.4706%; - --sidebar: 210 20.0000% 98.0392%; - --sidebar-foreground: 0 0% 14.9020%; - --sidebar-primary: 37.6923 92.1260% 50.1961%; - --sidebar-primary-foreground: 0 0% 100%; - --sidebar-accent: 48.0000 100.0000% 96.0784%; - --sidebar-accent-foreground: 22.7273 82.5000% 31.3725%; - --sidebar-border: 220 13.0435% 90.9804%; - --sidebar-ring: 37.6923 92.1260% 50.1961%; - --font-sans: Inter, sans-serif; - --font-serif: Source Serif 4, serif; - --font-mono: JetBrains Mono, monospace; - --radius: 0.375rem; - --shadow-x: 0px; - --shadow-y: 4px; - --shadow-blur: 8px; - --shadow-spread: -1px; - --shadow-opacity: 0.1; - --shadow-color: hsl(0 0% 0%); - --shadow-2xs: 0px 4px 8px -1px hsl(0 0% 0% / 0.05); - --shadow-xs: 0px 4px 8px -1px hsl(0 0% 0% / 0.05); - --shadow-sm: 0px 4px 8px -1px hsl(0 0% 0% / 0.10), 0px 1px 2px -2px hsl(0 0% 0% / 0.10); - --shadow: 0px 4px 8px -1px hsl(0 0% 0% / 0.10), 0px 1px 2px -2px hsl(0 0% 0% / 0.10); - --shadow-md: 0px 4px 8px -1px hsl(0 0% 0% / 0.10), 0px 2px 4px -2px hsl(0 0% 0% / 0.10); - --shadow-lg: 0px 4px 8px -1px hsl(0 0% 0% / 0.10), 0px 4px 6px -2px hsl(0 0% 0% / 0.10); - --shadow-xl: 0px 4px 8px -1px hsl(0 0% 0% / 0.10), 0px 8px 10px -2px hsl(0 0% 0% / 0.10); - --shadow-2xl: 0px 4px 8px -1px hsl(0 0% 0% / 0.25); - --tracking-normal: 0em; - --spacing: 0.25rem; + --popover-foreground: 222.2 84% 4.9%; + + --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%; + + --muted: 210 40% 96.1%; + --muted-foreground: 215.4 16.3% 46.9%; + + --accent: 210 40% 96.1%; + --accent-foreground: 222.2 47.4% 11.2%; + + --destructive: 0 84.2% 60.2%; + --destructive-foreground: 210 40% 98%; + + --border: 214.3 31.8% 91.4%; + --input: 214.3 31.8% 91.4%; + --ring: 222.2 84% 4.9%; + + --radius: 0.5rem; + + --sidebar-background: 0 0% 98%; + + --sidebar-foreground: 240 5.3% 26.1%; + + --sidebar-primary: 240 5.9% 10%; + + --sidebar-primary-foreground: 0 0% 98%; + + --sidebar-accent: 240 4.8% 95.9%; + + --sidebar-accent-foreground: 240 5.9% 10%; + + --sidebar-border: 220 13% 91%; + + --sidebar-ring: 217.2 91.2% 59.8%; + + --chart-1: oklch(0.646 0.222 41.116); + --chart-2: oklch(0.6 0.118 184.704); + --chart-3: oklch(0.398 0.07 227.392); + --chart-4: oklch(0.828 0.189 84.429); + --chart-5: oklch(0.769 0.188 70.08); } .dark { - --background: 0 0% 9.0196%; - --foreground: 0 0% 89.8039%; - --card: 0 0% 14.9020%; - --card-foreground: 0 0% 89.8039%; - --popover: 0 0% 14.9020%; - --popover-foreground: 0 0% 89.8039%; - --primary: 37.6923 92.1260% 50.1961%; - --primary-foreground: 0 0% 0%; - --secondary: 0 0% 14.9020%; - --secondary-foreground: 0 0% 89.8039%; - --muted: 0 0% 12.1569%; - --muted-foreground: 0 0% 63.9216%; - --accent: 22.7273 82.5000% 31.3725%; - --accent-foreground: 48 96.6387% 76.6667%; - --destructive: 0 84.2365% 60.1961%; - --destructive-foreground: 0 0% 100%; - --border: 0 0% 25.0980%; - --input: 0 0% 25.0980%; - --ring: 37.6923 92.1260% 50.1961%; - --chart-1: 43.2558 96.4126% 56.2745%; - --chart-2: 32.1327 94.6188% 43.7255%; - --chart-3: 22.7273 82.5000% 31.3725%; - --chart-4: 25.9649 90.4762% 37.0588%; - --chart-5: 22.7273 82.5000% 31.3725%; - --sidebar: 0 0% 5.8824%; - --sidebar-foreground: 0 0% 89.8039%; - --sidebar-primary: 37.6923 92.1260% 50.1961%; + --background: 222.2 84% 4.9%; + --foreground: 210 40% 98%; + + --card: 222.2 84% 4.9%; + --card-foreground: 210 40% 98%; + + --popover: 222.2 84% 4.9%; + --popover-foreground: 210 40% 98%; + + --primary: 210 40% 98%; + --primary-foreground: 222.2 47.4% 11.2%; + + --secondary: 217.2 32.6% 17.5%; + --secondary-foreground: 210 40% 98%; + + --muted: 217.2 32.6% 17.5%; + --muted-foreground: 215 20.2% 65.1%; + + --accent: 217.2 32.6% 17.5%; + --accent-foreground: 210 40% 98%; + + --destructive: 0 62.8% 30.6%; + --destructive-foreground: 210 40% 98%; + + --border: 217.2 32.6% 17.5%; + --input: 217.2 32.6% 17.5%; + --ring: 212.7 26.8% 83.9%; + --sidebar-background: 240 5.9% 10%; + --sidebar-foreground: 240 4.8% 95.9%; + --sidebar-primary: 224.3 76.3% 48%; --sidebar-primary-foreground: 0 0% 100%; - --sidebar-accent: 22.7273 82.5000% 31.3725%; - --sidebar-accent-foreground: 48 96.6387% 76.6667%; - --sidebar-border: 0 0% 25.0980%; - --sidebar-ring: 37.6923 92.1260% 50.1961%; - --font-sans: Inter, sans-serif; - --font-serif: Source Serif 4, serif; - --font-mono: JetBrains Mono, monospace; - --radius: 0.375rem; - --shadow-x: 0px; - --shadow-y: 4px; - --shadow-blur: 8px; - --shadow-spread: -1px; - --shadow-opacity: 0.1; - --shadow-color: hsl(0 0% 0%); - --shadow-2xs: 0px 4px 8px -1px hsl(0 0% 0% / 0.05); - --shadow-xs: 0px 4px 8px -1px hsl(0 0% 0% / 0.05); - --shadow-sm: 0px 4px 8px -1px hsl(0 0% 0% / 0.10), 0px 1px 2px -2px hsl(0 0% 0% / 0.10); - --shadow: 0px 4px 8px -1px hsl(0 0% 0% / 0.10), 0px 1px 2px -2px hsl(0 0% 0% / 0.10); - --shadow-md: 0px 4px 8px -1px hsl(0 0% 0% / 0.10), 0px 2px 4px -2px hsl(0 0% 0% / 0.10); - --shadow-lg: 0px 4px 8px -1px hsl(0 0% 0% / 0.10), 0px 4px 6px -2px hsl(0 0% 0% / 0.10); - --shadow-xl: 0px 4px 8px -1px hsl(0 0% 0% / 0.10), 0px 8px 10px -2px hsl(0 0% 0% / 0.10); - --shadow-2xl: 0px 4px 8px -1px hsl(0 0% 0% / 0.25); + --sidebar-accent: 240 3.7% 15.9%; + --sidebar-accent-foreground: 240 4.8% 95.9%; + --sidebar-border: 240 3.7% 15.9%; + --sidebar-ring: 217.2 91.2% 59.8%; + + --chart-1: oklch(0.488 0.243 264.376); + --chart-2: oklch(0.696 0.17 162.48); + --chart-3: oklch(0.769 0.188 70.08); + --chart-4: oklch(0.627 0.265 303.9); + --chart-5: oklch(0.645 0.246 16.439); } }