feat(FN-2613): merge fusion/fn-2613 (auto-resolved)
- test(FN-2613): complete Step 3 — update mobile and standalone CSS assertions - feat(FN-2613): complete Step 2 — move standalone token override to global styles - feat(FN-2613): complete Step 1 — remove mobile root safe-area padding
This commit is contained in:
@@ -40,7 +40,7 @@ describe("PWA configuration", () => {
|
||||
const cssContent = loadAllAppCss();
|
||||
|
||||
expect(cssContent).toMatch(/@media\s*\(\s*display-mode:\s*standalone\s*\)/);
|
||||
expect(cssContent).toMatch(/@media\s*\(\s*display-mode:\s*standalone\s*\)\s*\{[^}]*#root\s*\{[^}]*env\(safe-area-inset-bottom,\s*0px\)/);
|
||||
expect(cssContent).toMatch(/@media\s*\(\s*display-mode:\s*standalone\s*\)\s*\{[\s\S]*?#root\s*\{[\s\S]*?env\(safe-area-inset-bottom,\s*0px\)/);
|
||||
});
|
||||
|
||||
it("CSS includes --standalone-bottom-gap token with 8px value in standalone mode", () => {
|
||||
|
||||
@@ -1396,16 +1396,6 @@
|
||||
box-shadow: var(--shadow-sm);
|
||||
}
|
||||
|
||||
@media (display-mode: standalone) {
|
||||
#root {
|
||||
/* FN-1626: additive bottom spacing = safe-area inset + 8px home bar gap */
|
||||
padding-bottom: calc(env(safe-area-inset-bottom, 0px) + var(--standalone-bottom-gap));
|
||||
}
|
||||
|
||||
/* PWA standalone mode: 8px extra breathing room for iOS home indicator */
|
||||
--standalone-bottom-gap: 8px;
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.detail-tab {
|
||||
min-height: 36px;
|
||||
|
||||
@@ -73,8 +73,7 @@ describe("mobile CSS foundation", () => {
|
||||
const mobileSection = getMainMobileSection(css);
|
||||
|
||||
expect(mobileSection).toContain("#root {");
|
||||
expect(mobileSection).toContain("padding-top: env(safe-area-inset-top, 0px);");
|
||||
expect(mobileSection).toContain("padding-bottom: env(safe-area-inset-bottom, 0px);");
|
||||
expect(mobileSection).toContain("overflow: hidden;");
|
||||
expect(mobileSection).toContain(".header {");
|
||||
expect(mobileSection).toContain("padding-left: max(var(--space-md), env(safe-area-inset-left, 0px));");
|
||||
expect(mobileSection).toContain(".board {");
|
||||
|
||||
@@ -2685,6 +2685,18 @@ input[type="range"]:focus-visible {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
@media (display-mode: standalone) {
|
||||
:root {
|
||||
/* PWA standalone mode: 8px extra breathing room for iOS home indicator */
|
||||
--standalone-bottom-gap: 8px;
|
||||
}
|
||||
|
||||
#root {
|
||||
/* FN-1626: additive bottom spacing = safe-area inset + standalone home bar gap */
|
||||
padding-bottom: calc(env(safe-area-inset-bottom, 0px) + var(--standalone-bottom-gap));
|
||||
}
|
||||
}
|
||||
|
||||
/* === Mobile Responsive Overrides ===
|
||||
Cross-cutting mobile rules only. Component-specific overrides have been
|
||||
moved into co-located @media blocks at the bottom of each component's
|
||||
@@ -2712,10 +2724,6 @@ input[type="range"]:focus-visible {
|
||||
|
||||
#root {
|
||||
overflow: hidden;
|
||||
padding-top: env(safe-area-inset-top, 0px);
|
||||
padding-bottom: env(safe-area-inset-bottom, 0px);
|
||||
padding-left: env(safe-area-inset-left, 0px);
|
||||
padding-right: env(safe-area-inset-right, 0px);
|
||||
}
|
||||
|
||||
/* Prevent horizontal overflow from wide content */
|
||||
|
||||
Reference in New Issue
Block a user