diff --git a/src/shared/ui/assets/css/style-fix.css b/src/shared/ui/assets/css/style-fix.css index 899ac92..873089f 100644 --- a/src/shared/ui/assets/css/style-fix.css +++ b/src/shared/ui/assets/css/style-fix.css @@ -93,6 +93,10 @@ main.home-main{ width: 85px; } .full-menu-container{ + padding-top: 50px; +} +/* pdw-16 클래스가 있는 경우 (settlement-detail 등)에만 safe area 적용 */ +.full-menu-container.pdw-16{ padding-top: calc(50px + env(safe-area-inset-top)); } .full-menu-header{ @@ -100,9 +104,24 @@ main.home-main{ z-index: 20; background-color: #ffffff; width: 100%; + top: env(safe-area-inset-top); +} +/* pdw-16 클래스가 있는 경우: 헤더는 safe area 아래, 하지만 높이는 확장하여 스크롤 영역 보호 */ +.full-menu-container.pdw-16 .full-menu-header{ + /* 헤더는 일반 메뉴처럼 safe area 아래에 위치 */ + top: env(safe-area-inset-top); + /* 추가: 헤더 뒤에 배경 영역 추가로 스크롤 컨텐츠가 safe area로 올라가지 못하도록 */ +} +/* 헤더 뒤의 safe area 영역을 덮는 가상 요소 */ +.full-menu-container.pdw-16 .full-menu-header::before{ + content: ''; + position: fixed; top: 0; - padding-top: env(safe-area-inset-top); - height: calc(50px + env(safe-area-inset-top)); + left: 0; + right: 0; + height: env(safe-area-inset-top); + background-color: #ffffff; + z-index: 19; } .full-menu-top-nav{ position: fixed;