fix: ensure procedural runtime panes are scrollable in app shell

This commit is contained in:
chihlasm
2026-02-17 20:21:49 -05:00
parent db715929e7
commit 9f2e98376e
2 changed files with 6 additions and 3 deletions

View File

@@ -88,10 +88,13 @@
} }
.sidebar { .sidebar {
min-height: 0;
overflow-y: auto; overflow-y: auto;
} }
.main-content { .main-content {
min-height: 0;
min-width: 0;
overflow-y: auto; overflow-y: auto;
} }

View File

@@ -340,7 +340,7 @@ export function ProceduralNavigationPage() {
const currentStepState = currentStep ? stepStates.get(currentStep.id) : undefined const currentStepState = currentStep ? stepStates.get(currentStep.id) : undefined
return ( return (
<div className="flex h-full min-h-0 flex-col"> <div className="flex h-full min-h-0 flex-col overflow-hidden">
{/* Top bar */} {/* Top bar */}
<div className="border-b border-border px-4 py-3 sm:px-6"> <div className="border-b border-border px-4 py-3 sm:px-6">
<div className="flex items-center justify-between gap-4"> <div className="flex items-center justify-between gap-4">
@@ -366,7 +366,7 @@ export function ProceduralNavigationPage() {
</div> </div>
{/* Main content */} {/* Main content */}
<div className="flex min-h-0 flex-1"> <div className="flex min-h-0 flex-1 overflow-hidden">
{/* Left sidebar - step checklist */} {/* Left sidebar - step checklist */}
<div <div
className={cn( className={cn(
@@ -400,7 +400,7 @@ export function ProceduralNavigationPage() {
</div> </div>
{/* Right panel - step detail */} {/* Right panel - step detail */}
<div className="min-h-0 flex-1 overflow-y-auto p-4 sm:p-6"> <div className="min-h-0 flex-1 overflow-y-auto overscroll-y-contain p-4 sm:p-6">
{currentStep && ( {currentStep && (
<StepDetail <StepDetail
step={currentStep} step={currentStep}