From 9444a6475139095815049b0a8b785e89b57124b5 Mon Sep 17 00:00:00 2001
From: Jiyoung Jung <72294509+Jungjjeong@users.noreply.github.com>
Date: Mon, 26 Aug 2024 22:32:18 +0900
Subject: [PATCH] =?UTF-8?q?fix:=20toast=20position,=20z=20index=20?=
 =?UTF-8?q?=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 components/atoms/dim/dim.tsx     | 1 +
 components/atoms/toast/toast.tsx | 4 ++--
 2 files changed, 3 insertions(+), 2 deletions(-)

diff --git a/components/atoms/dim/dim.tsx b/components/atoms/dim/dim.tsx
index 72742760..3e755139 100644
--- a/components/atoms/dim/dim.tsx
+++ b/components/atoms/dim/dim.tsx
@@ -12,6 +12,7 @@ type Dim = {
  *   BottomSheet - dim: 500 / container: 550
  *   Modal - dim: 700 / container: 750
  *   Dialog - dim: 800 / container: 850
+ *   Toast - container: 900
  */
 export const Dim = ({ onClick, zIndex = 800 }: Dim) => {
   return (
diff --git a/components/atoms/toast/toast.tsx b/components/atoms/toast/toast.tsx
index 4eccbdd0..e5e21424 100644
--- a/components/atoms/toast/toast.tsx
+++ b/components/atoms/toast/toast.tsx
@@ -59,8 +59,9 @@ const Toast = ({
 };
 
 const containerStyle = css({
-  position: 'relative',
+  position: 'fixed',
   backgroundColor: 'transparent',
+  zIndex: 900,
 });
 
 const toastWrapperStyle = flex({
@@ -71,7 +72,6 @@ const toastWrapperStyle = flex({
   left: '50%',
   transform: 'translateX(-50%)',
   marginBottom: 'calc(35px + env(safe-area-inset-bottom))',
-  zIndex: 200,
 });
 
 const toastStyle = flex({