fix(bottle): handle scrollable area height (#61)

Nexters · Sep 26, 2024 · 51fe112 · 51fe112
1 parent bcd3670
commit 51fe112
Show file tree

Hide file tree

Showing 2 changed files with 2 additions and 2 deletions.
diff --git a/apps/bottle/src/app/profile/edit/profileEditStyle.css.ts b/apps/bottle/src/app/profile/edit/profileEditStyle.css.ts
@@ -4,7 +4,7 @@ import { style } from '@vanilla-extract/css';
 
 export const contentsContainerStyle = style({
   width: '100%',
-  height: `calc(100vh - ${HEADER_HEIGHT}px)`,
+  height: `calc(100vh - ${HEADER_HEIGHT}px + env(safe-area-inset-top))`,
   display: 'flex',
   flexDirection: 'column',
   alignItems: 'center',

diff --git a/apps/bottle/src/components/profile/layout/profileLayoutStyle.css.ts b/apps/bottle/src/components/profile/layout/profileLayoutStyle.css.ts
@@ -21,7 +21,7 @@ export const buttonContainer = style({
 });
 
 export const containerStyle = style({
-  height: `calc(100vh - ${CONTAINER_OFFSET_HEIGHT - OVERLAP_HEIGHT}px)`,
+  height: `calc(100vh - ${CONTAINER_OFFSET_HEIGHT - OVERLAP_HEIGHT}px + env(safe-area-inset-top))`,
   overflow: 'scroll',
   msOverflowStyle: 'none',
   scrollbarWidth: 'none',