fix(layout): 상·하단 safe-area 적용 — 헤더/풋터가 상태바·내비바와 겹침 해소

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
2026-07-12 12:46:09 +09:00
parent 08a88f9198
commit ce66565b04
1 changed files with 4 additions and 5 deletions
@@ -16,12 +16,11 @@ body {
  padding-top: env(safe-area-inset-top);
 }
-// iOS 노치/홈바 safe-area 대응.
+// 노치/상태바/홈바 safe-area 대응 (edge-to-edge 웹뷰).
-// 네이티브 웹뷰가 이미 safe-area 아래로 배치돼(이중 여백 방지) CSS 추가 여백은 0.
+// 헤더는 상태바 높이만큼, 풋터는 홈 인디케이터 높이만큼 콘텐츠를 내부로 밀어 겹침 방지.
 // (제목이 상태바에 겹치면 이 값을 소폭 늘린다)
 .safe-top {
-  padding-top: 0;
+  padding-top: env(safe-area-inset-top);
 }
 .safe-bottom {
-  padding-bottom: 0;
+  padding-bottom: env(safe-area-inset-bottom);
 }