feat: sidebar redimensionnable — drag handle entre sidebar et contenu
Some checks failed
CI / Lint, Unit Tests & Build (push) Successful in 6m15s
CI / Deploy production (on server) (push) Failing after 1s

- sidebar-resize.tsx: hook useSidebarResize (localStorage persistence, 280-560px)
- sidebar-resize-client.tsx: wrapper layout qui applique la largeur
- layout.tsx: remplace div statique par SidebarResizeClient
- Resize handle: barre 1px→3px au hover, brand-accent pendant drag
- pointer events (pas mouse) pour support tactile
- cursor: col-resize + userSelect:none pendant le drag

L'utilisateur peut maintenant réduire ou élargir la zone de carnet
en glissant la barre entre le sidebar et le contenu principal.
This commit is contained in:
Antigravity
2026-07-11 17:43:09 +00:00
parent f97c5e8ec4
commit ea326a10b4
3 changed files with 105 additions and 4 deletions

View File

@@ -0,0 +1,19 @@
'use client'
import { type ReactNode } from 'react'
import { useSidebarResize, SidebarResizeHandle } from '@/components/sidebar-resize'
export function SidebarResizeClient({ children }: { children: ReactNode }) {
const { width, isDragging, onPointerDown } = useSidebarResize()
return (
<div className="flex h-screen overflow-hidden bg-memento-desk dark:bg-background">
<div className="contents" style={{ ['--sidebar-width' as string]: `${width}px` }}>
<div className="flex h-full" style={{ width: `${width}px` }}>
{children}
</div>
</div>
<SidebarResizeHandle onPointerDown={onPointerDown} isDragging={isDragging} />
</div>
)
}