feat: 优化会展策划网站UI和添加Duoduo Agent设计流程展示
主要更新: - 统一所有页面导航栏样式为glass-morphism风格 - 添加Duoduo Agent智能设计系统完整可视化流程 - 展示从CAD到展位概念的5个设计阶段 - 优化页面交互效果和用户体验 详细修改: - web_frontend/web_result/pages/: 统一6个页面导航栏样式 - operation.html: 新增Duoduo Agent设计流程展示模块 - 添加5张设计阶段图片展示 (CAD/概念/白模/渲染/最终方案) - 增强视觉效果和动画交互 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
Yep_Q
@@ -260,37 +260,37 @@
|
||||
<div class="container mx-auto px-6 relative z-10" title="核心数据展示区">
|
||||
<div class="grid grid-cols-2 md:grid-cols-4 gap-8 md:gap-12">
|
||||
<div class="text-center group animate-fadeInUp animation-delay-200 transform hover:scale-105 transition-all duration-300">
|
||||
<div class="w-24 h-24 mx-auto mb-4 bg-gradient-to-br from-purple-500 to-purple-600 rounded-2xl flex items-center justify-center shadow-2xl group-hover:shadow-purple-500/30 group-hover:rotate-3 transition-all">
|
||||
<i class="fas fa-building text-4xl text-white"></i>
|
||||
<div class="w-24 h-24 mx-auto mb-4 bg-white rounded-2xl flex items-center justify-center shadow-lg group-hover:shadow-xl border-2 border-purple-200 group-hover:border-purple-400 group-hover:rotate-3 transition-all">
|
||||
<i class="fas fa-building text-4xl text-purple-600"></i>
|
||||
</div>
|
||||
<div class="text-5xl font-bold text-transparent bg-clip-text bg-gradient-to-r from-purple-600 to-pink-600 mb-2">
|
||||
<div class="text-5xl font-bold text-gray-800 mb-2">
|
||||
<span class="counter" data-target="350">0</span>+
|
||||
</div>
|
||||
<div class="text-gray-700 font-semibold text-lg">参展企业</div>
|
||||
</div>
|
||||
<div class="text-center group animate-fadeInUp animation-delay-400 transform hover:scale-105 transition-all duration-300">
|
||||
<div class="w-24 h-24 mx-auto mb-4 bg-gradient-to-br from-blue-500 to-blue-600 rounded-2xl flex items-center justify-center shadow-2xl group-hover:shadow-blue-500/30 group-hover:-rotate-3 transition-all">
|
||||
<i class="fas fa-users text-4xl text-white"></i>
|
||||
<div class="w-24 h-24 mx-auto mb-4 bg-white rounded-2xl flex items-center justify-center shadow-lg group-hover:shadow-xl border-2 border-blue-200 group-hover:border-blue-400 group-hover:-rotate-3 transition-all">
|
||||
<i class="fas fa-users text-4xl text-blue-600"></i>
|
||||
</div>
|
||||
<div class="text-5xl font-bold text-transparent bg-clip-text bg-gradient-to-r from-blue-600 to-cyan-600 mb-2">
|
||||
<div class="text-5xl font-bold text-gray-800 mb-2">
|
||||
<span class="counter" data-target="50000">0</span>+
|
||||
</div>
|
||||
<div class="text-gray-700 font-semibold text-lg">预计观众</div>
|
||||
</div>
|
||||
<div class="text-center group animate-fadeInUp animation-delay-600 transform hover:scale-105 transition-all duration-300">
|
||||
<div class="w-24 h-24 mx-auto mb-4 bg-gradient-to-br from-green-500 to-green-600 rounded-2xl flex items-center justify-center shadow-2xl group-hover:shadow-green-500/30 group-hover:rotate-3 transition-all">
|
||||
<i class="fas fa-hand-holding-usd text-4xl text-white"></i>
|
||||
<div class="w-24 h-24 mx-auto mb-4 bg-white rounded-2xl flex items-center justify-center shadow-lg group-hover:shadow-xl border-2 border-green-200 group-hover:border-green-400 group-hover:rotate-3 transition-all">
|
||||
<i class="fas fa-hand-holding-usd text-4xl text-green-600"></i>
|
||||
</div>
|
||||
<div class="text-5xl font-bold text-transparent bg-clip-text bg-gradient-to-r from-green-600 to-emerald-600 mb-2">
|
||||
<div class="text-5xl font-bold text-gray-800 mb-2">
|
||||
<span class="counter" data-target="10">0</span>亿+
|
||||
</div>
|
||||
<div class="text-gray-700 font-semibold text-lg">预计成交额</div>
|
||||
</div>
|
||||
<div class="text-center group animate-fadeInUp animation-delay-800 transform hover:scale-105 transition-all duration-300">
|
||||
<div class="w-24 h-24 mx-auto mb-4 bg-gradient-to-br from-orange-500 to-orange-600 rounded-2xl flex items-center justify-center shadow-2xl group-hover:shadow-orange-500/30 group-hover:-rotate-3 transition-all">
|
||||
<i class="fas fa-microphone-alt text-4xl text-white"></i>
|
||||
<div class="w-24 h-24 mx-auto mb-4 bg-white rounded-2xl flex items-center justify-center shadow-lg group-hover:shadow-xl border-2 border-orange-200 group-hover:border-orange-400 group-hover:-rotate-3 transition-all">
|
||||
<i class="fas fa-microphone-alt text-4xl text-orange-600"></i>
|
||||
</div>
|
||||
<div class="text-5xl font-bold text-transparent bg-clip-text bg-gradient-to-r from-orange-600 to-red-600 mb-2">
|
||||
<div class="text-5xl font-bold text-gray-800 mb-2">
|
||||
<span class="counter" data-target="20">0</span>+
|
||||
</div>
|
||||
<div class="text-gray-700 font-semibold text-lg">专业论坛</div>
|
||||
@@ -316,61 +316,58 @@
|
||||
<h2 class="text-3xl md:text-4xl font-bold text-center text-gray-800 mb-12 animate-fadeInUp">展会亮点</h2>
|
||||
<div class="grid grid-cols-1 md:grid-cols-3 gap-8">
|
||||
<!-- Card 1 -->
|
||||
<div class="card-hover bg-white/90 backdrop-blur rounded-xl shadow-xl overflow-hidden group animate-fadeInUp animation-delay-200">
|
||||
<div class="bg-white rounded-xl shadow-lg overflow-hidden transform transition-all duration-300 hover:scale-105 hover:shadow-2xl animate-fadeInUp animation-delay-200">
|
||||
<div class="h-48 relative overflow-hidden">
|
||||
<img src="../data/会展策划/image/3.小米汽车.jpg" alt="小米汽车" class="w-full h-full object-cover transform transition-transform duration-700 group-hover:scale-110">
|
||||
<div class="absolute inset-0 bg-gradient-to-t from-black/60 to-transparent"></div>
|
||||
<div class="absolute bottom-4 left-4 text-white">
|
||||
<div class="bg-blue-500 px-3 py-1 rounded-full text-xs font-semibold inline-block mb-2">热门展区</div>
|
||||
<img src="../data/会展策划/image/3.小米汽车.jpg" alt="小米汽车" class="w-full h-full object-cover">
|
||||
<div class="absolute top-4 left-4">
|
||||
<div class="bg-blue-500 text-white px-3 py-1 rounded-full text-xs font-semibold">热门展区</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="p-6">
|
||||
<h3 class="text-xl font-bold mb-3 group-hover:text-purple-600 transition-colors">全产业链展示</h3>
|
||||
<h3 class="text-xl font-bold mb-3 text-gray-800">全产业链展示</h3>
|
||||
<p class="text-gray-600 mb-4">
|
||||
涵盖整车制造、核心零部件、充电设施、智能网联等全产业链环节，打造一站式采购平台。
|
||||
</p>
|
||||
<a href="pages/exhibition.html" class="text-purple-600 font-semibold hover:text-purple-800 flex items-center group/link">
|
||||
了解更多 <i class="fas fa-arrow-right ml-2 transform transition-transform group-hover/link:translate-x-2"></i>
|
||||
<a href="pages/exhibition.html" class="text-purple-600 font-semibold hover:text-purple-800 flex items-center group">
|
||||
了解更多 <i class="fas fa-arrow-right ml-2 transform transition-transform group-hover:translate-x-2"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Card 2 -->
|
||||
<div class="card-hover bg-white/90 backdrop-blur rounded-xl shadow-xl overflow-hidden group animate-fadeInUp animation-delay-400">
|
||||
<div class="bg-white rounded-xl shadow-lg overflow-hidden transform transition-all duration-300 hover:scale-105 hover:shadow-2xl animate-fadeInUp animation-delay-400">
|
||||
<div class="h-48 relative overflow-hidden">
|
||||
<img src="../data/会展策划/image/2.试驾小景.jpg" alt="试驾体验" class="w-full h-full object-cover transform transition-transform duration-700 group-hover:scale-110">
|
||||
<div class="absolute inset-0 bg-gradient-to-t from-black/60 to-transparent"></div>
|
||||
<div class="absolute bottom-4 left-4 text-white">
|
||||
<div class="bg-emerald-500 px-3 py-1 rounded-full text-xs font-semibold inline-block mb-2">互动体验</div>
|
||||
<img src="../data/会展策划/image/2.试驾小景.jpg" alt="试驾体验" class="w-full h-full object-cover">
|
||||
<div class="absolute top-4 left-4">
|
||||
<div class="bg-emerald-500 text-white px-3 py-1 rounded-full text-xs font-semibold">互动体验</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="p-6">
|
||||
<h3 class="text-xl font-bold mb-3 group-hover:text-emerald-600 transition-colors">创新技术体验</h3>
|
||||
<h3 class="text-xl font-bold mb-3 text-gray-800">创新技术体验</h3>
|
||||
<p class="text-gray-600 mb-4">
|
||||
设置自动驾驶体验区、智能交通演示区，让观众亲身体验最新科技成果。
|
||||
</p>
|
||||
<a href="pages/operation.html" class="text-emerald-600 font-semibold hover:text-emerald-800 flex items-center group/link">
|
||||
了解更多 <i class="fas fa-arrow-right ml-2 transform transition-transform group-hover/link:translate-x-2"></i>
|
||||
<a href="pages/operation.html" class="text-emerald-600 font-semibold hover:text-emerald-800 flex items-center group">
|
||||
了解更多 <i class="fas fa-arrow-right ml-2 transform transition-transform group-hover:translate-x-2"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Card 3 -->
|
||||
<div class="card-hover bg-white/90 backdrop-blur rounded-xl shadow-xl overflow-hidden group animate-fadeInUp animation-delay-600">
|
||||
<div class="bg-white rounded-xl shadow-lg overflow-hidden transform transition-all duration-300 hover:scale-105 hover:shadow-2xl animate-fadeInUp animation-delay-600">
|
||||
<div class="h-48 relative overflow-hidden">
|
||||
<img src="../data/会展策划/image/展会内部参观.jpg" alt="论坛峰会" class="w-full h-full object-cover transform transition-transform duration-700 group-hover:scale-110">
|
||||
<div class="absolute inset-0 bg-gradient-to-t from-black/60 to-transparent"></div>
|
||||
<div class="absolute bottom-4 left-4 text-white">
|
||||
<div class="bg-purple-500 px-3 py-1 rounded-full text-xs font-semibold inline-block mb-2">主题论坛</div>
|
||||
<img src="../data/会展策划/image/展会内部参观.jpg" alt="论坛峰会" class="w-full h-full object-cover">
|
||||
<div class="absolute top-4 left-4">
|
||||
<div class="bg-purple-500 text-white px-3 py-1 rounded-full text-xs font-semibold">主题论坛</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="p-6">
|
||||
<h3 class="text-xl font-bold mb-3 group-hover:text-purple-600 transition-colors">高端论坛峰会</h3>
|
||||
<h3 class="text-xl font-bold mb-3 text-gray-800">高端论坛峰会</h3>
|
||||
<p class="text-gray-600 mb-4">
|
||||
汇聚行业领袖、专家学者，探讨产业发展趋势，发布权威研究报告。
|
||||
</p>
|
||||
<a href="pages/marketing.html" class="text-purple-600 font-semibold hover:text-purple-800 flex items-center group/link">
|
||||
了解更多 <i class="fas fa-arrow-right ml-2 transform transition-transform group-hover/link:translate-x-2"></i>
|
||||
<a href="pages/marketing.html" class="text-purple-600 font-semibold hover:text-purple-800 flex items-center group">
|
||||
了解更多 <i class="fas fa-arrow-right ml-2 transform transition-transform group-hover:translate-x-2"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
@@ -456,8 +453,8 @@
|
||||
<div class="grid md:grid-cols-3 gap-6 mb-8">
|
||||
<div class="group relative overflow-hidden rounded-2xl shadow-2xl animate-fadeInUp animation-delay-200">
|
||||
<img src="../data/会展策划/image/展会内部参观.jpg" alt="展会内部" class="w-full h-64 object-cover transform transition-transform duration-700 group-hover:scale-110">
|
||||
<div class="absolute inset-0 bg-gradient-to-t from-black/70 to-transparent opacity-0 group-hover:opacity-100 transition-opacity duration-300">
|
||||
<div class="absolute bottom-0 left-0 right-0 p-6 text-white transform translate-y-full group-hover:translate-y-0 transition-transform duration-300">
|
||||
<div class="absolute inset-0 bg-gradient-to-t from-black/70 to-transparent opacity-0 group-hover:opacity-100 transition-opacity duration-300 flex items-end">
|
||||
<div class="p-6 text-white transform translate-y-20 group-hover:translate-y-0 transition-transform duration-300">
|
||||
<h3 class="text-xl font-bold mb-2">展馆内部参观</h3>
|
||||
<p class="text-sm">宽敞明亮的展示空间，科技感十足</p>
|
||||
</div>
|
||||
@@ -466,8 +463,8 @@
|
||||
|
||||
<div class="group relative overflow-hidden rounded-2xl shadow-2xl animate-fadeInUp animation-delay-400">
|
||||
<img src="../data/会展策划/image/签到.jpg" alt="签到处" class="w-full h-64 object-cover transform transition-transform duration-700 group-hover:scale-110">
|
||||
<div class="absolute inset-0 bg-gradient-to-t from-black/70 to-transparent opacity-0 group-hover:opacity-100 transition-opacity duration-300">
|
||||
<div class="absolute bottom-0 left-0 right-0 p-6 text-white transform translate-y-full group-hover:translate-y-0 transition-transform duration-300">
|
||||
<div class="absolute inset-0 bg-gradient-to-t from-black/70 to-transparent opacity-0 group-hover:opacity-100 transition-opacity duration-300 flex items-end">
|
||||
<div class="p-6 text-white transform translate-y-20 group-hover:translate-y-0 transition-transform duration-300">
|
||||
<h3 class="text-xl font-bold mb-2">智能签到系统</h3>
|
||||
<p class="text-sm">快速便捷的入场体验</p>
|
||||
</div>
|
||||
@@ -476,8 +473,8 @@
|
||||
|
||||
<div class="group relative overflow-hidden rounded-2xl shadow-2xl animate-fadeInUp animation-delay-600">
|
||||
<img src="../data/会展策划/image/3.小米汽车.jpg" alt="展品展示" class="w-full h-64 object-cover transform transition-transform duration-700 group-hover:scale-110">
|
||||
<div class="absolute inset-0 bg-gradient-to-t from-black/70 to-transparent opacity-0 group-hover:opacity-100 transition-opacity duration-300">
|
||||
<div class="absolute bottom-0 left-0 right-0 p-6 text-white transform translate-y-full group-hover:translate-y-0 transition-transform duration-300">
|
||||
<div class="absolute inset-0 bg-gradient-to-t from-black/70 to-transparent opacity-0 group-hover:opacity-100 transition-opacity duration-300 flex items-end">
|
||||
<div class="p-6 text-white transform translate-y-20 group-hover:translate-y-0 transition-transform duration-300">
|
||||
<h3 class="text-xl font-bold mb-2">明星展品</h3>
|
||||
<p class="text-sm">最新款新能源汽车亮相</p>
|
||||
</div>
|
||||
@@ -489,19 +486,35 @@
|
||||
<div class="grid md:grid-cols-4 gap-4">
|
||||
<div class="group relative overflow-hidden rounded-xl shadow-xl animate-fadeInUp animation-delay-800">
|
||||
<img src="../data/会展策划/image/Whisk_03282ab7e5.jpg" alt="展品1" class="w-full h-48 object-cover transform transition-all duration-500 group-hover:scale-110 group-hover:rotate-1">
|
||||
<div class="absolute inset-0 bg-gradient-to-t from-purple-600/50 to-transparent opacity-0 group-hover:opacity-100 transition-opacity duration-300"></div>
|
||||
<div class="absolute inset-0 bg-gradient-to-t from-purple-600/70 to-transparent opacity-0 group-hover:opacity-100 transition-opacity duration-300 flex items-end">
|
||||
<div class="p-4 text-white transform translate-y-10 group-hover:translate-y-0 transition-transform duration-300">
|
||||
<h4 class="text-sm font-bold">智能驾驶展示</h4>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="group relative overflow-hidden rounded-xl shadow-xl animate-fadeInUp animation-delay-900">
|
||||
<img src="../data/会展策划/image/Whisk_15f65339bb.jpg" alt="展品2" class="w-full h-48 object-cover transform transition-all duration-500 group-hover:scale-110 group-hover:rotate-1">
|
||||
<div class="absolute inset-0 bg-gradient-to-t from-indigo-600/50 to-transparent opacity-0 group-hover:opacity-100 transition-opacity duration-300"></div>
|
||||
<div class="absolute inset-0 bg-gradient-to-t from-indigo-600/70 to-transparent opacity-0 group-hover:opacity-100 transition-opacity duration-300 flex items-end">
|
||||
<div class="p-4 text-white transform translate-y-10 group-hover:translate-y-0 transition-transform duration-300">
|
||||
<h4 class="text-sm font-bold">充电技术革新</h4>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="group relative overflow-hidden rounded-xl shadow-xl animate-fadeInUp animation-delay-1000">
|
||||
<img src="../data/会展策划/image/Whisk_192cdc54bc.jpg" alt="展品3" class="w-full h-48 object-cover transform transition-all duration-500 group-hover:scale-110 group-hover:rotate-1">
|
||||
<div class="absolute inset-0 bg-gradient-to-t from-blue-600/50 to-transparent opacity-0 group-hover:opacity-100 transition-opacity duration-300"></div>
|
||||
<div class="absolute inset-0 bg-gradient-to-t from-blue-600/70 to-transparent opacity-0 group-hover:opacity-100 transition-opacity duration-300 flex items-end">
|
||||
<div class="p-4 text-white transform translate-y-10 group-hover:translate-y-0 transition-transform duration-300">
|
||||
<h4 class="text-sm font-bold">电池技术展览</h4>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="group relative overflow-hidden rounded-xl shadow-xl animate-fadeInUp animation-delay-1100">
|
||||
<img src="../data/会展策划/image/Whisk_1c05424f7f.jpg" alt="展品4" class="w-full h-48 object-cover transform transition-all duration-500 group-hover:scale-110 group-hover:rotate-1">
|
||||
<div class="absolute inset-0 bg-gradient-to-t from-cyan-600/50 to-transparent opacity-0 group-hover:opacity-100 transition-opacity duration-300"></div>
|
||||
<div class="absolute inset-0 bg-gradient-to-t from-cyan-600/70 to-transparent opacity-0 group-hover:opacity-100 transition-opacity duration-300 flex items-end">
|
||||
<div class="p-4 text-white transform translate-y-10 group-hover:translate-y-0 transition-transform duration-300">
|
||||
<h4 class="text-sm font-bold">智慧交通系统</h4>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
@@ -19,6 +19,13 @@
|
||||
font-family: 'Inter', 'Noto Sans SC', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
|
||||
}
|
||||
|
||||
/* Glass morphism effect */
|
||||
.glass-morphism {
|
||||
background: rgba(255, 255, 255, 0.9);
|
||||
backdrop-filter: blur(10px);
|
||||
-webkit-backdrop-filter: blur(10px);
|
||||
}
|
||||
|
||||
/* 页面加载动画 */
|
||||
.page-enter {
|
||||
animation: pageEnter 0.8s ease-out;
|
||||
@@ -106,39 +113,44 @@
|
||||
</head>
|
||||
<body class="bg-gray-50">
|
||||
<!-- Navigation -->
|
||||
<nav class="fixed top-0 w-full bg-white shadow-md z-50">
|
||||
<nav class="fixed top-0 w-full glass-morphism shadow-md z-50 transition-all duration-300">
|
||||
<div class="container mx-auto px-6 py-4">
|
||||
<div class="flex items-center justify-between">
|
||||
<div class="flex items-center group">
|
||||
<div class="relative mr-3">
|
||||
<i class="fas fa-car-side text-2xl text-purple-600 group-hover:scale-110 transition-transform"></i>
|
||||
<i class="fas fa-bolt text-xs text-green-500 absolute -top-1 -right-1 animate-pulse"></i>
|
||||
<div class="flex items-center">
|
||||
<div class="w-10 h-10 bg-gradient-to-br from-emerald-400 to-blue-500 rounded-lg flex items-center justify-center mr-3">
|
||||
<i class="fas fa-charging-station text-white"></i>
|
||||
</div>
|
||||
<div>
|
||||
<h1 class="text-lg font-bold">NEVIT 2024</h1>
|
||||
<p class="text-xs text-gray-500">新能源汽车产业博览会</p>
|
||||
</div>
|
||||
<span class="text-xl font-bold text-gray-800">Green Mobility 2024</span>
|
||||
</div>
|
||||
<div class="hidden md:flex space-x-8">
|
||||
<a href="../index.html" class="nav-link text-gray-700 hover:text-purple-600">
|
||||
<i class="fas fa-home mr-1"></i>首页
|
||||
<a href="../index.html" class="text-gray-700 hover:text-emerald-500 transition-colors">
|
||||
<i class="fas fa-home mr-2"></i>首页
|
||||
</a>
|
||||
<a href="overview.html" class="nav-link text-gray-700 hover:text-purple-600">
|
||||
<i class="fas fa-file-alt mr-1"></i>策划概述
|
||||
<a href="overview.html" class="text-gray-700 hover:text-emerald-500 transition-colors">
|
||||
<i class="fas fa-info-circle mr-2"></i>展会概览
|
||||
</a>
|
||||
<a href="exhibition.html" class="nav-link active text-purple-600 font-semibold">
|
||||
<i class="fas fa-building mr-1"></i>展会介绍
|
||||
<a href="exhibition.html" class="nav-link active text-gray-700 hover:text-emerald-500 transition-colors">
|
||||
<i class="fas fa-th-large mr-2"></i>展览内容
|
||||
</a>
|
||||
<a href="marketing.html" class="nav-link text-gray-700 hover:text-purple-600">
|
||||
<i class="fas fa-bullhorn mr-1"></i>营销方案
|
||||
<a href="marketing.html" class="nav-link text-gray-700 hover:text-emerald-500 transition-colors">
|
||||
<i class="fas fa-bullhorn mr-2"></i>营销推广
|
||||
</a>
|
||||
<a href="operation.html" class="nav-link text-gray-700 hover:text-purple-600">
|
||||
<i class="fas fa-cogs mr-1"></i>现场运营
|
||||
<a href="operation.html" class="nav-link text-gray-700 hover:text-emerald-500 transition-colors">
|
||||
<i class="fas fa-cogs mr-2"></i>运营服务
|
||||
</a>
|
||||
<a href="budget.html" class="nav-link text-gray-700 hover:text-purple-600">
|
||||
<i class="fas fa-calculator mr-1"></i>预算分析
|
||||
<a href="budget.html" class="nav-link text-gray-700 hover:text-emerald-500 transition-colors">
|
||||
<i class="fas fa-chart-pie mr-2"></i>预算分析
|
||||
</a>
|
||||
<a href="risk.html" class="nav-link text-gray-700 hover:text-purple-600">
|
||||
<i class="fas fa-shield-alt mr-1"></i>风险评估
|
||||
<a href="risk.html" class="text-gray-700 hover:text-emerald-500 transition-colors">
|
||||
<i class="fas fa-shield-alt mr-2"></i>风险评估
|
||||
</a>
|
||||
</div>
|
||||
<button class="md:hidden text-gray-700">
|
||||
<i class="fas fa-bars text-2xl"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
@@ -19,6 +19,13 @@
|
||||
font-family: 'Inter', 'Noto Sans SC', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
|
||||
}
|
||||
|
||||
/* Glass morphism effect */
|
||||
.glass-morphism {
|
||||
background: rgba(255, 255, 255, 0.9);
|
||||
backdrop-filter: blur(10px);
|
||||
-webkit-backdrop-filter: blur(10px);
|
||||
}
|
||||
|
||||
/* 玻璃态效果 */
|
||||
.glass-card {
|
||||
background: rgba(255, 255, 255, 0.9);
|
||||
@@ -109,39 +116,44 @@
|
||||
</head>
|
||||
<body class="bg-gray-50">
|
||||
<!-- Navigation -->
|
||||
<nav class="fixed top-0 w-full bg-white shadow-md z-50">
|
||||
<nav class="fixed top-0 w-full glass-morphism shadow-md z-50 transition-all duration-300">
|
||||
<div class="container mx-auto px-6 py-4">
|
||||
<div class="flex items-center justify-between">
|
||||
<div class="flex items-center group">
|
||||
<div class="relative mr-3">
|
||||
<i class="fas fa-car-side text-2xl text-purple-600 group-hover:scale-110 transition-transform"></i>
|
||||
<i class="fas fa-bolt text-xs text-green-500 absolute -top-1 -right-1 animate-pulse"></i>
|
||||
<div class="flex items-center">
|
||||
<div class="w-10 h-10 bg-gradient-to-br from-emerald-400 to-blue-500 rounded-lg flex items-center justify-center mr-3">
|
||||
<i class="fas fa-charging-station text-white"></i>
|
||||
</div>
|
||||
<div>
|
||||
<h1 class="text-lg font-bold">NEVIT 2024</h1>
|
||||
<p class="text-xs text-gray-500">新能源汽车产业博览会</p>
|
||||
</div>
|
||||
<span class="text-xl font-bold text-gray-800">Green Mobility 2024</span>
|
||||
</div>
|
||||
<div class="hidden md:flex space-x-8">
|
||||
<a href="../index.html" class="nav-link text-gray-700 hover:text-purple-600">
|
||||
<i class="fas fa-home mr-1"></i>首页
|
||||
<a href="../index.html" class="text-gray-700 hover:text-emerald-500 transition-colors">
|
||||
<i class="fas fa-home mr-2"></i>首页
|
||||
</a>
|
||||
<a href="overview.html" class="nav-link text-gray-700 hover:text-purple-600">
|
||||
<i class="fas fa-file-alt mr-1"></i>策划概述
|
||||
<a href="overview.html" class="text-gray-700 hover:text-emerald-500 transition-colors">
|
||||
<i class="fas fa-info-circle mr-2"></i>展会概览
|
||||
</a>
|
||||
<a href="exhibition.html" class="nav-link text-gray-700 hover:text-purple-600">
|
||||
<i class="fas fa-building mr-1"></i>展会介绍
|
||||
<a href="exhibition.html" class="nav-link text-gray-700 hover:text-emerald-500 transition-colors">
|
||||
<i class="fas fa-th-large mr-2"></i>展览内容
|
||||
</a>
|
||||
<a href="marketing.html" class="nav-link active text-purple-600 font-semibold">
|
||||
<i class="fas fa-bullhorn mr-1"></i>营销方案
|
||||
<a href="marketing.html" class="nav-link active text-gray-700 hover:text-emerald-500 transition-colors">
|
||||
<i class="fas fa-bullhorn mr-2"></i>营销推广
|
||||
</a>
|
||||
<a href="operation.html" class="nav-link text-gray-700 hover:text-purple-600">
|
||||
<i class="fas fa-cogs mr-1"></i>现场运营
|
||||
<a href="operation.html" class="nav-link text-gray-700 hover:text-emerald-500 transition-colors">
|
||||
<i class="fas fa-cogs mr-2"></i>运营服务
|
||||
</a>
|
||||
<a href="budget.html" class="nav-link text-gray-700 hover:text-purple-600">
|
||||
<i class="fas fa-calculator mr-1"></i>预算分析
|
||||
<a href="budget.html" class="nav-link text-gray-700 hover:text-emerald-500 transition-colors">
|
||||
<i class="fas fa-chart-pie mr-2"></i>预算分析
|
||||
</a>
|
||||
<a href="risk.html" class="nav-link text-gray-700 hover:text-purple-600">
|
||||
<i class="fas fa-shield-alt mr-1"></i>风险评估
|
||||
<a href="risk.html" class="text-gray-700 hover:text-emerald-500 transition-colors">
|
||||
<i class="fas fa-shield-alt mr-2"></i>风险评估
|
||||
</a>
|
||||
</div>
|
||||
<button class="md:hidden text-gray-700">
|
||||
<i class="fas fa-bars text-2xl"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
@@ -13,6 +13,14 @@
|
||||
* {
|
||||
font-family: 'Inter', 'Noto Sans SC', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
|
||||
}
|
||||
|
||||
/* Glass morphism effect */
|
||||
.glass-morphism {
|
||||
background: rgba(255, 255, 255, 0.9);
|
||||
backdrop-filter: blur(10px);
|
||||
-webkit-backdrop-filter: blur(10px);
|
||||
}
|
||||
|
||||
.timeline-item {
|
||||
position: relative;
|
||||
padding-left: 40px;
|
||||
@@ -78,8 +86,8 @@
|
||||
<nav class="fixed top-0 w-full glass-morphism shadow-md z-50 transition-all duration-300">
|
||||
<div class="container mx-auto px-6 py-4">
|
||||
<div class="flex items-center justify-between">
|
||||
<div class="flex items-center animate-fadeInLeft">
|
||||
<div class="w-10 h-10 bg-gradient-to-br from-purple-500 to-indigo-600 rounded-lg flex items-center justify-center mr-3">
|
||||
<div class="flex items-center">
|
||||
<div class="w-10 h-10 bg-gradient-to-br from-emerald-400 to-blue-500 rounded-lg flex items-center justify-center mr-3">
|
||||
<i class="fas fa-charging-station text-white"></i>
|
||||
</div>
|
||||
<div>
|
||||
@@ -88,28 +96,31 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="hidden md:flex space-x-8">
|
||||
<a href="../index.html" class="nav-link text-gray-700 hover:text-purple-600 transition-colors">
|
||||
<a href="../index.html" class="text-gray-700 hover:text-emerald-500 transition-colors">
|
||||
<i class="fas fa-home mr-2"></i>首页
|
||||
</a>
|
||||
<a href="overview.html" class="nav-link active text-purple-600 font-semibold">
|
||||
<i class="fas fa-info-circle mr-2"></i>策划概述
|
||||
<a href="overview.html" class="nav-link active text-gray-700 hover:text-emerald-500 transition-colors">
|
||||
<i class="fas fa-info-circle mr-2"></i>展会概览
|
||||
</a>
|
||||
<a href="exhibition.html" class="nav-link text-gray-700 hover:text-purple-600 transition-colors">
|
||||
<i class="fas fa-th-large mr-2"></i>展会介绍
|
||||
<a href="exhibition.html" class="nav-link text-gray-700 hover:text-emerald-500 transition-colors">
|
||||
<i class="fas fa-th-large mr-2"></i>展览内容
|
||||
</a>
|
||||
<a href="marketing.html" class="nav-link text-gray-700 hover:text-purple-600 transition-colors">
|
||||
<i class="fas fa-bullhorn mr-2"></i>营销方案
|
||||
<a href="marketing.html" class="nav-link text-gray-700 hover:text-emerald-500 transition-colors">
|
||||
<i class="fas fa-bullhorn mr-2"></i>营销推广
|
||||
</a>
|
||||
<a href="operation.html" class="nav-link text-gray-700 hover:text-purple-600 transition-colors">
|
||||
<i class="fas fa-cogs mr-2"></i>现场运营
|
||||
<a href="operation.html" class="nav-link text-gray-700 hover:text-emerald-500 transition-colors">
|
||||
<i class="fas fa-cogs mr-2"></i>运营服务
|
||||
</a>
|
||||
<a href="budget.html" class="nav-link text-gray-700 hover:text-purple-600 transition-colors">
|
||||
<a href="budget.html" class="nav-link text-gray-700 hover:text-emerald-500 transition-colors">
|
||||
<i class="fas fa-chart-pie mr-2"></i>预算分析
|
||||
</a>
|
||||
<a href="risk.html" class="nav-link text-gray-700 hover:text-purple-600 transition-colors">
|
||||
<a href="risk.html" class="text-gray-700 hover:text-emerald-500 transition-colors">
|
||||
<i class="fas fa-shield-alt mr-2"></i>风险评估
|
||||
</a>
|
||||
</div>
|
||||
<button class="md:hidden text-gray-700">
|
||||
<i class="fas fa-bars text-2xl"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
Reference in New Issue
Block a user