SUMMARY: Fixed button visibility issues in Context Pressure Monitor and added interactive timeline synchronization. Three selectable execution paths with realistic timing profiles. UI FIXES (pressure-chart.js): - Reduced gauge size 20% to prevent arc cut-off - Changed button layout to side-by-side (flex-row) - Fixed Reset button contrast (bg-gray-900 for WCAG AA) - Added mobile responsive layout (flex-col sm:flex-row) - Removed all wrapper div backgrounds causing visibility issues - Trigger timeline simulation when pressure simulation runs TIMELINE ENHANCEMENTS (activity-timeline.js): - Added three execution path profiles (Fast/Standard/Complex) - Fast: 65ms total (simple requests, all checks pass) - Standard: 135ms total (needs validation and verification) - Complex: 285ms total (requires deliberation and consensus) - Real-time event activation synchronized with pressure changes - Added timing disclaimer (estimates based on performance data) - Path selection UI with radio buttons ARCHITECTURE PAGE: - Updated script versions for cache-busting - Added test page for standalone pressure chart debugging ISSUE RESOLVED: User reported 'Simulate Pressure Increase' button hidden. Root cause: Tailwind CSS class conflicts (user correctly identified early). Resolved by simplifying button layout and removing constraining containers. 🤖 Generated with Claude Code (https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
29 lines
1,023 B
HTML
29 lines
1,023 B
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Test - Pressure Chart</title>
|
|
<link rel="stylesheet" href="/css/tailwind.css">
|
|
</head>
|
|
<body class="p-10 bg-gray-50">
|
|
|
|
<h1 class="text-3xl font-bold mb-8">Pressure Chart Test Page</h1>
|
|
|
|
<div class="max-w-2xl">
|
|
<div class="bg-gray-50 rounded-xl shadow-lg p-6 border border-gray-200">
|
|
<div id="pressure-chart"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="mt-8 p-4 bg-blue-50 border border-blue-200 rounded max-w-2xl">
|
|
<h2 class="font-bold mb-2">Debug Info:</h2>
|
|
<p class="text-sm">If both buttons are visible here, the issue is in the architecture.html page layout.</p>
|
|
<p class="text-sm">If buttons are still hidden, the issue is in the JavaScript component itself.</p>
|
|
</div>
|
|
|
|
<script src="/js/components/pressure-chart.js?v=20251020142000"></script>
|
|
<script src="/js/components/activity-timeline.js?v=20251020150000"></script>
|
|
|
|
</body>
|
|
</html>
|