Initial commit
This commit is contained in:
105
src/components/sections/Footer.astro
Normal file
105
src/components/sections/Footer.astro
Normal file
@@ -0,0 +1,105 @@
|
||||
---
|
||||
---
|
||||
<footer class="bg-gray-900 text-white pt-16 pb-8">
|
||||
<div class="max-w-7xl mx-auto px-4">
|
||||
|
||||
<div class="grid grid-cols-1 md:grid-cols-3 gap-12 mb-10">
|
||||
|
||||
<div class="space-y-4">
|
||||
<h4 class="font-extrabold text-xl text-white border-l-4 border-blue-500 pl-3">扫码关注获取更多资讯</h4>
|
||||
|
||||
<div class="flex gap-6">
|
||||
<div class="group relative flex flex-col items-center space-y-2 cursor-pointer">
|
||||
<div class="bg-white p-1 rounded-lg inline-block shadow-lg transition-transform duration-300 group-hover:scale-110">
|
||||
<img src="/img/official-wechat.jpg" alt="微信服务号" class="w-16 h-16 rounded-md">
|
||||
</div>
|
||||
<p class="text-sm text-gray-400">企业服务号</p>
|
||||
|
||||
<div class="absolute bottom-full left-1/2 -translate-x-1/2 mb-4 opacity-0 invisible group-hover:opacity-100 group-hover:visible transition-all duration-300 z-50">
|
||||
<div class="bg-white p-3 rounded-xl shadow-[0_10px_30px_rgba(0,0,0,0.5)] border-2 border-blue-500 w-48 text-center">
|
||||
<img src="/img/official-wechat.jpg" alt="微信服务号大图" class="w-full h-auto rounded-lg mb-2">
|
||||
<div class="absolute top-full left-1/2 -translate-x-1/2 w-0 h-0 border-l-[8px] border-l-transparent border-r-[8px] border-r-transparent border-t-[8px] border-t-white"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="group relative flex flex-col items-center space-y-2 cursor-pointer">
|
||||
<div class="bg-white p-1 rounded-lg inline-block shadow-lg transition-transform duration-300 group-hover:scale-110">
|
||||
<img src="/img/official-douyin.jpg" alt="企业抖音" class="w-16 h-16 rounded-md">
|
||||
</div>
|
||||
<p class="text-sm text-gray-400">企业抖音</p>
|
||||
|
||||
<div class="absolute bottom-full left-1/2 -translate-x-1/2 mb-4 opacity-0 invisible group-hover:opacity-100 group-hover:visible transition-all duration-300 z-50">
|
||||
<div class="bg-white p-3 rounded-xl shadow-[0_10px_30px_rgba(0,0,0,0.5)] border-2 border-blue-500 w-48 text-center">
|
||||
<img src="/img/official-douyin.jpg" alt="企业抖音大图" class="w-full h-auto rounded-lg mb-2">
|
||||
<div class="absolute top-full left-1/2 -translate-x-1/2 w-0 h-0 border-l-[8px] border-l-transparent border-r-[8px] border-r-transparent border-t-[8px] border-t-white"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="group relative flex flex-col items-center space-y-2 cursor-pointer">
|
||||
<div class="bg-white p-1 rounded-lg inline-block shadow-lg transition-transform duration-300 group-hover:scale-110">
|
||||
<img src="/img/official-xiaohongshu.jpg" alt="企业小红书" class="w-16 h-16 rounded-md">
|
||||
</div>
|
||||
<p class="text-sm text-gray-400">企业小红书</p>
|
||||
|
||||
<div class="absolute bottom-full left-1/2 -translate-x-1/2 mb-4 opacity-0 invisible group-hover:opacity-100 group-hover:visible transition-all duration-300 z-50">
|
||||
<div class="bg-white p-3 rounded-xl shadow-[0_10px_30px_rgba(0,0,0,0.5)] border-2 border-blue-500 w-48 text-center">
|
||||
<img src="/img/official-xiaohongshu.jpg" alt="企业小红书大图" class="w-full h-auto rounded-lg mb-2">
|
||||
<div class="absolute top-full left-1/2 -translate-x-1/2 w-0 h-0 border-l-[8px] border-l-transparent border-r-[8px] border-r-transparent border-t-[8px] border-t-white"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="space-y-6">
|
||||
<h4 class="font-extrabold text-xl text-white border-l-4 border-blue-500 pl-3">快速链接</h4>
|
||||
<div class="w-full">
|
||||
<div class="grid grid-cols-2 gap-x-8">
|
||||
<ul class="space-y-4 text-base">
|
||||
<li><a href="#home" class="flex items-center gap-3 text-gray-400 hover:text-blue-400 transition-colors"><i class="fa fa-home w-4 text-center text-blue-500"></i><span>首页</span></a></li>
|
||||
<li><a href="#core-business" class="flex items-center gap-3 text-gray-400 hover:text-blue-400 transition-colors"><i class="fa fa-briefcase w-4 text-center text-blue-500"></i><span>核心业务</span></a></li>
|
||||
<li><a href="#ai-model" class="flex items-center gap-3 text-gray-400 hover:text-blue-400 transition-colors"><i class="fa fa-microchip w-4 text-center text-blue-500"></i><span>AI大模型</span></a></li>
|
||||
</ul>
|
||||
<ul class="space-y-4 text-base">
|
||||
<li><a href="#about-us" class="flex items-center gap-3 text-gray-400 hover:text-blue-400 transition-colors"><i class="fa fa-info-circle w-4 text-center text-blue-500"></i><span>关于我们</span></a></li>
|
||||
<li><a href="#recruitment" class="flex items-center gap-3 text-gray-400 hover:text-blue-400 transition-colors"><i class="fa fa-handshake-o w-4 text-center text-blue-500"></i><span>生态合作</span></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="space-y-6">
|
||||
<h4 class="font-extrabold text-xl text-white border-l-4 border-blue-500 pl-3">联系我们</h4>
|
||||
<ul class="space-y-4 text-base text-gray-400">
|
||||
<li class="flex items-start">
|
||||
<i class="fa fa-map-marker w-5 text-blue-500 mt-1 flex-shrink-0"></i>
|
||||
<span>浙江省杭州市余杭区杭行路1499号润珹置地中心</span>
|
||||
</li>
|
||||
<li class="flex items-start">
|
||||
<i class="fa fa-phone w-5 text-blue-500 mt-1 flex-shrink-0"></i>
|
||||
<a href="tel:400-998-5710" class="hover:text-blue-400 transition-colors">400-998-5710</a>
|
||||
</li>
|
||||
<li class="flex items-start">
|
||||
<i class="fa fa-envelope w-5 text-blue-500 mt-1 flex-shrink-0"></i>
|
||||
<a href="mailto:zjbeifan@126.com" class="hover:text-blue-400 transition-colors">zjbeifan@126.com</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="border-t border-gray-700 pt-6 mt-10 space-y-2">
|
||||
<p class="text-center text-sm text-gray-500">
|
||||
Copyright © 2026 浙江贝凡网络科技有限公司. All Rights Reserved. |
|
||||
<a href="https://beian.miit.gov.cn/" target="_blank" class="hover:text-blue-400 transition-colors">浙ICP备2025170226号-4</a>
|
||||
</p>
|
||||
<p class="text-center text-sm text-gray-500">
|
||||
<a href="https://beian.mps.gov.cn/#/query/webSearch?code=33011002018371" rel="noreferrer" target="_blank" class="inline-flex items-center justify-center gap-1 hover:text-blue-400 transition-colors">
|
||||
<img src="/img/beian.png" alt="备案图标" class="w-4 h-4">
|
||||
<span>浙公网安备33011002018371号</span>
|
||||
</a>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
Reference in New Issue
Block a user