fix(FN-2223): keep Git Manager modal fully visible on mobile
- Add .gm-modal to the shared mobile modal sizing rule used at the main mobile breakpoint - Apply full-width and full-height viewport constraints so the modal no longer renders off-screen - Add CSS coverage assertions in core-modals-mobile tests for Git Manager modal mobile sizing behavior
This commit is contained in:
@@ -110,6 +110,25 @@ describe("core modals mobile css coverage", () => {
|
||||
expect(mobileBlock).toContain("overflow-y: auto;");
|
||||
});
|
||||
|
||||
it("GitManagerModal: modal uses full-screen viewport sizing on mobile (641-768px range)", () => {
|
||||
const css = fs.readFileSync(stylesPath, "utf-8");
|
||||
const mobileBlock = getMainMobileBlock(css);
|
||||
|
||||
// Verify .gm-modal is included in the modal sizing rule block
|
||||
const modalRuleMatch = mobileBlock.match(
|
||||
/\.modal,\s*\.modal-lg,\s*\.modal-md,\s*\.gm-modal\s*\{[^}]+\}/,
|
||||
);
|
||||
expect(modalRuleMatch).not.toBeNull();
|
||||
const modalRule = modalRuleMatch![0];
|
||||
|
||||
// Verify full-screen constraints
|
||||
expect(modalRule).toContain("width: 100%;");
|
||||
expect(modalRule).toContain("max-width: 100%;");
|
||||
expect(modalRule).toContain("height: 100vh;");
|
||||
expect(modalRule).toContain("max-height: 100vh;");
|
||||
expect(modalRule).toContain("border-radius: 0;");
|
||||
});
|
||||
|
||||
it("TaskDetailModal: action dropdown menus have max-height constraint on mobile", () => {
|
||||
const css = fs.readFileSync(stylesPath, "utf-8");
|
||||
const mobileBlock = getMainMobileBlock(css);
|
||||
|
||||
@@ -7132,7 +7132,8 @@ input[type="range"]:focus-visible {
|
||||
|
||||
.modal,
|
||||
.modal-lg,
|
||||
.modal-md {
|
||||
.modal-md,
|
||||
.gm-modal {
|
||||
width: 100%;
|
||||
max-width: 100%;
|
||||
height: 100vh;
|
||||
|
||||
Reference in New Issue
Block a user