FUS-7 keep activity modal on screen
Co-authored-by: multica-agent <github@multica.ai>
This commit is contained in:
@@ -42,12 +42,18 @@ describe("activity-log-mobile-layout.css", () => {
|
|||||||
|
|
||||||
// ── Modal sizing ────────────────────────────────────────────────────
|
// ── Modal sizing ────────────────────────────────────────────────────
|
||||||
|
|
||||||
it("uses modal-lg base class for consistent wide sizing", () => {
|
it("keeps desktop modal width within the viewport", () => {
|
||||||
// The activity-log-modal should NOT set its own max-width; modal-lg handles width
|
|
||||||
const modalBlock = cssContent.match(/\.activity-log-modal\s*\{[^}]*\}/)?.[0];
|
const modalBlock = cssContent.match(/\.activity-log-modal\s*\{[^}]*\}/)?.[0];
|
||||||
expect(modalBlock).toBeTruthy();
|
expect(modalBlock).toBeTruthy();
|
||||||
// Should NOT contain max-width (handled by modal-lg base class)
|
expect(modalBlock).toContain("width: min(95vw, 640px);");
|
||||||
expect(modalBlock).not.toMatch(/max-width:\s*\d+px/);
|
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 ────────────────────────────────────────────────────
|
// ── Close button ────────────────────────────────────────────────────
|
||||||
|
|||||||
@@ -1180,9 +1180,12 @@
|
|||||||
/* ── Activity Log Modal ─────────────────────────────────────────── */
|
/* ── Activity Log Modal ─────────────────────────────────────────── */
|
||||||
|
|
||||||
.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;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
.activity-log-header {
|
.activity-log-header {
|
||||||
|
|||||||
Reference in New Issue
Block a user