carnet layout

This commit is contained in:
alma 2025-04-20 16:26:02 +02:00
parent 00a4f4d299
commit af80e771e5

View File

@ -153,74 +153,78 @@ export default function CarnetPage() {
} }
return ( return (
<main className="flex h-[calc(100vh-3.5rem)] mt-14 bg-carnet-bg"> <main className="w-full h-screen bg-black">
{/* Navigation Panel */} <div className="w-full h-full px-4 pt-12 pb-4">
{showNav && ( <div className="flex h-full bg-carnet-bg">
<> {/* Navigation Panel */}
<div {showNav && (
className="flex flex-col h-full bg-carnet-sidebar" <>
style={{ width: `${navWidth}px` }} <div
> className="flex flex-col h-full bg-carnet-sidebar"
<Navigation style={{ width: `${navWidth}px` }}
layout={layoutMode} >
onLayoutChange={setLayoutMode} <Navigation
nextcloudFolders={nextcloudFolders} layout={layoutMode}
onFolderSelect={handleFolderSelect} onLayoutChange={setLayoutMode}
/> nextcloudFolders={nextcloudFolders}
onFolderSelect={handleFolderSelect}
/>
</div>
{/* Navigation Resizer */}
<PanelResizer
isDragging={isDraggingNav}
onDragStart={() => setIsDraggingNav(true)}
onDragEnd={() => setIsDraggingNav(false)}
onDrag={handleNavResize}
/>
</>
)}
{/* Notes Panel */}
{showNotes && (
<>
<div
className="flex flex-col h-full bg-carnet-bg"
style={{ width: `${notesWidth}px` }}
>
<NotesView onNoteSelect={handleNoteSelect} />
</div>
{/* Notes Resizer */}
<PanelResizer
isDragging={isDraggingNotes}
onDragStart={() => setIsDraggingNotes(true)}
onDragEnd={() => setIsDraggingNotes(false)}
onDrag={handleNotesResize}
/>
</>
)}
{/* Editor Panel */}
<div className="flex-1 flex flex-col h-full bg-carnet-bg">
<Editor note={selectedNote} onSave={handleNoteSave} />
</div> </div>
{/* Navigation Resizer */} {/* Mobile Navigation Toggle */}
<PanelResizer {isMobile && (
isDragging={isDraggingNav} <div className="fixed bottom-4 right-4 flex space-x-2">
onDragStart={() => setIsDraggingNav(true)} <button
onDragEnd={() => setIsDraggingNav(false)} className="p-2 rounded-full bg-primary text-white"
onDrag={handleNavResize} onClick={() => setShowNav(!showNav)}
/> >
</> {showNav ? 'Hide Nav' : 'Show Nav'}
)} </button>
<button
{/* Notes Panel */} className="p-2 rounded-full bg-primary text-white"
{showNotes && ( onClick={() => setShowNotes(!showNotes)}
<> >
<div {showNotes ? 'Hide Notes' : 'Show Notes'}
className="flex flex-col h-full bg-carnet-bg" </button>
style={{ width: `${notesWidth}px` }} </div>
> )}
<NotesView onNoteSelect={handleNoteSelect} />
</div>
{/* Notes Resizer */}
<PanelResizer
isDragging={isDraggingNotes}
onDragStart={() => setIsDraggingNotes(true)}
onDragEnd={() => setIsDraggingNotes(false)}
onDrag={handleNotesResize}
/>
</>
)}
{/* Editor Panel */}
<div className="flex-1 flex flex-col h-full bg-carnet-bg">
<Editor note={selectedNote} onSave={handleNoteSave} />
</div>
{/* Mobile Navigation Toggle */}
{isMobile && (
<div className="fixed bottom-4 right-4 flex space-x-2">
<button
className="p-2 rounded-full bg-primary text-white"
onClick={() => setShowNav(!showNav)}
>
{showNav ? 'Hide Nav' : 'Show Nav'}
</button>
<button
className="p-2 rounded-full bg-primary text-white"
onClick={() => setShowNotes(!showNotes)}
>
{showNotes ? 'Hide Notes' : 'Show Notes'}
</button>
</div> </div>
)} </div>
</main> </main>
); );
} }