Răsfoiți Sursa

web: 添加浠艾福小程序码(cf.jpg)到联系我们区域

Xiaogang Liao 2 luni în urmă
părinte
comite
ad485ba5ba
2 a modificat fișierele cu 42 adăugiri și 18 ștergeri
  1. 20 0
      web/css/style.css
  2. 22 18
      web/index.html

+ 20 - 0
web/css/style.css

@@ -1398,6 +1398,26 @@ ul { list-style: none; }
   font-size: var(--font-size-tiny);
 }
 
+.contact-qr {
+  margin-top: var(--space-xl);
+  text-align: center;
+}
+.contact-qr img {
+  width: 130px;
+  height: 130px;
+  border-radius: var(--radius-md);
+  border: 2px solid var(--color-border-light);
+  transition: transform var(--transition-fast);
+}
+.contact-qr img:hover {
+  transform: scale(1.05);
+}
+.contact-qr p {
+  font-size: var(--font-size-tiny);
+  color: var(--color-text-muted);
+  margin-top: var(--space-xs);
+}
+
 /* ----------------------------------------------------------
     15. Footer
    ---------------------------------------------------------- */

+ 22 - 18
web/index.html

@@ -1124,27 +1124,31 @@
             </div>
           </div>
         </div>
-        <div class="contact-cta">
-          <p>欢迎体验浠艾福家庭幸福健康成长平台</p>
-          <p class="cta-sub">微信小程序搜索「浠艾福」即可体验</p>
-          <div class="cta-cards">
-            <div class="cta-card">
-              <span class="cta-card-icon">📱</span>
-              <span>家长端</span>
-              <span class="cta-card-desc">管理家庭成长</span>
-            </div>
-            <div class="cta-card">
-              <span class="cta-card-icon">👤</span>
-              <span>孩子端</span>
-              <span class="cta-card-desc">完成任务挑战</span>
+          <div class="contact-cta">
+            <p>欢迎体验浠艾福家庭幸福健康成长平台</p>
+            <p class="cta-sub">微信小程序搜索「浠艾福」即可体验</p>
+            <div class="cta-cards">
+              <div class="cta-card">
+                <span class="cta-card-icon">📱</span>
+                <span>家长端</span>
+                <span class="cta-card-desc">管理家庭成长</span>
+              </div>
+              <div class="cta-card">
+                <span class="cta-card-icon">👤</span>
+                <span>孩子端</span>
+                <span class="cta-card-desc">完成任务挑战</span>
+              </div>
+              <div class="cta-card">
+                <span class="cta-card-icon">📊</span>
+                <span>规划师端</span>
+                <span class="cta-card-desc">专业服务管理</span>
+              </div>
             </div>
-            <div class="cta-card">
-              <span class="cta-card-icon">📊</span>
-              <span>规划师端</span>
-              <span class="cta-card-desc">专业服务管理</span>
+            <div class="contact-qr">
+              <img src="cf.jpg" alt="浠艾福小程序码">
+              <p>微信扫码立即体验</p>
             </div>
           </div>
-        </div>
       </div>
     </div>
   </section>