From f5cf757142b2cf7c613b18f3e235dc5d378d467a Mon Sep 17 00:00:00 2001
From: paul <paul-nothaft@hotmail.de>
Date: Wed, 9 Jul 2025 09:35:08 +0200
Subject: [PATCH] Fix sticky positioning of version and storage info in admin
 sidebar
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Change AdminLayout to use h-screen instead of min-h-screen
- Add overflow-hidden to prevent scrollbar on outer container
- Update sidebar to use h-screen for proper height reference
- Add flex-shrink-0 to header and bottom sections
- Add min-h-0 to navigation to allow proper overflow
- Add overflow-y-auto to main content area

The version info and storage usage now properly stick to the bottom of the viewport instead of the bottom of the page content.

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <noreply@anthropic.com>
---
 frontend/src/components/admin/AdminLayout.tsx  |  6 +++---
 frontend/src/components/admin/AdminSidebar.tsx | 10 +++++-----
 2 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/frontend/src/components/admin/AdminLayout.tsx b/frontend/src/components/admin/AdminLayout.tsx
index 76f9090..c99ed93 100644
--- a/frontend/src/components/admin/AdminLayout.tsx
+++ b/frontend/src/components/admin/AdminLayout.tsx
@@ -30,7 +30,7 @@ export const AdminLayout: React.FC = () => {
   }
 
   return (
-    <div className="min-h-screen bg-neutral-50 flex">
+    <div className="h-screen bg-neutral-50 flex overflow-hidden">
       {/* Mobile sidebar backdrop */}
       {sidebarOpen && (
         <div
@@ -43,7 +43,7 @@ export const AdminLayout: React.FC = () => {
       <AdminSidebar isOpen={sidebarOpen} onClose={() => setSidebarOpen(false)} />
 
       {/* Main content */}
-      <div className="flex-1 flex flex-col min-w-0">
+      <div className="flex-1 flex flex-col min-w-0 h-screen">
         {/* Header */}
         <AdminHeader onMenuClick={() => setSidebarOpen(true)} />
         
@@ -51,7 +51,7 @@ export const AdminLayout: React.FC = () => {
         <MaintenanceBanner />
 
         {/* Page content */}
-        <main id="main-content" className="flex-1 px-4 sm:px-6 lg:px-8 py-8">
+        <main id="main-content" className="flex-1 px-4 sm:px-6 lg:px-8 py-8 overflow-y-auto">
           <Outlet />
         </main>
       </div>
diff --git a/frontend/src/components/admin/AdminSidebar.tsx b/frontend/src/components/admin/AdminSidebar.tsx
index 946f61d..f069210 100644
--- a/frontend/src/components/admin/AdminSidebar.tsx
+++ b/frontend/src/components/admin/AdminSidebar.tsx
@@ -45,13 +45,13 @@ export const AdminSidebar: React.FC<AdminSidebarProps> = ({ isOpen, onClose }) =
 
   return (
     <div
-      className={`fixed inset-y-0 left-0 z-50 w-64 bg-white border-r border-neutral-200 transform transition-transform duration-200 ease-in-out lg:relative lg:translate-x-0 ${
+      className={`fixed inset-y-0 left-0 z-50 w-64 bg-white border-r border-neutral-200 transform transition-transform duration-200 ease-in-out lg:relative lg:translate-x-0 lg:h-screen ${
         isOpen ? 'translate-x-0' : '-translate-x-full'
       }`}
     >
-      <div className="flex flex-col h-full">
+      <div className="flex flex-col h-screen lg:h-full">
         {/* Logo/Brand */}
-        <div className="flex items-center justify-between h-16 px-6 border-b border-neutral-200">
+        <div className="flex items-center justify-between h-16 px-6 border-b border-neutral-200 flex-shrink-0">
           <div className="flex items-center">
             <Camera className="w-8 h-8 text-primary-600" />
             <span className="ml-2 text-xl font-bold text-neutral-900">{t('admin.title')}</span>
@@ -65,7 +65,7 @@ export const AdminSidebar: React.FC<AdminSidebarProps> = ({ isOpen, onClose }) =
         </div>
 
         {/* Navigation */}
-        <nav className="flex-1 px-4 py-4 space-y-1 overflow-y-auto">
+        <nav className="flex-1 px-4 py-4 space-y-1 overflow-y-auto min-h-0">
           {navigation.map((item) => {
             const isActive = location.pathname === item.href || 
                            (item.href !== '/admin/dashboard' && location.pathname.startsWith(item.href));
@@ -91,7 +91,7 @@ export const AdminSidebar: React.FC<AdminSidebarProps> = ({ isOpen, onClose }) =
         </nav>
 
         {/* Bottom section - sticky to bottom */}
-        <div className="mt-auto">
+        <div className="flex-shrink-0">
           {/* Version Info */}
           <VersionInfo />