fix: sidebar fills full grid cell height

Sidebar wrapper uses flex + h-full, .sidebar gets height: 100%,
removed min-height: 100vh (grid cell handles sizing).

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Michael Chihlas
2026-03-22 01:21:11 -04:00
parent ce76e146fd
commit 00ab9f1832
3 changed files with 5 additions and 4 deletions

View File

@@ -71,8 +71,8 @@ export function AppLayout() {
{/* Top Bar - spans full width */}
<TopBar />
{/* Sidebar - desktop only */}
<div className="hidden md:block">
{/* Sidebar - desktop only, must fill grid row */}
<div className="hidden md:flex md:flex-col md:min-h-0 md:h-full">
<Sidebar />
</div>

View File

@@ -381,7 +381,7 @@ export function Sidebar() {
<nav
ref={sidebarRef}
className="sidebar flex flex-col h-full"
style={{ background: '#0f1118', borderRight: '1px solid #1e2130', minHeight: '100vh' }}
style={{ background: '#0f1118', borderRight: '1px solid #1e2130' }}
onWheel={handleWheel}
>
{/* Pinned sidebar content */}
@@ -422,7 +422,7 @@ export function Sidebar() {
<nav
ref={sidebarRef}
className="sidebar flex flex-col items-center h-full"
style={{ background: '#0f1118', borderRight: '1px solid #1e2130', minHeight: '100vh' }}
style={{ background: '#0f1118', borderRight: '1px solid #1e2130' }}
onWheel={handleWheel}
>
{/* Grouped nav items */}

View File

@@ -272,6 +272,7 @@
.sidebar {
min-height: 0;
height: 100%;
overflow-y: auto;
}