romtuck/openclaw
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(ui): Make sidebar sticky while scrolling content

Browse Source 
The left navigation sidebar now stays fixed when scrolling through
long content pages like /skills. Changed .shell from min-height to
fixed height with overflow: hidden, allowing nav and content to
scroll independently within their grid cells.

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
pookNast 2026-01-23 08:53:32 -05:00 committed by Peter Steinberger
parent f938f6617b
commit efe5c62ae1
1 changed files with 9 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
ui/src/styles/layout.css
View File

@ -5,7 +5,7 @@
--shell-topbar-height: 56px;
--shell-focus-duration: 220ms;
--shell-focus-ease: cubic-bezier(0.2, 0.85, 0.25, 1);
min-height: 100vh;
height: 100vh;
display: grid;
grid-template-columns: var(--shell-nav-width) minmax(0, 1fr);
grid-template-rows: var(--shell-topbar-height) 1fr;
@ -15,6 +15,13 @@
gap: 0;
animation: dashboard-enter 0.6s ease-out;
transition: grid-template-columns var(--shell-focus-duration) var(--shell-focus-ease);
overflow: hidden;
}
@supports (height: 100dvh) {
.shell {
height: 100dvh;
}
}
.shell--chat {
@ -148,6 +155,7 @@
backdrop-filter: blur(18px);
transition: width var(--shell-focus-duration) var(--shell-focus-ease),
padding var(--shell-focus-duration) var(--shell-focus-ease);
min-height: 0; /* Allow grid item to shrink and enable scrolling */
}
.shell--chat-focus .nav {