fix(pwa): fix remaining iOS scroll bleed and safe-area height overflow (#16)
Root cause 1 (scroll bleed): padding-top was applied to body in standalone mode. Since .app-shell has height: 100dvh, body-padding shifted the shell beyond the viewport bottom - enabling body-level scrolling. Fix: moved padding-top from body to .app-shell in the standalone media query. Root cause 2 (content overflow): fixed-height page containers (Calendar, Shopping, Meals, Notes, Budget, Contacts) calculated height as 100dvh - nav-bottom - safe-area-inset-bottom, but never subtracted the top safe area. This caused each page to overflow .app-content by exactly env(safe-area-inset-top) pixels in standalone mode. Fix: added --safe-area-inset-top token and subtracted it in all 6 height calculations. Service worker cache bumped to v27/v26.
This commit is contained in:
@@ -15,7 +15,7 @@
|
||||
.calendar-page {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: calc(100dvh - var(--nav-bottom-height) - var(--safe-area-inset-bottom));
|
||||
height: calc(100dvh - var(--safe-area-inset-top) - var(--nav-bottom-height) - var(--safe-area-inset-bottom));
|
||||
max-width: var(--content-max-width);
|
||||
margin: 0 auto;
|
||||
overflow: hidden;
|
||||
|
||||
Reference in New Issue
Block a user