From ac8fef0045c578f4c00449b3e17985d4a215c6d8 Mon Sep 17 00:00:00 2001
From: TheFlow <theflow@sydigital.com>
Date: Mon, 20 Oct 2025 08:37:30 +1300
Subject: [PATCH] fix(layout): add overflow-auto to demo containers for
 scrollable content
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

SUMMARY:
Added overflow-auto to both demo containers to fix cut-off content issue
where 'Simulate Pressure Increase' button was hidden above visible area.

ISSUE:
User reported button exists in DOM but is not visible on screen. The top
of the modal content was cut off, showing only the bottom portion (Reset
button visible, but Simulate button hidden above).

FIX:
Added overflow-auto to both containers:
- Context Pressure Monitor container
- Framework Activity Timeline container

This allows users to scroll within the container if content exceeds the
min-height of 600px, ensuring all buttons and content are accessible.

🤖 Generated with Claude Code (https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
---
 public/architecture.html | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/public/architecture.html b/public/architecture.html
index ae8787da..56a6bac6 100644
--- a/public/architecture.html
+++ b/public/architecture.html
@@ -372,12 +372,12 @@
 
       <div class="grid grid-cols-1 lg:grid-cols-2 gap-8">
         <!-- Context Pressure Monitor Visualization -->
-        <div class="bg-gray-50 rounded-xl shadow-lg p-6 border border-gray-200 min-h-[600px]">
+        <div class="bg-gray-50 rounded-xl shadow-lg p-6 border border-gray-200 min-h-[600px] overflow-auto">
           <div id="pressure-chart"></div>
         </div>
 
         <!-- Framework Activity Timeline -->
-        <div class="bg-gray-50 rounded-xl shadow-lg p-6 border border-gray-200 min-h-[600px]">
+        <div class="bg-gray-50 rounded-xl shadow-lg p-6 border border-gray-200 min-h-[600px] overflow-auto">
           <div id="activity-timeline"></div>
         </div>
       </div>