Fix Scene 11 approval grid responsiveness

This commit is contained in:
lda
2026-07-12 09:51:20 +07:00 Verified
parent b4c442402b
commit 896174d718
2 changed files with 12 additions and 1 deletions
@@ -3,6 +3,7 @@ import { join } from "node:path";
import { describe, expect, it } from "vitest";
const css = readFileSync(join(import.meta.dirname, "presentation.css"), "utf8").replace(/\r\n/g, "\n");
const demoWorkflowCss = readFileSync(join(import.meta.dirname, "styles", "demo-workflow.css"), "utf8").replace(/\r\n/g, "\n");
describe("presentation.css", () => {
it("allows hidden primary-region scrolling for browser zoom overflow", () => {
@@ -25,6 +26,17 @@ describe("presentation.css", () => {
expect(breakpointBlock).toMatch(/\.evaluation-board__audit-row\s*\{\s*grid-template-columns: 1fr;/);
});
it("keeps the Scene 11 approval grid out of the 1050px stacking rule", () => {
const breakpointBlock = [...demoWorkflowCss.matchAll(
/@container presentation-canvas \(max-width: 1050px\) \{(?<body>[\s\S]*?)\n\}/g,
)].find((match) => match.groups?.body?.includes(".guided-product-moment__interrupt-grid"))?.groups?.body;
expect(breakpointBlock).toContain(".guided-product-moment__interrupt-grid");
expect(breakpointBlock).toContain(".guided-product-moment__resume-grid");
expect(breakpointBlock).toContain(".guided-product-moment__trace-grid");
expect(breakpointBlock).not.toContain(".guided-product-moment__approval-grid");
});
it("keeps the full evaluation board available to the scrollable stage", () => {
const boardBlock = css.match(/\.evaluation-board\s*\{(?<body>[\s\S]*?)\n\}/)?.groups?.body;
@@ -1585,7 +1585,6 @@
}
@container presentation-canvas (max-width: 1050px) {
.guided-product-moment__approval-grid,
.guided-product-moment__interrupt-grid,
.guided-product-moment__resume-grid,
.guided-product-moment__trace-grid {