孕期小知识:首页四张卡去掉文字,改成图标+标题四个入口;点进详情页 #detailTips 看四张卡全文(滚到对应卡并高亮)(v26100131)

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
2026-10-01 13:09:56 +00:00
parent 19e0167df0
commit b3b768722a
3 changed files with 67 additions and 40 deletions

View File

@@ -7,7 +7,7 @@
<meta name="mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-capable" content="yes">
<title>兜爸心选 · 孕育陪伴</title>
<!-- V:26100130 缓存版本标记:改 css/js 时同步 bump 该值(与 js/app.js 的 VER 同源),静态资源按 mtime 走 ETag 自动刷新 -->
<!-- V:26100131 缓存版本标记:改 css/js 时同步 bump 该值(与 js/app.js 的 VER 同源),静态资源按 mtime 走 ETag 自动刷新 -->
<link rel="stylesheet" href="mama-box.css">
<script src="https://res.wx.qq.com/open/js/jweixin-1.6.0.js"></script>
<!-- 共享助手:授权/跳商城/位置上报(分享卡片同步,见 docs/h5-auth-standard.md 第四节) -->
@@ -325,11 +325,12 @@
</div>
<div class="pt-days" id="ptDays" role="tablist" aria-label="本周每天的小知识"></div>
</div>
<div class="pt-grid" id="ptGrid">
<div class="pt-card pc-baby"><span class="pt-ico" id="ptBabyIco" aria-hidden="true">👶</span><b>宝宝这周</b><p id="ptBaby"></p></div>
<div class="pt-card pc-mom"><span class="pt-ico" aria-hidden="true">🤰</span><b>妈妈身体</b><p id="ptMom"></p></div>
<div class="pt-card pc-eat"><span class="pt-ico" aria-hidden="true">🥗</span><b>吃点什么</b><p id="ptEat"></p></div>
<div class="pt-card pc-care"><span class="pt-ico" aria-hidden="true">📋</span><b>这周留心</b><p id="ptCare"></p></div>
<!-- 2026-10-01 用户要求:四张卡不在首页放文字,只留图标 + 标题四个入口,点进详情页 #detailTips 看全文 -->
<div class="pt-chips" id="ptChips">
<button type="button" class="pt-chip pc-baby" data-pt="baby"><i id="ptChipBaby" aria-hidden="true">👶</i><span>宝宝这周</span></button>
<button type="button" class="pt-chip pc-mom" data-pt="mom"><i aria-hidden="true">🤰</i><span>妈妈身体</span></button>
<button type="button" class="pt-chip pc-eat" data-pt="eat"><i aria-hidden="true">🥗</i><span>吃点什么</span></button>
<button type="button" class="pt-chip pc-care" data-pt="care"><i aria-hidden="true">📋</i><span>这周留心</span></button>
</div>
<p class="pt-foot">仅供参考,身体有任何不适请以医生意见为准</p>
</section>
@@ -1175,6 +1176,25 @@
<!-- ================= 孕期小知识 · 这一周 详情页(2026-10-01)=================
首页 #pregTips 下面四个入口点进来:宝宝 / 妈妈 / 饮食 / 留心 四张卡竖排、全文不截断;
点哪个入口就滚到哪张并闪一下。内容由 renderTips() 写入 ptBaby/ptMom/ptEat/ptCare。 -->
<section class="detail" id="detailTips">
<div class="detail-bar">
<button class="dt-back" data-detail="close">‹</button>
<span class="dt-title" id="ptDtTitle">孕期小知识</span>
</div>
<div class="detail-body pt-page">
<div class="pt-grid" id="ptGrid">
<div class="pt-card pc-baby" data-pt="baby"><span class="pt-ico" id="ptBabyIco" aria-hidden="true">👶</span><b>宝宝这周</b><p id="ptBaby"></p></div>
<div class="pt-card pc-mom" data-pt="mom"><span class="pt-ico" aria-hidden="true">🤰</span><b>妈妈身体</b><p id="ptMom"></p></div>
<div class="pt-card pc-eat" data-pt="eat"><span class="pt-ico" aria-hidden="true">🥗</span><b>吃点什么</b><p id="ptEat"></p></div>
<div class="pt-card pc-care" data-pt="care"><span class="pt-ico" aria-hidden="true">📋</span><b>这周留心</b><p id="ptCare"></p></div>
</div>
<p class="pt-foot">仅供参考,身体有任何不适请以医生意见为准</p>
</div>
</section>
<!-- ================= AI 小结 内容页 ================= -->
<section class="detail" id="detailAI">
<div class="detail-bar">