| | |
| | | |
| | | {/* 交互按钮组 - 顶部 */} |
| | | <div className="flex flex-col sm:flex-row items-center justify-center gap-6 mb-20"> |
| | | <a href="/ai-scene"> |
| | | <a |
| | | href="/ai-scene" |
| | | className="no-flash-link" |
| | | onClick={(e) => { |
| | | e.preventDefault(); |
| | | document.body.classList.add('page-transitioning'); |
| | | setTimeout(() => { |
| | | window.location.href = '/ai-scene'; |
| | | }, 100); |
| | | }} |
| | | > |
| | | <motion.div |
| | | custom={0} |
| | | initial="hidden" |
| | |
| | | viewport={{ once: false, margin: "-100px" }} |
| | | variants={buttonVariants} |
| | | whileTap={{ scale: 0.97, transition: { duration: 0.1 } }} |
| | | className="group relative will-change-transform" |
| | | className="group relative will-change-transform cursor-pointer" |
| | | > |
| | | <div className="absolute -inset-0.5 rounded-xl bg-gradient-to-r from-[#6ADBFF] to-[#5E72EB] opacity-30 blur group-hover:opacity-100 group-hover:blur-md transition-all duration-500 group-hover:duration-200 group-active:opacity-70"></div> |
| | | <div className="relative flex items-center gap-2 px-10 py-4 rounded-lg backdrop-blur-sm bg-[#131C41]/90 border border-[#6ADBFF]/30 transition-all duration-300 shadow-[0_0_15px_rgba(106,219,255,0.15)] group-hover:shadow-[0_0_25px_rgba(106,219,255,0.25)] group-active:shadow-[0_0_10px_rgba(106,219,255,0.3)]"> |
| | |
| | | </motion.div> |
| | | </a> |
| | | |
| | | <Link href="/chat"> |
| | | <a |
| | | href="/chat" |
| | | className="no-flash-link" |
| | | onClick={(e) => { |
| | | e.preventDefault(); |
| | | document.body.classList.add('page-transitioning'); |
| | | const token = localStorage.getItem('token'); |
| | | const targetUrl = token ? '/chat' : '/login'; |
| | | setTimeout(() => { |
| | | window.location.href = targetUrl; |
| | | }, 100); |
| | | }} |
| | | > |
| | | <motion.div |
| | | custom={1} |
| | | initial="hidden" |
| | |
| | | viewport={{ once: false, margin: "-100px" }} |
| | | variants={buttonVariants} |
| | | whileTap={{ scale: 0.97, transition: { duration: 0.1 } }} |
| | | className="group relative will-change-transform" |
| | | className="group relative will-change-transform cursor-pointer" |
| | | > |
| | | <div className="absolute -inset-0.5 rounded-xl bg-gradient-to-r from-[#FF6A88] to-[#5E72EB] opacity-30 blur group-hover:opacity-100 group-hover:blur-md transition-all duration-500 group-hover:duration-200 group-active:opacity-70"></div> |
| | | <div className="relative flex items-center gap-2 px-10 py-4 rounded-lg backdrop-blur-sm bg-[#131C41]/90 border border-[#FF6A88]/30 transition-all duration-300 shadow-[0_0_15px_rgba(255,106,136,0.15)] group-hover:shadow-[0_0_25px_rgba(255,106,136,0.25)] group-active:shadow-[0_0_10px_rgba(255,106,136,0.3)]"> |
| | |
| | | </div> |
| | | </div> |
| | | </motion.div> |
| | | </Link> |
| | | </a> |
| | | </div> |
| | | |
| | | {/* AI赋能APS优势全景 - 独立区块 */} |