From 7d9e76b043f48025718a970e7897394910ba7f96 Mon Sep 17 00:00:00 2001
From: Luke <sabolukas03@gmail.com>
Date: Mon, 2 Jan 2023 19:33:50 +0100
Subject: [PATCH] refactor(web/transitions): improve scale fade transition

---
 web/src/transitions/ScaleFade.tsx | 7 +++----
 1 file changed, 3 insertions(+), 4 deletions(-)

diff --git a/web/src/transitions/ScaleFade.tsx b/web/src/transitions/ScaleFade.tsx
index 000f8e7..ae0d0fc 100644
--- a/web/src/transitions/ScaleFade.tsx
+++ b/web/src/transitions/ScaleFade.tsx
@@ -3,13 +3,12 @@ import { AnimatePresence, motion } from 'framer-motion';
 const ScaleFade: React.FC<{ visible: boolean; children: React.ReactNode }> = ({ visible, children }) => {
   return (
     <>
-      <AnimatePresence initial={false}>
+      <AnimatePresence>
         {visible && (
           <motion.div
             initial={{ opacity: 0, scale: 0.95 }}
-            animate={{ opacity: 1, scale: 1 }}
-            exit={{ opacity: 0, scale: 0.95 }}
-            transition={{ duration: 0.1 }}
+            animate={{ opacity: 1, scale: 1, transition: { duration: 0.2, ease: [0.4, 0, 1, 1] } }}
+            exit={{ opacity: 0, scale: 0.95, transition: { duration: 0.1, ease: [0, 0, 0.2, 1] } }}
           >
             {children}
           </motion.div>