From 1f64caf08db482cd711d7b875c9cb7846f47be4e Mon Sep 17 00:00:00 2001
From: sikkzz <sling0623@gmail.com>
Date: Sat, 22 Feb 2025 00:58:04 +0900
Subject: [PATCH] refactor: test

---
 src/components/ui/Toast/Toast.module.scss | 10 +++++++++-
 src/components/ui/Toast/Toast.stories.tsx |  2 +-
 src/components/ui/Toast/Toaster.tsx       | 11 +++++++----
 3 files changed, 17 insertions(+), 6 deletions(-)

diff --git a/src/components/ui/Toast/Toast.module.scss b/src/components/ui/Toast/Toast.module.scss
index 34c4606..76bd064 100644
--- a/src/components/ui/Toast/Toast.module.scss
+++ b/src/components/ui/Toast/Toast.module.scss
@@ -67,13 +67,14 @@
 .ToastViewport {
   position: fixed;
   left: 50%;
-  top: 0.75rem;
+  bottom: 7rem;
   z-index: 9999;
   width: fit-content;
   display: flex;
   flex-direction: column;
   gap: 0.5rem;
   transform: translateX(-50%);
+  width: calc(100% - 2.5rem);
 }
 
 .Toast {
@@ -115,3 +116,10 @@
     transform: translateY(-10px);
   }
 }
+
+.Toaster {
+  border-radius: 0.75rem;
+  background-color: var(--color-white);
+  width: 100%;
+  padding: 0.875rem 1.125rem;
+}
diff --git a/src/components/ui/Toast/Toast.stories.tsx b/src/components/ui/Toast/Toast.stories.tsx
index 2578950..a83df10 100644
--- a/src/components/ui/Toast/Toast.stories.tsx
+++ b/src/components/ui/Toast/Toast.stories.tsx
@@ -1,4 +1,4 @@
-import Toast from "@/components/ui/Toast/Toast";
+import { Toast } from "@/components/ui/Toast/Toast";
 
 import type { Meta, StoryObj } from "@storybook/react";
 
diff --git a/src/components/ui/Toast/Toaster.tsx b/src/components/ui/Toast/Toaster.tsx
index d6eba95..0a703fd 100644
--- a/src/components/ui/Toast/Toaster.tsx
+++ b/src/components/ui/Toast/Toaster.tsx
@@ -1,4 +1,5 @@
-import { Toast, ToastProvider, ToastTitle, ToastViewport } from "@/components/ui/Toast/Toast";
+import { Toast, ToastProvider, ToastViewport } from "@/components/ui/Toast/Toast";
+import styles from "@/components/ui/Toast/Toast.module.scss";
 
 import { useToast } from "@/hooks/common/useToast";
 
@@ -7,15 +8,17 @@ export function Toaster() {
 
   return (
     <ToastProvider swipeDirection="right">
-      {toasts.map(({ id, title, duration }) => (
+      {toasts.map(({ id, duration }) => (
         <Toast
           key={id}
           open
           duration={duration}
           onOpenChange={(open) => !open && removeToast(id)}
-          className="flex items-center gap-3 rounded-3 bg-white px-3 py-2 shadow-1"
+          // className="flex items-center gap-3 rounded-3 bg-white px-3 py-2 shadow-1"
+          className={styles.Toaster}
         >
-          {title && <ToastTitle className="text-caption-1-bold text-black">{title}</ToastTitle>}
+          링크가 복사되었어요.
+          {/* {title && <ToastTitle className="text-caption-1-bold text-black">{title}</ToastTitle>} */}
         </Toast>
       ))}
       <ToastViewport />