Matthias-Claudius-Schule/borrow-system
3
1
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor Layout component for improved sidebar responsiveness

Browse Source
This commit is contained in:
Theis Gaedigk
2025-08-20 13:17:23 +02:00
parent 67dd74d3d3
commit c33f3e1101
1 changed files with 2 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
frontend/src/layout/Layout.tsx
View File

@@ -14,16 +14,12 @@ const Layout: React.FC<LayoutProps> = ({ children, onLogout }) => {
{/* Main */} {/* Main */}
<main className="flex-1 min-h-0 overflow-hidden flex flex-col items-center px-3 sm:px-5 py-4 sm:py-8"> <main className="flex-1 min-h-0 overflow-hidden flex flex-col items-center px-3 sm:px-5 py-4 sm:py-8">
{/* Sidebar on mobile appears inline on top; on desktop it's a sticky column */} {/* Sidebar on mobile appears inline on top; on desktop it's a sticky column */}
<div className="w-full max-w-5xl md:flex md:gap-6 md:items-stretch md:min-h-0 md:h-full"> <div className="w-full max-w-5xl flex flex-col gap-3 md:flex-row md:gap-6 md:items-stretch min-h-0 h-full">
<div className="block md:hidden mb-3">
<Sidebar />
</div>
<div className="hidden md:flex md:flex-col md:shrink-0 md:w-72 md:min-h-0 md:h-full"> <div className="hidden md:flex md:flex-col md:shrink-0 md:w-72 md:min-h-0 md:h-full">
<Sidebar /> <Sidebar />
</div> </div>
<div className="flex-1 min-w-0 md:min-h-0 md:h-full flex flex-col overflow-hidden"> <div className="flex-1 min-w-0 min-h-0 h-full flex flex-col overflow-hidden">
<div className="w-full"> <div className="w-full">
<Header onLogout={onLogout} /> <Header onLogout={onLogout} />
</div> </div>