重构关于我们、商家申请和案例页面,优化布局和内容展示

This commit is contained in:
2025-09-18 19:52:08 +08:00
parent 10aca89915
commit 4352f613fc
45 changed files with 8513 additions and 487 deletions

View File

@@ -31,7 +31,7 @@
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav ms-auto">
<li class="nav-item">
<a class="nav-link" href="index.html">首页</a>
<a class="nav-link active" href="index.html">首页</a>
</li>
<li class="nav-item">
<a class="nav-link" href="about.html">关于我们</a>
@@ -76,6 +76,7 @@
</div>
<h3>旅行结伴</h3>
<p>发布你的旅行计划,寻找志同道合的旅行伙伴,一起探索世界的美好。</p>
<a href="travel.html" class="btn btn-outline-primary btn-sm mt-3">了解更多</a>
</div>
</div>
@@ -86,16 +87,18 @@
</div>
<h3>动物认领</h3>
<p>认领可爱的动物,体验农场生活,与动物建立深厚的情感纽带。</p>
<a href="animal.html" class="btn btn-outline-primary btn-sm mt-3">了解更多</a>
</div>
</div>
<div class="col-md-4 mb-4">
<div class="feature-box">
<div class="feature-icon">
<i class="fa fa-flower"></i>
<i class="fa fa-seedling"></i>
</div>
<h3>送花服务</h3>
<p>为你的结伴伙伴或重要的人订购鲜花,传递温暖和浪漫。</p>
<a href="flower.html" class="btn btn-outline-primary btn-sm mt-3">了解更多</a>
</div>
</div>
</div>
@@ -118,7 +121,7 @@
<p class="card-text">通过结伴客,我找到了一起去西藏的伙伴,还认领了一只小羊,这是一次非常难忘的经历!</p>
</div>
<div class="d-flex align-items-center mt-4">
<img src="images/user-avatar1.svg" class="rounded-circle me-3" alt="用户小李">
<img src="images/user-avatar1.svg" class="rounded-circle me-3" alt="用户小李" width="50" height="50">
<div>
<h6 class="mb-0">小李</h6>
<small class="text-muted">旅行爱好者</small>
@@ -136,7 +139,7 @@
<p class="card-text">作为农场主结伴客为我们带来了大量游客动物认领业务增长了300%</p>
</div>
<div class="d-flex align-items-center mt-4">
<img src="images/merchant-avatar1.svg" class="rounded-circle me-3" alt="商家王老板">
<img src="images/merchant-avatar1.svg" class="rounded-circle me-3" alt="商家王老板" width="50" height="50">
<div>
<h6 class="mb-0">王老板</h6>
<small class="text-muted">绿野农场</small>
@@ -154,7 +157,7 @@
<p class="card-text">通过结伴客的送花服务,我给了她一个浪漫的惊喜,我们的关系更进一步了!</p>
</div>
<div class="d-flex align-items-center mt-4">
<img src="images/user-avatar2.svg" class="rounded-circle me-3" alt="用户小张">
<img src="images/user-avatar2.svg" class="rounded-circle me-3" alt="用户小张" width="50" height="50">
<div>
<h6 class="mb-0">小张</h6>
<small class="text-muted">浪漫主义者</small>
@@ -166,6 +169,48 @@
</div>
</section>
<!-- 推广奖励 -->
<section class="container mb-5">
<div class="row">
<div class="col-12 mb-5">
<h2 class="display-5 fw-bold text-center section-title">推广奖励</h2>
</div>
</div>
<div class="row">
<div class="col-md-6 mb-4">
<div class="card h-100">
<div class="card-body">
<h3 class="card-title">分享即赚钱</h3>
<p class="card-text">将结伴客推荐给朋友,他们通过您的链接注册或下单,您即可获得丰厚佣金。</p>
<ul class="list-unstyled mt-3">
<li class="mb-2"><i class="fa fa-check-circle text-success me-2"></i>旅行结伴订单15%佣金</li>
<li class="mb-2"><i class="fa fa-check-circle text-success me-2"></i>动物认领订单20%佣金</li>
<li class="mb-2"><i class="fa fa-check-circle text-success me-2"></i>送花服务订单12%佣金</li>
<li class="mb-2"><i class="fa fa-check-circle text-success me-2"></i>新用户注册奖励¥10</li>
</ul>
</div>
</div>
</div>
<div class="col-md-6 mb-4">
<div class="card h-100">
<div class="card-body">
<h3 class="card-title">如何参与</h3>
<ol class="mt-3">
<li class="mb-2">注册成为结伴客用户</li>
<li class="mb-2">进入推广奖励页面获取专属链接</li>
<li class="mb-2">分享链接给朋友</li>
<li class="mb-2">朋友通过链接注册或下单</li>
<li class="mb-2">获得相应佣金奖励</li>
</ol>
<a href="reward.html" class="btn btn-primary mt-3">立即参与</a>
</div>
</div>
</div>
</div>
</section>
<!-- 行动号召 -->
<section class="cta-section">
<div class="container text-center">
@@ -199,10 +244,10 @@
<div class="col-md-2 mb-4">
<h5 class="mb-4">产品</h5>
<ul class="list-unstyled">
<li><a href="#" class="d-block py-1">旅行结伴</a></li>
<li><a href="#" class="d-block py-1">动物认领</a></li>
<li><a href="#" class="d-block py-1">送花服务</a></li>
<li><a href="#" class="d-block py-1">推广奖励</a></li>
<li><a href="travel.html" class="d-block py-1">旅行结伴</a></li>
<li><a href="animal.html" class="d-block py-1">动物认领</a></li>
<li><a href="flower.html" class="d-block py-1">送花服务</a></li>
<li><a href="reward.html" class="d-block py-1">推广奖励</a></li>
</ul>
</div>
<div class="col-md-2 mb-4">
@@ -242,8 +287,8 @@
</div>
<div class="col-md-6 text-center text-md-end">
<ul class="list-inline mb-0">
<li class="list-inline-item"><a href="#">用户协议</a></li>
<li class="list-inline-item"><a href="#">隐私政策</a></li>
<li class="list-inline-item"><a href="terms.html">用户协议</a></li>
<li class="list-inline-item"><a href="privacy.html">隐私政策</a></li>
<li class="list-inline-item"><a href="#">网站地图</a></li>
</ul>
</div>