From ae703be9f377f7a30cd1d35313d2bb5676d1f364 Mon Sep 17 00:00:00 2001
From: Andy <119136210+AndyMik90@users.noreply.github.com>
Date: Wed, 4 Feb 2026 11:19:47 +0100
Subject: [PATCH] auto-claude: subtask-1-1 - Add min-h-0 to enable scrolling in
 Roadmap tabs (#1655)

Fix scrolling in Roadmap Phases tab and other tabs by adding min-h-0
to flex containers. This is a classic flexbox fix where flex items
won't shrink below their content's minimum height without min-h-0.

Changes:
- Roadmap.tsx: Add min-h-0 to content wrapper div
- RoadmapTabs.tsx: Add min-h-0 to all TabsContent elements (kanban,
  phases, features, priorities)

Co-authored-by: Claude Opus 4.5 <noreply@anthropic.com>
---
 apps/frontend/src/renderer/components/Roadmap.tsx         | 2 +-
 .../src/renderer/components/roadmap/RoadmapTabs.tsx       | 8 ++++----
 2 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/apps/frontend/src/renderer/components/Roadmap.tsx b/apps/frontend/src/renderer/components/Roadmap.tsx
index 15ac182a..1a5307e7 100644
--- a/apps/frontend/src/renderer/components/Roadmap.tsx
+++ b/apps/frontend/src/renderer/components/Roadmap.tsx
@@ -105,7 +105,7 @@ export function Roadmap({ projectId, onGoToTask }: RoadmapProps) {
       />
 
       {/* Content */}
-      <div className="flex-1 overflow-hidden">
+      <div className="flex-1 min-h-0 overflow-hidden">
         <RoadmapTabs
           roadmap={roadmap}
           activeTab={activeTab}
diff --git a/apps/frontend/src/renderer/components/roadmap/RoadmapTabs.tsx b/apps/frontend/src/renderer/components/roadmap/RoadmapTabs.tsx
index ca5de7d9..56f2c5cd 100644
--- a/apps/frontend/src/renderer/components/roadmap/RoadmapTabs.tsx
+++ b/apps/frontend/src/renderer/components/roadmap/RoadmapTabs.tsx
@@ -35,7 +35,7 @@ export function RoadmapTabs({
       </TabsList>
 
       {/* Kanban View */}
-      <TabsContent value="kanban" className="flex-1 overflow-hidden">
+      <TabsContent value="kanban" className="flex-1 min-h-0 overflow-hidden">
         <RoadmapKanbanView
           key={roadmap.updatedAt?.toString()}
           roadmap={roadmap}
@@ -47,7 +47,7 @@ export function RoadmapTabs({
       </TabsContent>
 
       {/* Phases View */}
-      <TabsContent value="phases" className="flex-1 overflow-auto p-4">
+      <TabsContent value="phases" className="flex-1 min-h-0 overflow-auto p-4">
         <div className="space-y-6">
           {roadmap.phases.map((phase: RoadmapPhase, index: number) => (
             <PhaseCard
@@ -64,7 +64,7 @@ export function RoadmapTabs({
       </TabsContent>
 
       {/* All Features View */}
-      <TabsContent value="features" className="flex-1 overflow-auto p-4">
+      <TabsContent value="features" className="flex-1 min-h-0 overflow-auto p-4">
         <div className="grid gap-3">
           {roadmap.features.map((feature: RoadmapFeature) => (
             <FeatureCard
@@ -80,7 +80,7 @@ export function RoadmapTabs({
       </TabsContent>
 
       {/* By Priority View */}
-      <TabsContent value="priorities" className="flex-1 overflow-auto p-4">
+      <TabsContent value="priorities" className="flex-1 min-h-0 overflow-auto p-4">
         <div className="grid grid-cols-2 gap-4">
           {['must', 'should', 'could', 'wont'].map((priority: string) => {
             const features = roadmap.features.filter((f: RoadmapFeature) => f.priority === priority);