From bb08754212c3bf9a015f5450e1f77c0d8fbb468b Mon Sep 17 00:00:00 2001 From: hongjli <3117313295@qq.com> Date: 星期三, 09 四月 2025 14:17:04 +0800 Subject: [PATCH] AI场景页面优化 --- src/app/ai-scene/page.tsx | 36 ++++++++++++++++++++++++++++++------ 1 files changed, 30 insertions(+), 6 deletions(-) diff --git a/src/app/ai-scene/page.tsx b/src/app/ai-scene/page.tsx index 5d0a809..8accf02 100644 --- a/src/app/ai-scene/page.tsx +++ b/src/app/ai-scene/page.tsx @@ -4,6 +4,7 @@ import Card from '@/components/Card'; import ChatDialog from '@/components/ChatDialog'; import SceneIntroDialog from '@/components/SceneIntroDialog'; +import { motion } from 'framer-motion'; const services = [ { @@ -62,14 +63,37 @@ <div className="min-h-screen pt-16"> <div className="flex-1 p-6 md:p-8 bg-gradient-to-b from-[var(--ai-surface)] to-white"> <div className="max-w-7xl mx-auto"> - <div className="mb-8"> - <h1 className="text-3xl font-bold text-[var(--ai-primary)] mb-2"> + <motion.div + className="mb-8" + initial={{ opacity: 0, y: 20 }} + animate={{ opacity: 1, y: 0 }} + transition={{ duration: 0.6, ease: "easeOut" }} + > + <motion.h1 + className="text-3xl font-bold text-[var(--ai-primary)] mb-2" + initial={{ opacity: 0, x: -20 }} + animate={{ opacity: 1, x: 0 }} + transition={{ duration: 0.5, delay: 0.2 }} + > AI鍦烘櫙妯℃嫙 <span className="ml-2 inline-block w-2 h-2 rounded-full bg-[var(--ai-secondary)] animate-pulse"></span> - </h1> - <p className="text-gray-600">閫夋嫨浠ヤ笅鍦烘櫙锛屼綋楠屼汉宸ユ櫤鑳藉浣曡В鍐冲疄闄呬笟鍔¢棶棰�</p> - <div className="h-1 w-24 bg-gradient-to-r from-[var(--ai-secondary)] to-[var(--ai-accent)] mt-4"></div> - </div> + </motion.h1> + <motion.p + className="text-gray-600" + initial={{ opacity: 0, x: -20 }} + animate={{ opacity: 1, x: 0 }} + transition={{ duration: 0.5, delay: 0.3 }} + > + 閫夋嫨浠ヤ笅鍦烘櫙锛屼綋楠屼汉宸ユ櫤鑳藉浣曡В鍐冲疄闄呬笟鍔¢棶棰� + </motion.p> + <motion.div + className="h-1 w-24 bg-gradient-to-r from-[var(--ai-secondary)] to-[var(--ai-accent)]" + initial={{ scaleX: 0, opacity: 0 }} + animate={{ scaleX: 1, opacity: 1 }} + transition={{ duration: 0.6, delay: 0.4 }} + style={{ originX: 0 }} + ></motion.div> + </motion.div> <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6"> {services.map((service, index) => ( <Card -- Gitblit v1.9.3