diff --git a/packages/dashboard/app/__tests__/activity-log-mobile-layout.test.ts b/packages/dashboard/app/__tests__/activity-log-mobile-layout.test.ts index 7390f1e466..73c47dbda0 100644 --- a/packages/dashboard/app/__tests__/activity-log-mobile-layout.test.ts +++ b/packages/dashboard/app/__tests__/activity-log-mobile-layout.test.ts @@ -42,12 +42,18 @@ describe("activity-log-mobile-layout.css", () => { // ── Modal sizing ──────────────────────────────────────────────────── - it("uses modal-lg base class for consistent wide sizing", () => { - // The activity-log-modal should NOT set its own max-width; modal-lg handles width + it("keeps desktop modal width within the viewport", () => { const modalBlock = cssContent.match(/\.activity-log-modal\s*\{[^}]*\}/)?.[0]; expect(modalBlock).toBeTruthy(); - // Should NOT contain max-width (handled by modal-lg base class) - expect(modalBlock).not.toMatch(/max-width:\s*\d+px/); + expect(modalBlock).toContain("width: min(95vw, 640px);"); + expect(modalBlock).toContain("max-width: 95vw;"); + }); + + it("keeps desktop modal height inside the visible viewport", () => { + const modalBlock = cssContent.match(/\.activity-log-modal\s*\{[^}]*\}/)?.[0]; + expect(modalBlock).toBeTruthy(); + expect(modalBlock).toMatch(/max-height:\s*calc\(100dvh - var\(--overlay-padding-top,\s*10vh\) - 16px\);/); + expect(modalBlock).toContain("overflow: hidden;"); }); // ── Close button ──────────────────────────────────────────────────── diff --git a/packages/dashboard/app/components/ScriptsModal.css b/packages/dashboard/app/components/ScriptsModal.css index 33be4d3ecd..5cd5795bab 100644 --- a/packages/dashboard/app/components/ScriptsModal.css +++ b/packages/dashboard/app/components/ScriptsModal.css @@ -1180,9 +1180,12 @@ /* ── Activity Log Modal ─────────────────────────────────────────── */ .activity-log-modal { - max-height: 80vh; + width: min(95vw, 640px); + max-width: 95vw; + max-height: calc(100dvh - var(--overlay-padding-top, 10vh) - 16px); display: flex; flex-direction: column; + overflow: hidden; } .activity-log-header {