37296b5717
改造概要(30项): - 第一轮:Hero重构/Section差异化/SocialProof强化/CTA对比度/About架构 - 第二轮:字体优化/背景交替/Solutions差异化/Footer五列/MegaDropdown修复 - 第三轮:卡片交互/表单层级/CTA统一/时间线标记/连接线/三列布局/移动导航/Button微交互/SEO Schema - P3-2:template.tsx+Framer Motion页面过渡/loading.tsx加载状态 - 清理:删除未用组件/hooks,修复重复移动导航,清理冗余CSS
51 lines
901 B
TypeScript
51 lines
901 B
TypeScript
'use client';
|
|
|
|
import { motion, type Variants } from 'framer-motion';
|
|
import { useReducedMotion } from '@/hooks/use-reduced-motion';
|
|
|
|
const pageVariants: Variants = {
|
|
initial: {
|
|
opacity: 0,
|
|
y: 8,
|
|
},
|
|
enter: {
|
|
opacity: 1,
|
|
y: 0,
|
|
transition: {
|
|
duration: 0.35,
|
|
ease: [0.16, 1, 0.3, 1] as [number, number, number, number],
|
|
},
|
|
},
|
|
exit: {
|
|
opacity: 0,
|
|
y: -4,
|
|
transition: {
|
|
duration: 0.2,
|
|
ease: [0.16, 1, 0.3, 1] as [number, number, number, number],
|
|
},
|
|
},
|
|
};
|
|
|
|
export default function MarketingTemplate({
|
|
children,
|
|
}: {
|
|
children: React.ReactNode;
|
|
}) {
|
|
const shouldReduceMotion = useReducedMotion();
|
|
|
|
if (shouldReduceMotion) {
|
|
return <>{children}</>;
|
|
}
|
|
|
|
return (
|
|
<motion.div
|
|
initial="initial"
|
|
animate="enter"
|
|
exit="exit"
|
|
variants={pageVariants}
|
|
>
|
|
{children}
|
|
</motion.div>
|
|
);
|
|
}
|