complete score page - complete transition for pages

src/transition/index.tsx

@@ -0,0 +1,24 @@
+import { PropsWithChildren } from "react"
+import { motion } from "framer-motion"
+
+export const TransitionPages = ({ children }: PropsWithChildren) => {
+    const animations = {
+        initial: {
+            opacity: 0,
+            x: 100
+        },
+        animate: {
+            opacity: 1,
+            x: 0
+        },
+        exit: {
+            opacity: 0,
+            x: -100
+        }
+    }
+    return (
+        <motion.div variants={animations} initial="initial" animate="animate" exit="exit">
+            {children}
+        </motion.div>
+    )
+}