julienfroidefond/fintrack
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: add sidebar-opaque color variable and update Sidebar component styling; enhance visual consistency by applying new background color to the sidebar

Browse Source
This commit is contained in:
Julien Froidefond
2025-12-23 12:15:49 +01:00
parent f295e86fc2
commit 804b0f0aad
2 changed files with 5 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
app/globals.css
View File

@@ -74,6 +74,7 @@
/* Sidebar moderne avec glassmorphism très prononcé */ /* Sidebar moderne avec glassmorphism très prononcé */
--sidebar: oklch(1 0 0 / 0.5); --sidebar: oklch(1 0 0 / 0.5);
--sidebar-opaque: oklch(1 0 0);
--sidebar-foreground: oklch(0.2 0.015 280); --sidebar-foreground: oklch(0.2 0.015 280);
--sidebar-primary: oklch(0.6 0.25 270); --sidebar-primary: oklch(0.6 0.25 270);
--sidebar-primary-foreground: oklch(0.99 0 0); --sidebar-primary-foreground: oklch(0.99 0 0);
@@ -157,6 +158,7 @@
/* Sidebar avec profondeur distincte */ /* Sidebar avec profondeur distincte */
--sidebar: oklch(0.1 0.01 260); --sidebar: oklch(0.1 0.01 260);
--sidebar-opaque: oklch(0.1 0.01 260);
--sidebar-foreground: oklch(0.9 0.005 260); --sidebar-foreground: oklch(0.9 0.005 260);
--sidebar-primary: oklch(0.72 0.19 220); --sidebar-primary: oklch(0.72 0.19 220);
--sidebar-primary-foreground: oklch(0.12 0.008 260); --sidebar-primary-foreground: oklch(0.12 0.008 260);
@@ -207,6 +209,7 @@
--radius-lg: var(--radius); --radius-lg: var(--radius);
--radius-xl: calc(var(--radius) + 4px); --radius-xl: calc(var(--radius) + 4px);
--color-sidebar: var(--sidebar); --color-sidebar: var(--sidebar);
--color-sidebar-opaque: var(--sidebar-opaque);
--color-sidebar-foreground: var(--sidebar-foreground); --color-sidebar-foreground: var(--sidebar-foreground);
--color-sidebar-primary: var(--sidebar-primary); --color-sidebar-primary: var(--sidebar-primary);
--color-sidebar-primary-foreground: var(--sidebar-primary-foreground); --color-sidebar-primary-foreground: var(--sidebar-primary-foreground);

3
components/dashboard/sidebar.tsx
View File

@@ -168,7 +168,8 @@ export function Sidebar({ open, onOpenChange }: SidebarProps) {
<Sheet open={open} onOpenChange={onOpenChange}> <Sheet open={open} onOpenChange={onOpenChange}>
<SheetContent <SheetContent
side="left" side="left"
className="w-64 p-0 bg-sidebar text-sidebar-foreground border-sidebar-border" className="w-64 p-0 text-sidebar-foreground border-sidebar-border"
style={{ backgroundColor: 'var(--sidebar-opaque)' }}
> >
<SheetTitle className="sr-only">Navigation</SheetTitle> <SheetTitle className="sr-only">Navigation</SheetTitle>
<div className="flex flex-col h-full"> <div className="flex flex-col h-full">