From d53eb28e13cee6559820f05362b0a331755da6ff Mon Sep 17 00:00:00 2001
From: Dongmin Ahn <eamon3481@naver.com>
Date: Tue, 13 Feb 2024 21:54:15 +0900
Subject: [PATCH] =?UTF-8?q?fix=20:=20zIndex=20=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/BottomSheet/BottomSheet.tsx | 12 +++++++++++-
 src/components/Header/HeaderBase.tsx       |  2 +-
 2 files changed, 12 insertions(+), 2 deletions(-)

diff --git a/src/components/BottomSheet/BottomSheet.tsx b/src/components/BottomSheet/BottomSheet.tsx
index 61bfd98d..784f1187 100644
--- a/src/components/BottomSheet/BottomSheet.tsx
+++ b/src/components/BottomSheet/BottomSheet.tsx
@@ -22,7 +22,7 @@ function BottomSheet({ children, isDraggable = false, onClickOutside, isShowing,
   return (
     <SpringBottomSheet
       open={isShowing}
-      className={css(bottomSheetCss, isDraggable ? {} : nonDraggableCss)}
+      className={css(bottomSheetCss, isDraggable ? {} : nonDraggableCss, zIndexCss)}
       onDismiss={onClickOutside}
     >
       <div className={headerWrapperCss}>{headerElement}</div>
@@ -40,6 +40,16 @@ const nonDraggableCss = {
     display: 'none',
   },
 };
+
+const zIndexCss = {
+  '& [data-rsbs-overlay]': {
+    zIndex: '100 !important',
+  },
+  '& [data-rsbs-backdrop]': {
+    zIndex: '100 !important',
+  },
+};
+
 const contentCss = css({
   padding: '0 16px',
 });
diff --git a/src/components/Header/HeaderBase.tsx b/src/components/Header/HeaderBase.tsx
index 2c0225d1..be399267 100644
--- a/src/components/Header/HeaderBase.tsx
+++ b/src/components/Header/HeaderBase.tsx
@@ -57,7 +57,7 @@ const wrapperCss = flex({
   left: 0,
   right: 0,
   top: 0,
-  zIndex: 3,
+  zIndex: 'appBar',
   position: 'fixed',
   display: 'flex',
   alignItems: 'center',