Your Name 0ec6c00e3f 品牌升级与内容精简优化
品牌定位升级:
- 🎯 产品名称:赋灵犀素材管理系统
- 💡 核心价值:企业素材,本地存储,安全无忧
- 🔐 主打卖点:部署在您的NAS · 数据100%掌控 · 永久免费使用

导航优化(Header):
- 📱 精简导航菜单:从5项减少到3项
  - 系统功能(原功能特性)
  - 版本定价(原定价)
  - 联系购买(原联系我们)
- 🗑️ 移除:技术规格、更新日志
- 🎯 更聚焦核心转化路径

内容精简(Pricing):
- 🗑️ 移除冗余服务说明(技术支持、培训描述等)
- ✨ 优化定制版功能描述(更专业、更清晰)
  - UI界面深度定制
  - 第三方系统集成对接(ERP/CRM/OA)
  - 私有化部署方案设计
  - 长期技术维护服务

代码优化:-26行 +12行,提升页面加载速度
2025-12-13 23:13:26 +08:00

84 lines
4.0 KiB
TypeScript
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

'use client'
import { ArrowRight, Play, Zap, Shield, DollarSign, Sparkles } from 'lucide-react'
export default function Hero() {
return (
<section className="relative min-h-screen flex items-center justify-center overflow-hidden bg-gradient-to-b from-apple-gray-50 to-white">
{/* Background Elements */}
<div className="absolute inset-0 overflow-hidden">
<div className="absolute top-1/4 -left-20 w-96 h-96 bg-apple-blue/10 rounded-full blur-3xl animate-float" />
<div className="absolute bottom-1/4 -right-20 w-96 h-96 bg-purple-500/10 rounded-full blur-3xl animate-float" style={{ animationDelay: '1s' }} />
</div>
<div className="relative z-10 max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 pt-32 pb-20 text-center">
{/* Badge */}
<div className="inline-flex items-center space-x-2 bg-gradient-to-r from-green-500 to-emerald-600 px-6 py-3 rounded-full apple-shadow mb-8 animate-fade-in">
<Sparkles className="w-5 h-5 text-white" />
<span className="text-base text-white font-bold">
永久免费使用
</span>
</div>
{/* Main Heading */}
<h1 className="text-5xl sm:text-6xl lg:text-7xl font-bold text-apple-gray-900 mb-6 animate-slide-up leading-tight">
赋灵犀素材管理系统
<br />
<span className="text-gradient">企业素材,本地存储,安全无忧</span>
</h1>
{/* Description */}
<p className="text-xl sm:text-2xl text-apple-gray-600 max-w-3xl mx-auto mb-12 leading-relaxed animate-slide-up font-medium" style={{ animationDelay: '0.1s' }}>
部署在您的NAS · 数据100%掌控 · 永久免费使用
</p>
{/* CTA Buttons */}
<div className="flex flex-col items-center justify-center gap-6 animate-slide-up mb-16" style={{ animationDelay: '0.2s' }}>
<a
href="http://sc.flnxi.com"
target="_blank"
rel="noopener noreferrer"
className="group px-16 py-6 bg-gradient-to-r from-green-500 to-emerald-600 text-white rounded-full text-2xl font-bold button-hover apple-shadow-lg flex items-center space-x-3 hover:scale-105 transition-all"
>
<span>立即免费使用</span>
<ArrowRight className="w-7 h-7 group-hover:translate-x-2 transition-transform" />
</a>
<a
href="#features"
className="text-apple-gray-600 hover:text-apple-blue font-medium flex items-center space-x-2 group"
>
<span>查看系统功能</span>
<svg className="w-5 h-5 group-hover:translate-x-1 transition-transform" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M19 9l-7 7-7-7" />
</svg>
</a>
</div>
{/* Stats - 简化为3个核心数据 */}
<div className="grid grid-cols-1 sm:grid-cols-3 gap-8 max-w-3xl mx-auto animate-fade-in" style={{ animationDelay: '0.3s' }}>
<div className="text-center">
<div className="text-5xl font-bold text-green-600 mb-2">免费</div>
<div className="text-sm text-apple-gray-600">永久使用</div>
</div>
<div className="text-center">
<div className="text-5xl font-bold text-apple-blue mb-2">10分钟</div>
<div className="text-sm text-apple-gray-600">完成部署</div>
</div>
<div className="text-center">
<div className="text-5xl font-bold text-purple-600 mb-2">100%</div>
<div className="text-sm text-apple-gray-600">数据掌控</div>
</div>
</div>
</div>
{/* Scroll Indicator */}
<div className="absolute bottom-8 left-1/2 -translate-x-1/2 animate-bounce">
<div className="w-6 h-10 border-2 border-apple-gray-300 rounded-full flex items-start justify-center p-2">
<div className="w-1.5 h-3 bg-apple-gray-400 rounded-full" />
</div>
</div>
</section>
)
}