sepehr/Momento
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(sidebar): largeur w-80 fixe (était w-72 sous 1024px) + spacing prototype
Some checks failed
CI / Deploy production (on server) (push) Has been cancelled
Details
CI / Lint, Unit Tests & Build (push) Has been cancelled
Details

Browse Source 
- 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)
This commit is contained in:
Antigravity
2026-06-28 13:44:02 +00:00
parent 19d446f78e
commit 030baac309
1 changed files with 7 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
memento-note/components/sidebar.tsx
View File

@@ -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')}