diff options
| author | Ibuki Sugiyama <main@fuwa.dev> | 2023-07-25 19:49:52 +0900 |
|---|---|---|
| committer | GitHub <noreply@github.com> | 2023-07-25 19:49:52 +0900 |
| commit | 545b5cab9618753667b0d53320ced0928a941d5e (patch) | |
| tree | a4f1478e3e849b6370f75ae92bc4fef99df6defb /packages/frontend/src | |
| parent | refactor: Array.from(iterable).map(mapfn)ă‚’Array.from(iterable | { length: n... (diff) | |
| download | misskey-545b5cab9618753667b0d53320ced0928a941d5e.tar.gz misskey-545b5cab9618753667b0d53320ced0928a941d5e.tar.bz2 misskey-545b5cab9618753667b0d53320ced0928a941d5e.zip | |
fix: insert bottom spacing appropriately (#11370)
Diffstat (limited to 'packages/frontend/src')
| -rw-r--r-- | packages/frontend/src/style.scss | 6 | ||||
| -rw-r--r-- | packages/frontend/src/ui/universal.vue | 2 |
2 files changed, 6 insertions, 2 deletions
diff --git a/packages/frontend/src/style.scss b/packages/frontend/src/style.scss index bd74db7c85..85ad442ba4 100644 --- a/packages/frontend/src/style.scss +++ b/packages/frontend/src/style.scss @@ -6,11 +6,13 @@ --marginHalf: 10px; --margin: var(--marginFull); - --minBottomSpacing: 0px; + + // switch dynamically + --minBottomSpacingMobile: calc(72px + max(12px, env(safe-area-inset-bottom, 0px))); + --minBottomSpacing: var(--minBottomSpacingMobile); @media (max-width: 500px) { --margin: var(--marginHalf); - --minBottomSpacing: calc(72px + max(12px, env(safe-area-inset-bottom, 0px))); } //--ad: rgb(255 169 0 / 10%); diff --git a/packages/frontend/src/ui/universal.vue b/packages/frontend/src/ui/universal.vue index 9ae43c39d3..50866b23ed 100644 --- a/packages/frontend/src/ui/universal.vue +++ b/packages/frontend/src/ui/universal.vue @@ -207,9 +207,11 @@ watch($$(navFooter), () => { if (navFooter) { navFooterHeight = navFooter.offsetHeight; document.body.style.setProperty('--stickyBottom', `${navFooterHeight}px`); + document.body.style.setProperty('--minBottomSpacing', 'var(--minBottomSpacingMobile)'); } else { navFooterHeight = 0; document.body.style.setProperty('--stickyBottom', '0px'); + document.body.style.setProperty('--minBottomSpacing', '0px'); } }, { immediate: true, |