fix: add transition delay of welcome card

green-ecolution · Jun 22, 2024 · 505ffd0 · 505ffd0
1 parent 4ea807f
commit 505ffd0
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 1 deletion.
diff --git a/src/tsx/components/cards/WelcomeCard.tsx b/src/tsx/components/cards/WelcomeCard.tsx
@@ -21,7 +21,7 @@ const WelcomeCard: React.FC<WelcomeCardProps> = ({ isVisible, onClose, handleSta
     return (
         <article
             ref={ref}
-            className={`absolute top-1/2 -translate-y-1/2 left-1/2 -translate-x-1/2 transition-opacity duration-500
+            className={`absolute top-1/2 -translate-y-1/2 left-1/2 -translate-x-1/2 transition-opacity ease-in-out duration-500 delay-3000
                 ${isVisible ? 'opacity-100' : 'opacity-0'}`}
         >
             <div className="relativen text-center bg-white shadow-md rounded-2xl p-8 border border-grey-100 w-[44rem]">

diff --git a/tailwind.config.js b/tailwind.config.js
@@ -72,6 +72,9 @@ export default {
         animation: {
             'move': 'move 35s linear infinite',
         },
+        transitionDelay: {
+            '3000': '3000ms',
+        },
         transitionDuration: {
             '1500': '1500ms',
         }