From 030baac309affc814600426bfdd60a85c40754e3 Mon Sep 17 00:00:00 2001
From: Antigravity <antigravity@gemini.ai>
Date: Sun, 28 Jun 2026 13:44:02 +0000
Subject: [PATCH] =?UTF-8?q?fix(sidebar):=20largeur=20w-80=20fixe=20(=C3=A9?=
 =?UTF-8?q?tait=20w-72=20sous=201024px)=20+=20spacing=20prototype?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- w-72 lg:w-80 → w-80 (32px de plus sous 1024px, aligné prototype)
- py-4 → py-5 (rail plus aéré)
- gap-3 → gap-[18px] (logo→nav)
- gap-1.5 → gap-2 (boutons nav)
- mb-1 → mb-2 (logo)
- w-[3px] → w-1 (indicateur actif plus visible)
---
 memento-note/components/sidebar.tsx | 14 +++++++-------
 1 file changed, 7 insertions(+), 7 deletions(-)

diff --git a/memento-note/components/sidebar.tsx b/memento-note/components/sidebar.tsx
index 766b6b5..bc64455 100644
--- a/memento-note/components/sidebar.tsx
+++ b/memento-note/components/sidebar.tsx
@@ -1159,7 +1159,7 @@ export function Sidebar({ className, user }: { className?: string; user?: any })
         className={cn(
           // Mobile: fixed overlay, slide in/out
           'fixed inset-y-0 start-0 z-[70] md:relative md:z-auto',
-          'h-full min-h-0 w-72 lg:w-80 shrink-0 flex flex-row overflow-hidden',
+          'h-full min-h-0 w-80 shrink-0 flex flex-row overflow-hidden',
           'transition-transform duration-300 ease-in-out',
           isMobileOpen ? 'translate-x-0 shadow-2xl' : '-translate-x-full md:translate-x-0',
           'border-e border-border/40 bg-white/95 md:bg-white/30 backdrop-blur-md sidebar-shadow dark:border-white/6 dark:bg-[#151515] dark:backdrop-blur-none',
@@ -1167,14 +1167,14 @@ export function Sidebar({ className, user }: { className?: string; user?: any })
         )}
       >
         {/* ── Column 1 : Rail d'icônes (54px) — inspiré du prototype ── */}
-        <div className="w-[54px] border-e border-border/40 bg-[#FAF9F5] dark:bg-[#0E0E0E] flex flex-col items-center justify-between py-4 shrink-0 select-none">
+        <div className="w-[54px] border-e border-border/40 bg-[#FAF9F5] dark:bg-[#0E0E0E] flex flex-col items-center justify-between py-5 shrink-0 select-none">
 
           {/* Top : Logo + navigation */}
-          <div className="flex flex-col items-center gap-3 w-full">
+          <div className="flex flex-col items-center gap-[18px] w-full">
             {/* Logo avec dropdown profil */}
             <DropdownMenu>
               <DropdownMenuTrigger asChild>
-                <div className="w-9 h-9 bg-brand-accent hover:rotate-6 active:scale-95 flex items-center justify-center rounded-xl shadow-md transition-all cursor-pointer mb-1">
+                <div className="w-9 h-9 bg-brand-accent hover:rotate-6 active:scale-95 flex items-center justify-center rounded-xl shadow-md transition-all cursor-pointer mb-2">
                   <span className="text-white font-serif font-bold text-sm">M</span>
                 </div>
               </DropdownMenuTrigger>
@@ -1205,7 +1205,7 @@ export function Sidebar({ className, user }: { className?: string; user?: any })
             </DropdownMenu>
 
             {/* Boutons de navigation principaux */}
-            <div className="flex flex-col gap-1.5 w-full px-1.5">
+            <div className="flex flex-col gap-2 w-full px-1.5">
               {([
                 {
                   id: 'notebooks',
@@ -1269,7 +1269,7 @@ export function Sidebar({ className, user }: { className?: string; user?: any })
                   )}
                 >
                   {item.isActive && (
-                    <div className="absolute left-0 top-1/2 -translate-y-1/2 w-[3px] h-4 bg-brand-accent rounded-r-full" />
+                    <div className="absolute left-0 top-1/2 -translate-y-1/2 w-1 h-4 bg-brand-accent rounded-r-full" />
                   )}
                   <item.icon size={16} />
                   <span
@@ -1351,7 +1351,7 @@ export function Sidebar({ className, user }: { className?: string; user?: any })
                   : 'text-concrete hover:text-ink dark:hover:text-white hover:bg-black/[0.04] dark:hover:bg-white/[0.04]'
               )}
             >
-              {pathname.startsWith('/settings') && <div className="absolute left-0 top-1/2 -translate-y-1/2 w-[3px] h-4 bg-brand-accent rounded-r-full" />}
+              {pathname.startsWith('/settings') && <div className="absolute left-0 top-1/2 -translate-y-1/2 w-1 h-4 bg-brand-accent rounded-r-full" />}
               <Settings size={15} />
               <span className="absolute left-[50px] top-1/2 -translate-y-1/2 bg-ink dark:bg-white dark:text-ink text-paper text-[9px] font-bold py-1 px-2 rounded opacity-0 group-hover:opacity-100 transition-opacity whitespace-nowrap z-50 pointer-events-none shadow-md uppercase tracking-wider">
                 {t('nav.settings')}