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:
Fusion
2026-04-26 14:29:00 -07:00
committed by gsxdsm
parent 112ad671f8
commit b342e6b5d9
4 changed files with 14 additions and 17 deletions

View File

@@ -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", () => {

View File

@@ -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;

View File

@@ -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 {");

View File

@@ -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 */