52 lines
1.1 KiB
TypeScript
52 lines
1.1 KiB
TypeScript
import type { Variants } from 'framer-motion'
|
|
|
|
export const fadeUp: Variants = {
|
|
hidden: { opacity: 0, y: 28 },
|
|
visible: {
|
|
opacity: 1,
|
|
y: 0,
|
|
transition: { duration: 0.6, ease: [0.25, 0.46, 0.45, 0.94] },
|
|
},
|
|
}
|
|
|
|
export const fadeIn: Variants = {
|
|
hidden: { opacity: 0 },
|
|
visible: { opacity: 1, transition: { duration: 0.5 } },
|
|
}
|
|
|
|
export const staggerContainer: Variants = {
|
|
hidden: {},
|
|
visible: {
|
|
transition: { staggerChildren: 0.08, delayChildren: 0.1 },
|
|
},
|
|
}
|
|
|
|
export const scaleUp: Variants = {
|
|
hidden: { opacity: 0, scale: 0.92 },
|
|
visible: {
|
|
opacity: 1,
|
|
scale: 1,
|
|
transition: { duration: 0.5, ease: [0.25, 0.46, 0.45, 0.94] },
|
|
},
|
|
}
|
|
|
|
export const slideLeft: Variants = {
|
|
hidden: { opacity: 0, x: 40 },
|
|
visible: {
|
|
opacity: 1,
|
|
x: 0,
|
|
transition: { duration: 0.6, ease: [0.25, 0.46, 0.45, 0.94] },
|
|
},
|
|
}
|
|
|
|
export const slideRight: Variants = {
|
|
hidden: { opacity: 0, x: -40 },
|
|
visible: {
|
|
opacity: 1,
|
|
x: 0,
|
|
transition: { duration: 0.6, ease: [0.25, 0.46, 0.45, 0.94] },
|
|
},
|
|
}
|
|
|
|
export const viewportConfig = { once: true, margin: '-80px' } as const
|