diff --git a/.gitignore b/.gitignore index 4af2674..b531dc9 100644 --- a/.gitignore +++ b/.gitignore @@ -25,5 +25,6 @@ dist-ssr .vite/ +.claude/ AGENTS.md CLAUDE.md \ No newline at end of file diff --git a/index.html b/index.html index 06c9ac6..28caadd 100644 --- a/index.html +++ b/index.html @@ -3,7 +3,7 @@ - + 나이스가맹점관리자 diff --git a/src/shared/ui/assets/css/safearea.css b/src/shared/ui/assets/css/safearea.css new file mode 100644 index 0000000..f0518f0 --- /dev/null +++ b/src/shared/ui/assets/css/safearea.css @@ -0,0 +1,15 @@ +:root { + --safe-area-inset-top: env(safe-area-inset-top, 0px); + --safe-area-inset-right: env(safe-area-inset-right, 0px); + --safe-area-inset-bottom: env(safe-area-inset-bottom, 0px); + --safe-area-inset-left: env(safe-area-inset-left, 0px); +} + +.safe-area { + padding-top: var(--safe-area-inset-top); + padding-right: var(--safe-area-inset-right); + padding-bottom: var(--safe-area-inset-bottom); + padding-left: var(--safe-area-inset-left); + box-sizing: border-box; + min-height: 100vh; +} \ No newline at end of file diff --git a/src/shared/ui/assets/css/style.css b/src/shared/ui/assets/css/style.css index de8a4ae..bbde3f6 100644 --- a/src/shared/ui/assets/css/style.css +++ b/src/shared/ui/assets/css/style.css @@ -1,6 +1,7 @@ @charset "utf-8"; @import 'reset.css'; @import 'fonts.css'; +@import 'safearea.css'; :root { diff --git a/src/utils/safeArea.ts b/src/utils/safeArea.ts new file mode 100644 index 0000000..7047b9a --- /dev/null +++ b/src/utils/safeArea.ts @@ -0,0 +1,17 @@ +// safeArea.ts +export function setSafeAreaInsets(top: number, right: number, bottom: number, left: number) { + const root = document.documentElement; + root.style.setProperty("--safe-area-inset-top", `${top}px`); + root.style.setProperty("--safe-area-inset-right", `${right}px`); + root.style.setProperty("--safe-area-inset-bottom", `${bottom}px`); + root.style.setProperty("--safe-area-inset-left", `${left}px`); + } + + // 전역에서 호출할 수 있게 window에 바인딩 (Android WebView 네이티브에서 실행할 수 있도록) + declare global { + interface Window { + setSafeAreaInsets: typeof setSafeAreaInsets; + } + } + + window.setSafeAreaInsets = setSafeAreaInsets; \ No newline at end of file