carnet layout
This commit is contained in:
parent
00a4f4d299
commit
af80e771e5
@ -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>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
Loading…
Reference in New Issue
Block a user