diff --git a/packages/dashboard/app/__tests__/dashboard-overflow-containment.test.tsx b/packages/dashboard/app/__tests__/dashboard-overflow-containment.test.tsx index 734a17d865..f9193b2a1f 100644 --- a/packages/dashboard/app/__tests__/dashboard-overflow-containment.test.tsx +++ b/packages/dashboard/app/__tests__/dashboard-overflow-containment.test.tsx @@ -292,7 +292,7 @@ describe("dashboard overflow containment shared mobile/tablet net (FN-6385)", () const mobileRootBlock = ruleBlock(mobileCss, "html,\n body"); const mobileOverlayBlock = ruleBlock( mobileCss, - ".modal-overlay:not(.confirm-dialog-overlay),\n .agent-detail-overlay,\n .agent-dialog-overlay,\n .workflow-output-modal-overlay", + ".modal-overlay:not(.confirm-dialog-overlay),\n .agent-dialog-overlay,\n .workflow-output-modal-overlay", ); const detailBodyBlock = ruleBlock(baseCss, ".detail-body"); const boardBaseBlock = ruleBlock(baseCss, ".board"); diff --git a/packages/dashboard/app/__tests__/mobile-horizontal-pan-containment.test.ts b/packages/dashboard/app/__tests__/mobile-horizontal-pan-containment.test.ts index 2cb72cef28..009549236a 100644 --- a/packages/dashboard/app/__tests__/mobile-horizontal-pan-containment.test.ts +++ b/packages/dashboard/app/__tests__/mobile-horizontal-pan-containment.test.ts @@ -87,7 +87,7 @@ describe("mobile horizontal pan containment (FN-6365)", () => { it("constrains mobile fullscreen overlays to the viewport inline size", () => { const overlayBlock = ruleBlock( mobileCss, - ".modal-overlay:not(.confirm-dialog-overlay),\n .agent-detail-overlay,\n .agent-dialog-overlay,\n .workflow-output-modal-overlay", + ".modal-overlay:not(.confirm-dialog-overlay),\n .agent-dialog-overlay,\n .workflow-output-modal-overlay", ); const modalBlock = ruleBlock( mobileCss, diff --git a/packages/dashboard/app/components/AgentDetailView.css b/packages/dashboard/app/components/AgentDetailView.css index cc0c34fe1f..3efe2bb458 100644 --- a/packages/dashboard/app/components/AgentDetailView.css +++ b/packages/dashboard/app/components/AgentDetailView.css @@ -1,15 +1,22 @@ /* === Agent Detail Modal === */ -.agent-detail-overlay { - position: fixed; - inset: 0; - background: color-mix(in srgb, var(--bg) 60%, transparent); - backdrop-filter: blur(4px); - display: flex; - align-items: center; - justify-content: center; - z-index: 100; - padding: var(--space-lg); -} +/* +FNXC:ModalTouchGeometry 2026-07-30-23:55: +`.agent-detail-overlay` is DELETED — nothing has rendered it since FN-8619 moved Agent Detail onto +FloatingWindow, whose `modal` host owns the scrim (`.floating-window-overlay--modal`). + +It defined a fixed, blurred, flex-centred backdrop, and a mobile rule below reset its padding and +stretched its alignment. Neither is a lost feature: FloatingWindow's overlay is `position: fixed; +inset: 0` with no flex context, so those declarations had nothing to act on — it positions the panel +by geometry instead. + +Deleting it was blocked on one real question: two containment guards +(`dashboard-overflow-containment`, `mobile-horizontal-pan-containment`) pinned a selector list naming +this class, and if that list were the mechanism keeping modal scrims inside mobile pan containment, +removing the entry would open a hole. MEASURED: it is not. The lockdown lives on the global mobile +`html, body` block in styles.css (`overflow-x: hidden`, `overscroll-behavior-x: none`, +`touch-action: pan-y`); the per-overlay list only reasserts it for overlays that are themselves +scroll containers. FloatingWindow.css says the same in its own note at the mobile breakpoint. +*/ .agent-detail-modal { background: var(--surface); @@ -1780,11 +1787,6 @@ Agent Settings composes native inputs, buttons, editors, and portaled controls. Keep its inner modal panel container-sized there; only true phones take over the viewport. */ @media (max-width: 767.98px) { - .agent-detail-overlay { - padding: 0; - align-items: stretch; - } - .agent-detail-modal { /* Reset the desktop min-width: 480px / min-height: 320px — otherwise the fullscreen mobile sheet can still overflow narrow viewports. The diff --git a/packages/dashboard/app/styles.css b/packages/dashboard/app/styles.css index 2c117cb45e..e34010fe2a 100644 --- a/packages/dashboard/app/styles.css +++ b/packages/dashboard/app/styles.css @@ -716,7 +716,6 @@ html .column.drag-over * { transition: none !important; } -[data-theme="light"] .agent-detail-overlay, [data-theme="light"] .agent-dialog-overlay, [data-theme="light"] .chat-new-dialog-backdrop { background: transparent; @@ -3780,7 +3779,6 @@ Toast text must contrast its status background across every dashboard theme and /* Modal: full-screen on mobile (cross-cutting overlay/modal base chrome) */ .modal-overlay:not(.confirm-dialog-overlay), - .agent-detail-overlay, .agent-dialog-overlay, .workflow-output-modal-overlay { padding-top: 0;