new

frontend/src/animation.js

@@ -0,0 +1,35 @@
+export const fadeInUp = {
+  initial: { opacity: 0, y: 30 },
+  animate: { opacity: 1, y: 0, transition: { duration: 0.6, ease: "easeOut" } },
+  exit: { opacity: 0, y: 20, transition: { duration: 0.4 } }
+};
+
+export const staggerContainer = {
+  hidden: { opacity: 0 },
+  show: {
+    opacity: 1,
+    transition: {
+      staggerChildren: 0.08
+    }
+  }
+};
+
+export const cardHover = {
+  hover: {
+    scale: 1.03,
+    boxShadow: "0 20px 40px rgba(0,0,0,0.4)",
+    y: -5,
+    transition: { duration: 0.3, ease: "easeOut" }
+  }
+};
+
+export const buttonClick = {
+  tap: { scale: 0.95 }
+};
+
+export const pageTransition = {
+  initial: { opacity: 0 },
+  animate: { opacity: 1 },
+  exit: { opacity: 0 },
+  transition: { duration: 0.4 }
+};