FumeNodes/ox_lib
1
0
Fork 0
mirror of https://github.com/CommunityOx/ox_lib.git synced 2026-08-17 06:56:03 +01:00
Code Issues Packages Projects Releases Wiki Activity

refactor(web/transitions): improve scale fade transition

Browse Source
This commit is contained in:
Luke
2023-01-02 19:33:50 +01:00
parent 9f1ae6184a
commit 7d9e76b043
1 changed files with 3 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
web/src/transitions/ScaleFade.tsx
View File

@@ -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>