Jann/investment-sandbox
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Closes #018 - CSS modal layer refactoring for Insider Module

Browse Source
This commit is contained in:
Antigravity Agent
2026-06-14 12:52:37 +02:00
parent 2f0599a3cd
commit 02cedd6ee6
3 changed files with 17 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
DEV_LOG.md
View File

@@ -202,3 +202,16 @@ This document tracks all modifications, npm packages, active compilation states,
* **Active Bugs**: None. * **Active Bugs**: None.
* **Type Checker Status**: Verified 100% clean type verification (`npx tsc --noEmit` returns exit code 0). * **Type Checker Status**: Verified 100% clean type verification (`npx tsc --noEmit` returns exit code 0).
---
## [2026-06-14] - Insider CSS Viewport Refactoring (#ISSUE-018)
### Modified
* **CSS Modal Layout Refactoring**: Fixed the viewport clipping bug in `InsiderMathModal.tsx` and `InsiderBlueprintModal.tsx` by updating the outer wrapper classes to `items-start` with `overflow-y-auto`, and inner card classes to `my-auto max-h-full` to allow dynamic scaling and scrolling.
* **Escape Key & Close Triggers**: Verified that both Escape key events and floating "X" close buttons remain fully functional and reachable across all screen dimensions.
### Active Bugs / Compile Status
* **Active Bugs**: None.
* **Type Checker Status**: Verified 100% clean type verification (`npx tsc --noEmit` returns exit code 0).

4
components/modules/insider/InsiderBlueprintModal.tsx
View File

@@ -24,8 +24,8 @@ export default function InsiderBlueprintModal({ isOpen, onClose }: InsiderBluepr
if (!isOpen) return null; if (!isOpen) return null;
return ( return (
<div className="fixed inset-0 z-50 flex items-center justify-center bg-slate-900/85 backdrop-blur-md p-4 sm:p-6 md:p-8 animate-fade-in"> <div className="fixed inset-0 z-50 overflow-y-auto bg-slate-950/40 backdrop-blur-sm flex items-start justify-center p-4 md:p-10 animate-fade-in">
<div className="bg-slate-900 border border-slate-800/80 rounded-3xl w-full max-w-4xl h-[80vh] flex flex-col overflow-hidden shadow-2xl relative text-slate-350"> <div className="bg-slate-900 border border-slate-800/80 rounded-3xl w-full max-w-4xl my-auto max-h-full flex flex-col overflow-hidden shadow-2xl relative text-slate-350">
{/* Modal Header */} {/* Modal Header */}
<div className="flex justify-between items-center px-6 py-4 bg-slate-950/45 border-b border-slate-800/60"> <div className="flex justify-between items-center px-6 py-4 bg-slate-950/45 border-b border-slate-800/60">

4
components/modules/insider/InsiderMathModal.tsx
View File

@@ -26,8 +26,8 @@ export default function InsiderMathModal({ isOpen, onClose }: InsiderMathModalPr
if (!isOpen) return null; if (!isOpen) return null;
return ( return (
<div className="fixed inset-0 z-50 flex items-center justify-center bg-slate-950/90 backdrop-blur-md p-4 sm:p-6 md:p-8"> <div className="fixed inset-0 z-50 overflow-y-auto bg-slate-950/40 backdrop-blur-sm flex items-start justify-center p-4 md:p-10">
<div className="bg-slate-900 border border-slate-800/80 rounded-3xl w-full max-w-4xl h-[80vh] flex flex-col overflow-hidden shadow-2xl relative text-slate-330"> <div className="bg-slate-900 border border-slate-800/80 rounded-3xl w-full max-w-4xl my-auto max-h-full flex flex-col overflow-hidden shadow-2xl relative text-slate-330">
{/* Modal Header */} {/* Modal Header */}
<div className="flex justify-between items-center px-6 py-4 bg-slate-950/40 border-b border-slate-800/60"> <div className="flex justify-between items-center px-6 py-4 bg-slate-950/40 border-b border-slate-800/60">