beifan/company-website
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Compare commits

base: beifan:049ec90b9bb376f49c4a2f54953a56f0e3adc38b
Branches Tags
beifan:main
...
compare: beifan:9452d41781953eb7acad34d165f1fc5c15872fa5
Branches Tags
beifan:main

2 Commits
049ec90b9b ... 9452d41781

Author SHA1 Message Date
ZHENG XIAOYI
9452d41781 fix typo 2026-02-09 19:44:02 +08:00
ZHENG XIAOYI
901af55cd9 style: redesign company introduction layout 2026-02-09 19:42:13 +08:00
1 changed files with 30 additions and 155 deletions
Expand all files Collapse all files

167
src/components/sections/Timeline.astro
View File

@@ -8,169 +8,44 @@
<div class="w-20 h-1.5 bg-gradient-to-r from-blue-600 to-indigo-600 mx-auto mt-6 rounded-full"></div> <div class="w-20 h-1.5 bg-gradient-to-r from-blue-600 to-indigo-600 mx-auto mt-6 rounded-full"></div>
</div> </div>
<div class="max-w-7xl mx-auto px-4 lg:px-0 mb-20"> <div class="max-w-7xl mx-auto px-4 lg:px-0 mb-8">
<div class="relative mb-16"> <div class="relative mb-16">
<div class="absolute inset-0 bg-gradient-to-r from-blue-400 via-indigo-400 to-purple-400 rounded-3xl blur-3xl opacity-30"></div> <div class="absolute inset-0 bg-gradient-to-r from-blue-400 via-blue-400 to-blue-400 rounded-3xl blur-3xl opacity-30"></div>
<div class="relative bg-gradient-to-br from-white via-blue-50/50 to-indigo-50/50 backdrop-blur-xl rounded-[2.5rem] p-8 md:p-16 border border-blue-100/50 shadow-2xl shadow-blue-200/20"> <div class="relative bg-gradient-to-br from-white via-blue-50/50 to-blue-50/50 backdrop-blur-xl rounded-[2.5rem] p-8 md:p-16 border border-blue-100/50 shadow-2xl shadow-blue-200/20">
<div class="flex flex-col lg:flex-row gap-12 items-center"> <div class="text-center">
<div class="flex-1"> <div class="inline-flex items-center gap-2 px-4 py-2 bg-blue-500/10 rounded-full mb-6 mx-auto">
<div class="inline-flex items-center gap-2 px-4 py-2 bg-blue-500/10 rounded-full mb-6">
<span class="w-2 h-2 bg-blue-500 rounded-full animate-pulse"></span> <span class="w-2 h-2 bg-blue-500 rounded-full animate-pulse"></span>
<span class="text-blue-600 text-sm font-semibold tracking-wider uppercase">About Us</</span> <span class="text-blue-600 text-sm font-semibold tracking-wider uppercase">About Us</</span>
</div> </div>
<p class="text-gray-700 text-lg md:text-xl leading-relaxed mb-6"> <p class="text-gray-700 text-lg md:text-xl leading-relaxed mb-6">
浙江贝凡网络科技有限公司是一家专注于<span class="text-transparent bg-clip-text bg-gradient-to-r from-blue-600 to-indigo-600 font-bold">产业数字化转型</span>的高科技企业，总部坐落于美丽的<span class="text-blue-600 font-bold">西子湖畔 · 杭州</span>。 浙江贝凡网络科技有限公司是一家专注于<span class="text-transparent bg-clip-text bg-gradient-to-r from-blue-600 to-blue-700 font-bold">产业数字化转型</span>的高科技企业，总部坐落于美丽的西子湖畔 · 杭州。
</p> </p>
<p class="text-gray-600 text-base md:text-lg leading-relaxed mb-6"> <p class="text-gray-600 text-base md:text-lg leading-relaxed">
依托<span class="text-indigo-600 font-semibold">AI大模型</span>、<span class="text-blue-600 font-semibold">物联网IoT</span>、<span class="text-indigo-600 font-semibold">融合开发DevOps</span>等技术优势，为政府和企业提供<span class="text-transparent bg-clip-text bg-gradient-to-r from-blue-600 to-indigo-600 font-semibold">全场景的数字化解决方案</span>。与<span class="text-blue-600 font-semibold">浪潮集团</span>、<span class="text-indigo-600 font-semibold">中国移动</span>、<span class="text-purple-600 font-semibold">海康威视</span>、<span class="text-cyan-600 font-semibold">阿里云</span>、<span class="text-blue-600 font-semibold">字节跳动</span>等头部企业深度融合合作，构建强大的业务生态体系。 依托<span class="text-blue-600 font-semibold">风险全流程管控</span>、<span class="text-blue-600 font-semibold">中控可视化</span>、<span class="text-blue-600 font-semibold">系统秒级联动</span>、<span class="text-blue-600 font-semibold">全栈多模态协同</span>等技术优势，为政府和企业提供<span class="text-transparent bg-clip-text bg-gradient-to-r from-blue-600 to-blue-700 font-semibold">全场景的数字化解决方案</span>。与<span class="text-blue-600 font-semibold">浪潮集团</span>、<span class="text-blue-600 font-semibold">中国移动</span>、<span class="text-blue-600 font-semibold">海康威视</span>、<span class="text-blue-600 font-semibold">阿里云</span>、<span class="text-blue-600 font-semibold">字节跳动</span>等头部企业深度融合合作，构建强大的业务生态体系。
</p> </p>
</div> </div>
<div class="flex-shrink-0 w-full lg:w-auto"> </div>
<div class="grid grid-cols-2 gap-4"> </div>
<div class="group relative p-6 bg-white/80 backdrop-blur-sm rounded-2xl border border-blue-100 hover:bg-white hover:shadow-xl hover:shadow-blue-200/50 hover:scale-105 transition-all duration-300">
<div class="absolute -top-1 -right-1 w-3 h-3 bg-blue-500 rounded-full animate-pulse"></div> <div class="grid grid-cols-4 gap-6 mb-20">
<div class="text-3xl md:text-4xl font-black text-transparent bg-clip-text bg-gradient-to-r from-blue-600 to-indigo-600 mb-1">2019</div> <div class="text-center group">
<div class="text-5xl md:text-6xl font-black text-blue-600 mb-2 group-hover:scale-110 transition-transform duration-300">2019</div>
<div class="text-gray-600 text-sm font-medium">成立年份</div> <div class="text-gray-600 text-sm font-medium">成立年份</div>
</div> </div>
<div class="group relative p-6 bg-white/80 backdrop-blur-sm rounded-2xl border border-indigo-100 hover:bg-white hover:shadow-xl hover:shadow-indigo-200/50 hover:scale-105 transition-all duration-300"> <div class="text-center group">
<div class="absolute -top-1 -right-1 w-3 h-3 bg-indigo-500 rounded-full animate-pulse" style="animation-delay: 0.2s"></div> <div class="text-5xl md:text-6xl font-black text-blue-600 mb-2 group-hover:scale-110 transition-transform duration-300" style="transition-delay: 0.1s">700+</div>
<div class="text-3xl md:text-4xl font-black text-transparent bg-clip-text bg-gradient-to-r from-indigo-600 to-purple-600 mb-1">700+</div>
<div class="text-gray-600 text-sm font-medium">视觉理解算法</div> <div class="text-gray-600 text-sm font-medium">视觉理解算法</div>
</div> </div>
<div class="group relative p-6 bg-white/80 backdrop-blur-sm rounded-2xl border border-blue-100 hover:bg-white hover:shadow-xl hover:shadow-blue-200/50 hover:scale-105 transition-all duration-300"> <div class="text-center group">
<div class="absolute -top-1 -right-1 w-3 h-3 bg-blue-500 rounded-full animate-pulse" style="animation-delay: 0.4s"></div> <div class="text-5xl md:text-6xl font-black text-blue-600 mb-2 group-hover:scale-110 transition-transform duration-300" style="transition-delay: 0.2s">99.9%</div>
<div class="text-3xl md:text-4xl font-black text-transparent bg-clip-text bg-gradient-to-r from-blue-600 to-cyan-600 mb-1">99.9%</div>
<div class="text-gray-600 text-sm font-medium">SLA可用性</div> <div class="text-gray-600 text-sm font-medium">SLA可用性</div>
</div> </div>
<div class="group relative p-6 bg-white/80 backdrop-blur-sm rounded-2xl border border-purple-100 hover:bg-white hover:shadow-xl hover:shadow-purple-200/50 hover:scale-105 transition-all duration-300"> <div class="text-center group">
<div class="absolute -top-1 -right-1 w-3 h-3 bg-purple-500 rounded-full animate-pulse" style="animation-delay: 0.6s"></div> <div class="text-5xl md:text-6xl font-black text-blue-600 mb-2 group-hover:scale-110 transition-transform duration-300" style="transition-delay: 0.3s">15+</div>
<div class="text-3xl md:text-4xl font-black text-transparent bg-clip-text bg-gradient-to-r from-purple-600 to-pink-600 mb-1">15+</div>
<div class="text-gray-600 text-sm font-medium">合作伙伴</div> <div class="text-gray-600 text-sm font-medium">合作伙伴</div>
</div> </div>
</div> </div>
</div> </div>
</div>
</div>
</div>
<div class="mb-16">
<div class="flex items-center justify-center gap-4 mb-10">
<div class="h-[1px] w-20 bg-gradient-to-r from-transparent to-blue-600"></div>
<h4 class="text-2xl md:text-3xl font-bold text-gray-900">核心技术引擎</h4>
<div class="h-[1px] w-20 bg-gradient-to-l from-transparent to-blue-600"></div>
</div>
<div class="grid md:grid-cols-2 lg:grid-cols-4 gap-6">
<div class="group relative bg-white rounded-3xl p-1 shadow-xl shadow-gray-200/50 hover:shadow-2xl hover:shadow-blue-500/10 transition-all duration-500">
<div class="absolute inset-0 bg-gradient-to-br from-blue-600 to-cyan-600 rounded-[1.3rem] opacity-0 group-hover:opacity-100 transition-opacity duration-500"></div>
<div class="relative h-full bg-white rounded-[1.2rem] p-6 group-hover:bg-transparent transition-colors duration-500">
<div class="w-16 h-16 bg-gradient-to-br from-blue-500 to-cyan-500 rounded-2xl flex items-center justify-center mb-5 group-hover:scale-110 group-hover:rotate-3 transition-transform duration-500 shadow-lg shadow-blue-500/30">
<i class="fa fa-cogs text-white text-2xl"></i>
</div>
<h5 class="text-xl font-bold text-gray-900 group-hover:text-white mb-3 transition-colors">AI大模型</h5>
<p class="text-gray-500 text-sm leading-relaxed group-hover:text-white/80 transition-colors">多模态人工智能技术<br>提供智能决策与分析能力</p>
</div>
</div>
<div class="group relative bg-white rounded-3xl p-1 shadow-xl shadow-gray-200/50 hover:shadow-2xl hover:shadow-indigo-500/10 transition-all duration-500">
<div class="absolute inset-0 bg-gradient-to-br from-indigo-600 to-purple-600 rounded-[1.3rem] opacity-0 group-hover:opacity-100 transition-opacity duration-500"></div>
<div class="relative h-full bg-white rounded-[1.2rem] p-6 group-hover:bg-transparent transition-colors duration-500">
<div class="w-16 h-16 bg-gradient-to-br from-indigo-500 to-purple-500 rounded-2xl flex items-center justify-center mb-5 group-hover:scale-110 group-hover:rotate-3 transition-transform duration-500 shadow-lg shadow-indigo-500/30">
<i class="fa fa-globe text-white text-2xl"></i>
</div>
<h5 class="text-xl font-bold text-gray-900 group-hover:text-white mb-3 transition-colors">物联网IoT</h5>
<p class="text-gray-500 text-sm leading-relaxed group-hover:text-white/80 transition-colors">海量设备接入与汇总，实现万物互联</p>
</div>
</div>
<div class="group relative bg-white rounded-3xl p-1 shadow-xl shadow-gray-200/50 hover:shadow-2xl hover:shadow-purple-500/10 transition-all duration-500">
<div class="absolute inset-0 bg-gradient-to-br from-purple-600 to-pink-600 rounded-[1.3rem] opacity-0 group-hover:opacity-100 transition-opacity duration-500"></div>
<div class="relative h-full bg-white rounded-[1.2rem] p-6 group-hover:bg-transparent transition-colors duration-500">
<div class="w-16 h-16 bg-gradient-to-br from-purple-500 to-pink-500 rounded-2xl flex items-center justify-center mb-5 group-hover:scale-110 group-hover:rotate-3 transition-transform duration-500 shadow-lg shadow-purple-500/30">
<i class="fa fa-code text-white text-2xl"></i>
</div>
<h5 class="text-xl font-bold text-gray-900 group-hover:text-white mb-3 transition-colors">融合开发DevOps</h5>
<p class="text-gray-500 text-sm leading-relaxed group-hover:text-white/80 transition-colors">全流程自动化开发运维，提升交付效率</p>
</div>
</div>
<div class="group relative bg-white rounded-3xl p-1 shadow-xl shadow-gray-200/50 hover:shadow-2xl hover:shadow-cyan-500/10 transition-all duration-500">
<div class="absolute inset-0 bg-gradient-to-br from-cyan-600 to-blue-600 rounded-[1.3rem] opacity-0 group-hover:opacity-100 transition-opacity duration-500"></div>
<div class="relative h-full bg-white rounded-[1.2rem] p-6 group-hover:bg-transparent transition-colors duration-500">
<div class="w-16 h-16 bg-gradient-to-br from-cyan-500 to-blue-500 rounded-2xl flex items-center justify-center mb-5 group-hover:scale-110 group-hover:rotate-3 transition-transform duration-500 shadow-lg shadow-cyan-500/30">
<i class="fa fa-shield text-white text-2xl"></i>
</div>
<h5 class="text-xl font-bold text-gray-900 group-hover:text-white mb-3 transition-colors">安全可信</h5>
<p class="text-gray-500 text-sm leading-relaxed group-hover:text-white/80 transition-colors">企业级安全防护体系，保障数据安全</p>
</div>
</div>
</div>
</div>
<div class="mb-12">
<div class="flex items-center justify-center gap-4 mb-10">
<div class="h-[1px] w-20 bg-gradient-to-r from-transparent to-indigo-600"></div>
<h4 class="text-2xl md:text-3xl font-bold text-gray-900">服务生态</h4>
<div class="h-[1px] w-20 bg-gradient-to-l from-transparent to-indigo-600"></div>
</div>
<div class="relative">
<div class="absolute inset-0 bg-gradient-to-r from-blue-600/10 via-indigo-600/10 to-purple-600/10 blur-3xl rounded-full"></div>
<div class="relative flex flex-wrap gap-4 justify-center p-4">
<span class="group relative px-6 py-3 bg-white/70 backdrop-blur-sm rounded-full text-gray-700 font-semibold shadow-lg border border-white/30 hover:bg-gradient-to-r hover:from-blue-600 hover:to-indigo-600 hover:text-white hover:border-transparent hover:shadow-blue-500/30 transition-all duration-300 cursor-default">
<div class="absolute inset-0 rounded-full bg-gradient-to-r from-blue-600 to-indigo-600 opacity-0 group-hover:opacity-100 blur-xl transition-opacity duration-300"></div>
<span class="relative flex items-center gap-2">
<i class="fa fa-flask text-sm"></i>
化工能源
</span>
</span>
<span class="group relative px-6 py-3 bg-white/70 backdrop-blur-sm rounded-full text-gray-700 font-semibold shadow-lg border border-white/30 hover:bg-gradient-to-r hover:from-indigo-600 hover:to-purple-600 hover:text-white hover:border-transparent hover:shadow-indigo-500/30 transition-all duration-300 cursor-default">
<div class="absolute inset-0 rounded-full bg-gradient-to-r from-indigo-600 to-purple-600 opacity-0 group-hover:opacity-100 blur-xl transition-opacity duration-300"></div>
<span class="relative flex items-center gap-2">
<i class="fa fa-cogs text-sm"></i>
生产制造
</span>
</span>
<span class="group relative px-6 py-3 bg-white/70 backdrop-blur-sm rounded-full text-gray-700 font-semibold shadow-lg border border-white/30 hover:bg-gradient-to-r hover:from-purple-600 hover:to-pink-600 hover:text-white hover:border-transparent hover:shadow-purple-500/30 transition-all duration-300 cursor-default">
<div class="absolute inset-0 rounded-full bg-gradient-to-r from-purple-600 to-pink-600 opacity-0 group-hover:opacity-100 blur-xl transition-opacity duration-300"></div>
<span class="relative flex items-center gap-2">
<i class="fa fa-line-chart text-sm"></i>
金融零售
</span>
</span>
<span class="group relative px-6 py-3 bg-white/70 backdrop-blur-sm rounded-full text-gray-700 font-semibold shadow-lg border border-white/30 hover:bg-gradient-to-r hover:from-cyan-600 hover:to-blue-600 hover:text-white hover:border-transparent hover:shadow-cyan-500/30 transition-all duration-300 cursor-default">
<div class="absolute inset-0 rounded-full bg-gradient-to-r from-cyan-600 to-blue-600 opacity-0 group-hover:opacity-100 blur-xl transition-opacity duration-300"></div>
<span class="relative flex items-center gap-2">
<i class="fa fa-building text-sm"></i>
城市政务
</span>
</span>
<span class="group relative px-6 py-3 bg-white/70 backdrop-blur-sm rounded-full text-gray-700 font-semibold shadow-lg border border-white/30 hover:bg-gradient-to-r hover:from-blue-600 hover:to-indigo-600 hover:text-white hover:border-transparent hover:shadow-blue-500/30 transition-all duration-300 cursor-default">
<div class="absolute inset-0 rounded-full bg-gradient-to-r from-blue-600 to-indigo-600 opacity-0 group-hover:opacity-100 blur-xl transition-opacity duration-300"></div>
<span class="relative flex items-center gap-2">
<i class="fa fa-truck text-sm"></i>
交通运输
</span>
</span>
<span class="group relative px-6 py-3 bg-white/70 backdrop-blur-sm rounded-full text-gray-700 font-semibold shadow-lg border border-white/30 hover:bg-gradient-to-r hover:from-indigo-600 hover:to-purple-600 hover:text-white hover:border-transparent hover:shadow-indigo-500/30 transition-all duration-300 cursor-default">
<div class="absolute inset-0 rounded-full bg-gradient-to-r from-indigo-600 to-purple-600 opacity-0 group-hover:opacity-100 blur-xl transition-opacity duration-300"></div>
<span class="relative flex items-center gap-2">
<i class="fa fa-camera text-sm"></i>
景区文旅
</span>
</span>
<span class="group relative px-6 py-3 bg-white/70 backdrop-blur-sm rounded-full text-gray-700 font-semibold shadow-lg border border-white/30 hover:bg-gradient-to-r hover:from-purple-600 hover:to-pink-600 hover:text-white hover:border-transparent hover:shadow-purple-500/30 transition-all duration-300 cursor-default">
<div class="absolute inset-0 rounded-full bg-gradient-to-r from-purple-600 to-pink-600 opacity-0 group-hover:opacity-100 blur-xl transition-opacity duration-300"></div>
<span class="relative flex items-center gap-2">
<i class="fa fa-heart text-sm"></i>
智慧养老
</span>
</span>
<span class="group relative px-6 py-3 bg-white/70 backdrop-blur-sm rounded-full text-gray-700 font-semibold shadow-lg border border-white/30 hover:bg-gradient-to-r hover:from-cyan-600 hover:to-blue-600 hover:text-white hover:border-transparent hover:shadow-cyan-500/30 transition-all duration-300 cursor-default">
<div class="absolute inset-0 rounded-full bg-gradient-to-r from-cyan-600 to-blue-600 opacity-0 group-hover:opacity-100 blur-xl transition-opacity duration-300"></div>
<span class="relative flex items-center gap-2">
<i class="fa fa-medkit text-sm"></i>
医疗健康
</span>
</span>
</div>
</div>
</div>
<div class="max-w-7xl mx-auto px-4 lg:px-0 pb-20"> <div class="max-w-7xl mx-auto px-4 lg:px-0 pb-20">
<div class="text-center mb-16"> <div class="text-center mb-16">
@@ -229,7 +104,7 @@
<div class="w-full md:w-7/12 order-2"> <div class="w-full md:w-7/12 order-2">
<div class="relative"> <div class="relative">
<div class="absolute top-0 bottom-0 left-3 md:left-6 w-px bg bg-gradient-to-b from-blue-600/40 via-gray-200 to-transparent z-0"></div> <div class="absolute top-0 bottom-0 left-3 md:left-6 w-px bg-gradient-to-b from-blue-600/40 via-gray-200 to-transparent z-0"></div>
<div class="space-y-8 md:space-y-10"> <div class="space-y-8 md:space-y-10">
<div class="relative flex z-10"> <div class="relative flex z-10">