summaryrefslogtreecommitdiff
path: root/src/core/components/layouts/AnimationLayout.jsx
diff options
context:
space:
mode:
authorIT Fixcomart <it@fixcomart.co.id>2023-03-01 09:18:52 +0000
committerIT Fixcomart <it@fixcomart.co.id>2023-03-01 09:18:52 +0000
commita7abbf4ddc70068620e9f44b74dc162ce2e16ee2 (patch)
tree74f66253717515d364ce74bd8275015c1f829cbc /src/core/components/layouts/AnimationLayout.jsx
parent90e1edab9b6a8ccc09a49fed3addbec2cbc4e4c3 (diff)
parenta1b9b647a6c4bda1f5db63879639d44543f9557e (diff)
Merged in refactor (pull request #1)
Refactor
Diffstat (limited to 'src/core/components/layouts/AnimationLayout.jsx')
-rw-r--r--src/core/components/layouts/AnimationLayout.jsx24
1 files changed, 24 insertions, 0 deletions
diff --git a/src/core/components/layouts/AnimationLayout.jsx b/src/core/components/layouts/AnimationLayout.jsx
new file mode 100644
index 00000000..c4dee606
--- /dev/null
+++ b/src/core/components/layouts/AnimationLayout.jsx
@@ -0,0 +1,24 @@
+import { motion } from 'framer-motion'
+
+const AnimationLayout = ({ children, ...props }) => {
+ const transition = {
+ ease: 'easeIn',
+ duration: 0.2
+ }
+
+ return (
+ children && (
+ <motion.main
+ initial={{ opacity: 0, x: 0, y: 0 }}
+ animate={{ opacity: 1, x: 0, y: 0 }}
+ exit={{ opacity: 0, x: 30, y: 0 }}
+ transition={transition}
+ {...props}
+ >
+ {children}
+ </motion.main>
+ )
+ )
+}
+
+export default AnimationLayout