💄design: 토스트 동작 시간 3초로 수정

JECT-Study · Sep 25, 2024 · a8c7e82 · a8c7e82
1 parent 23f8b49
commit a8c7e82
Show file tree

Hide file tree

Showing 2 changed files with 3 additions and 3 deletions.
diff --git a/grass-diary/src/state/toast/useToast.ts b/grass-diary/src/state/toast/useToast.ts
@@ -6,7 +6,7 @@ export const useToast = () => {
   const timer = () => {
     setTimeout(() => {
       setActive();
-    }, 5000);
+    }, 3000);
   };
 
   const toast = (text: string) => {

diff --git a/grass-diary/src/styles/component/Notification/Toast.style.tsx b/grass-diary/src/styles/component/Notification/Toast.style.tsx
@@ -14,7 +14,7 @@ export const toastFadeIn = keyframes`
 
 100% {
   opacity: 0;
-  top: 90%;
+  top: 100%;
 }
 `;
 
@@ -41,7 +41,7 @@ export const ToastBox = styled.div<{ $active: boolean; $isRed: boolean }>`
   ${TYPO.label2}
   color: ${semantic.light.inverse.solid.hero};
   text-align: center;
-  animation: ${props => props.$active && toastFadeIn} 4s 1s ease;
+  animation: ${props => props.$active && toastFadeIn} 3s ease;
   transition: 1s;
 
   @media screen and (max-width: 60em) {