jone/mama-box
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

百宝箱：列表底部加查看更多三入口，三张卡按钮扫光提示可点

Browse Source
This commit is contained in:
deploy
2026-11-05 23:58:25 +00:00
parent ea641585ba
commit c43ba39a32
6 changed files with 49 additions and 26 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
guangchang/index.html
View File

@@ -930,10 +930,10 @@ html.night .gtg button.on{background:#F2725B;border-color:#F2725B;color:#fff}
<div id="sheet" role="dialog" aria-modal="true"><i class="sg"></i><div class="sbd" id="sbd"></div></div>
<div class="toast" id="toast"></div>
<script src="topics.js?v=26110485"></script>
<script src="data.js?v=26110485"></script>
<script src="feed.js?v=26110485"></script>
<script src="../js/ava-pool.js?v=26110485"></script> <!-- 11-05 装饰头像分配表（各模块互不重复） -->
<script src="topics.js?v=26110486"></script>
<script src="data.js?v=26110486"></script>
<script src="feed.js?v=26110486"></script>
<script src="../js/ava-pool.js?v=26110486"></script> <!-- 11-05 装饰头像分配表（各模块互不重复） -->
<script src="ceshi/meta.js?v=26110464"></script>
<script src="../js/share-card.js?v=26110464"></script>
<script src="../js/cm-pics.js?v=26110464"></script> <!-- 11-05 评论 / 回复带图 -->
@@ -1004,7 +1004,7 @@ html.night .gtg button.on{background:#F2725B;border-color:#F2725B;color:#fff}
var CMD = null, CMERR = false;
/* 头像编码：数字 = av/NNNN.webp（旧代码头像）；'av:c012' = av/c012.webp（卡通/可爱卡通）；'/…' = 站内绝对路径（内置头像库 /_bridge/avatars/）；其余 = assets/img/mom/xxx.jpg */
var avP = function (a) { return typeof a === 'number' ? 'av/' + ('000' + a).slice(-4) + '.webp' : a.indexOf('av:') === 0 ? 'av/' + a.slice(3) + '.webp' : a.charAt(0) === '/' ? a : '../assets/img/mom/' + a + '.jpg'; };
fetch('cm.json?v=26110485').then(function (r) { return r.json(); }).then(function (j) {
fetch('cm.json?v=26110486').then(function (r) { return r.json(); }).then(function (j) {
CMD = j; if (openId && NBY[openId]) { renderComments(NBY[openId]); syncBar(NBY[openId]); }
}).catch(function () { CMERR = true; if (openId && NBY[openId]) renderComments(NBY[openId]); });
function commentsOf(n) {

2
guangchang/mine/index.html
View File

@@ -107,7 +107,7 @@ main{padding:6px 16px 0}
</div>
<div class="wb"><button type="button" id="write"><svg class="ic" viewBox="0 0 24 24"><path d="M12 20h9M16.5 3.5a2.1 2.1 0 013 3L7 19l-4 1 1-4z"/></svg>写新的故事</button></div>
<script src="../topics.js?v=26110485"></script>
<script src="../topics.js?v=26110486"></script>
<script>
(function () {
'use strict';

24
index.html
View File

@@ -8,8 +8,8 @@
<meta name="apple-mobile-web-app-capable" content="yes">
<title>兜爸心选 · 孕育陪伴</title>
<!-- 11-04 UGC 总开关（孕妈广场 + 测一测，后台 /box_bm/plaza 顶部切换），见 js/ugc.js -->
<script src="js/ugc.js?v=26110485"></script>
<!-- V:26110485 缓存版本标记：改 css/js 时同步 bump 该值（与 js/app.js 的 VER 同源），静态资源按 mtime 走 ETag 自动刷新 -->
<script src="js/ugc.js?v=26110486"></script>
<!-- V:26110486 缓存版本标记：改 css/js 时同步 bump 该值（与 js/app.js 的 VER 同源），静态资源按 mtime 走 ETag 自动刷新 -->
<link rel="stylesheet" href="mama-box.css">
<link rel="stylesheet" href="night.css">
<!-- 11-04 用户：「顶部图片上的倒计时先删除掉」→ 不加载 hero-cd.css / hero-cd.js（文件留着，加回这两行即恢复），头图回到原样式 -->
@@ -2675,13 +2675,13 @@ html.night .rs-pan .rp-card{background:rgba(255,255,255,.06);border-color:rgba(2
<script src="/_bridge/avatar-picker.js?v=26101105"></script>
<script src="/_bridge/hand-icons.js?v=26101202"></script>
<script src="js/zodiac-art.js"></script>
<script src="guangchang/topics.js?v=26110485"></script>
<script src="js/ava-pool.js?v=26110485"></script> <!-- 11-05 装饰头像分配表（各模块互不重复） -->
<script src="guangchang/topics.js?v=26110486"></script>
<script src="js/ava-pool.js?v=26110486"></script> <!-- 11-05 装饰头像分配表（各模块互不重复） -->
<script src="js/app.js"></script>
<script src="js/kit.js?v=26110485"></script>
<script src="js/kit.js?v=26110486"></script>
<!-- 11-05 用户：孕期百问加上跟趣味小测试一样的底部 Tab（孕期百问 / 记一下 / 返回首页）。挂在 #detailQA 里，面板关着时跟着滑出屏外；
「记一下」直接开首页自己的记一下弹层（z 95 盖在百问 z 80 上），「返回首页」= 关掉百问面板 -->
<script src="js/mb-tabbar.js?v=26110485"></script>
<script src="js/mb-tabbar.js?v=26110486"></script>
<script>
(function () {
var d = document.getElementById('detailQA'); if (!d || !window.MBTab) return;
@@ -2701,7 +2701,7 @@ html.night .rs-pan .rp-card{background:rgba(255,255,255,.06);border-color:rgba(2
if (gchDone || !window.__mbUgc) return; gchDone = true;
var m = location.search.match(/[?&]gcv=([1-6])(?:&|$)/);
if (!m) window.__gcDefault = 1;
var n = m ? m[1] : '6', l = document.createElement('link'), s = document.createElement('script'), q = m ? Date.now() : 'v=26110485';
var n = m ? m[1] : '6', l = document.createElement('link'), s = document.createElement('script'), q = m ? Date.now() : 'v=26110486';
var dir = n === '4' || n === '6' ? 'js/gch/' : 'demo/gch/'; /* 11-03 上正式：定稿 V6（含它套的 V4）并进 js/gch/，其余效果稿仍在 demo/ */
l.rel = 'stylesheet'; l.href = dir + 'v' + n + '.css?' + q;
s.src = dir + 'v' + n + '.js?' + q;
@@ -2716,19 +2716,19 @@ html.night .rs-pan .rp-card{background:rgba(255,255,255,.06);border-color:rgba(2
/* 11-02 品牌露出（用户定 4 处都要）：默认加载，?brand=0 可关掉对比；11-03 已并进 js/gch/ */
if (!/[?&]brand=0/.test(location.search)) {
var bl = document.createElement('link'), bs = document.createElement('script');
bl.rel = 'stylesheet'; bl.href = 'js/gch/brand.css?v=26110485'; bs.src = 'js/gch/brand.js?v=26110485';
bl.rel = 'stylesheet'; bl.href = 'js/gch/brand.css?v=26110486'; bs.src = 'js/gch/brand.js?v=26110486';
document.head.appendChild(bl); document.body.appendChild(bs);
}
})();
</script>
<!-- 2026-10-03 首页彩蛋：宝宝在肚皮底下动（独立文件，删掉这一行即整体下线；开关在「隐私权限」） -->
<script src="js/bump.js?v=26110485"></script>
<script src="js/bump.js?v=26110486"></script>
<!-- 2026-10-04 首页头图：按孕周换宝宝 + 阳光水波（独立文件） -->
<script src="js/hero-fx.js"></script>
<!-- 2026-10-05 首页头图：宝宝时不时动一动小手小脚（独立文件，删掉这一行即下线） -->
<script src="js/baby-limbs.js?v=26110485"></script>
<script src="js/coach.js?v=26110485"></script>
<script src="js/birth-flow.js?v=26110485"></script>
<script src="js/baby-limbs.js?v=26110486"></script>
<script src="js/coach.js?v=26110486"></script>
<script src="js/birth-flow.js?v=26110486"></script>
<!-- 禁止下拉回弹（2026-10-11 统一规则，与孕期体重同一段）：竖向拖动时从手指下往上找还能朝该方向滚的容器，找不到才拦；横滑、双指、可滚列表不受影响 -->
<script>

2
js/gch/v4.js
View File

@@ -244,5 +244,5 @@
}
/* feed.js 首页默认不加载（index.html 只引了 topics.js），这里按需拉一次 */
if (window.GC_FEED) init();
else { var fs = document.createElement('script'); fs.src = 'guangchang/feed.js?v=26110485'; fs.onload = fs.onerror = init; document.body.appendChild(fs); }
else { var fs = document.createElement('script'); fs.src = 'guangchang/feed.js?v=26110486'; fs.onload = fs.onerror = init; document.body.appendChild(fs); }
})();

18
js/kit.css
View File

@@ -133,3 +133,21 @@ html.night #homeBody>section#kitHome.kit-home{background:linear-gradient(180deg,
html.night #homeBody>section#kitHome.kit-home{background:linear-gradient(180deg,rgba(52,44,54,.78),rgba(44,40,58,.74))!important}
/* 11-04 用户：三张大卡标题（孕期百问 / 孕期计算器 / 趣味小测试）大一号 14.5 → 16px */
.kit-e b{font-size:16px}
/* 11-05 用户：「不知道三个按钮能点；6 条看完以为有查看更多」→ 列表底部「查看更多」三颗胶囊（颜色同上面三张卡），三张卡的按钮轮流扫一道光 */
.kit-mo{display:flex;align-items:center;gap:6px;margin:4px 2px 6px;padding-top:10px;border-top:1px dashed #F1DDD6}
.kit-mo>span{flex:none;margin-right:auto;font-size:12px;font-weight:700;color:#A3958D;letter-spacing:.3px}
.kit-mb{flex:none;display:inline-flex;align-items:center;gap:3px;height:28px;padding:0 9px 0 8px;border-radius:99px;border:1px solid var(--mc2);background:var(--mc1);color:var(--mc);font:inherit;font-size:12px;font-weight:800;cursor:pointer;transition:transform .14s}
.kit-mb:active{transform:scale(.94)}
.kit-mb svg{width:14px;height:14px;flex:none}
.kit-mb i{font-style:normal;font-size:14px;line-height:1;margin-left:1px}
.kit-mb.m-qa{--mc:#2E9B78;--mc1:#EAF8F3;--mc2:#C6EADD}
.kit-mb.m-js{--mc:#E86F22;--mc1:#FFF3EA;--mc2:#FAD6BC}
.kit-mb.m-qz{--mc:#7C5CFC;--mc1:#F3EEFF;--mc2:#DCD1FE}
html.night .kit-mo{border-top-color:rgba(255,255,255,.1)}
html.night .kit-mb{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.14)}
.kit-e em{position:relative;overflow:hidden;box-shadow:0 4px 10px -5px var(--c)}
.kit-e em::after{content:'';position:absolute;top:0;bottom:0;left:-60%;width:45%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.55),transparent);transform:skewX(-18deg);animation:kitShine 7.5s ease-in-out infinite}
.kit-e.e-js em::after{animation-delay:2.5s}
.kit-e.e-qz em::after{animation-delay:5s}
@keyframes kitShine{0%,82%{left:-60%}96%,100%{left:130%}}
@media (prefers-reduced-motion:reduce){.kit-e em::after{animation:none}}

19
js/kit.js
View File

@@ -27,6 +27,11 @@
var FIRE = '<svg viewBox="0 0 24 24" aria-hidden="true"><path d="M12.6 2.5c.4 3-1.6 4.6-3 6.2C8 10.4 7 12 7 14.3A5 5 0 0012 19.5a5 5 0 005-5.2c0-2-1-3.6-1.9-4.6-.2 1.3-.9 2.2-1.9 2.6.6-3.4-.2-7-.6-9.8z" fill="currentColor"/></svg>';
/* ---------- 上：三个入口 ---------- */
var KN_IC = {
qz: '<svg viewBox="0 0 24 24" aria-hidden="true"><path d="M9 3h6M10 3v6l-5 9a2 2 0 001.8 3h10.4a2 2 0 001.8-3l-5-9V3" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>',
qa: '<svg viewBox="0 0 24 24" aria-hidden="true"><path d="M4 5h16v11H9l-5 4z" fill="none" stroke="currentColor" stroke-width="2" stroke-linejoin="round"/><path d="M10 9.5a2 2 0 113 1.7c-.6.4-1 .8-1 1.5M12 14.5h.01" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round"/></svg>',
js: '<svg viewBox="0 0 24 24" aria-hidden="true"><rect x="5" y="3" width="14" height="18" rx="2.5" fill="none" stroke="currentColor" stroke-width="2"/><path d="M8.5 7h7M8.5 12h.01M12 12h.01M15.5 12h.01M8.5 16h.01M12 16h.01M15.5 16h.01" stroke="currentColor" stroke-width="2.2" stroke-linecap="round"/></svg>'
};
var E = [
/* 11-04 用户：三个入口顺序改为 孕期百问 → 孕期计算器 → 趣味小测试 */
{ k: 'qa', n: '孕期百问', d: '孕妈最常问的问题，一次看明白', c: '100 个问题', img: 'kepu', u: '人看过' },
@@ -39,7 +44,12 @@
'<b>' + x.n + '</b><span>' + x.d + '</span><strong class="kit-n">' + FIRE + '<i>--</i>' + x.u + '</strong><em>' + x.c + '<i aria-hidden="true">›</i></em></button>';
}).join('') + '</div>' +
/* 11-03 用户：「『大家都在用』跟百宝箱像两块，割裂了」→ 去掉这个小标题和虚线，三个入口 + 6 条装进同一张白底面板（.kit-pn），一眼看出是百宝箱里的内容 */
'<div class="ms-list kit-list"></div></div>';
'<div class="ms-list kit-list"></div>' +
/* 11-05 用户：「大家不知道三个按钮能点，看完 6 条以为有『查看更多』，可又没有综合页」→ 列表底部加一排「查看更多」，
按类型分三颗胶囊直达三个列表页（颜色、图标和上面三张卡一一对应），上面三张卡的按钮加一道定时扫光提示可点 */
'<div class="kit-mo"><span>查看更多</span>' + E.map(function (x) {
return '<button type="button" class="kit-mb m-' + x.k + '" data-k="' + x.k + '">' + KN_IC[x.k] + x.n.replace(/^孕期|^趣味小/, '') + '<i aria-hidden="true">›</i></button>';
}).join('') + '</div></div>';
sec.classList.remove('hide');
function setCnt(k, t) { var e = box.querySelector('.e-' + k + ' em'); if (e) e.firstChild.nodeValue = t; }
function setNum(k, n) { var e = box.querySelector('.e-' + k + ' .kit-n i'); if (e && n) e.textContent = wanX(n); }
@@ -122,11 +132,6 @@
var KR_GO = { qz: '去测', qa: '去看', js: '去算' };
/* 11-04 用户：「前面的小图标换成字：测试用『测』、百问用『问』、计算器用『算』」（KN_IC 线稿图标留着备用） */
var KR_CH = { qz: '测', qa: '问', js: '算' };
var KN_IC = {
qz: '<svg viewBox="0 0 24 24" aria-hidden="true"><path d="M9 3h6M10 3v6l-5 9a2 2 0 001.8 3h10.4a2 2 0 001.8-3l-5-9V3" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>',
qa: '<svg viewBox="0 0 24 24" aria-hidden="true"><path d="M4 5h16v11H9l-5 4z" fill="none" stroke="currentColor" stroke-width="2" stroke-linejoin="round"/><path d="M10 9.5a2 2 0 113 1.7c-.6.4-1 .8-1 1.5M12 14.5h.01" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round"/></svg>',
js: '<svg viewBox="0 0 24 24" aria-hidden="true"><rect x="5" y="3" width="14" height="18" rx="2.5" fill="none" stroke="currentColor" stroke-width="2"/><path d="M8.5 7h7M8.5 12h.01M12 12h.01M15.5 12h.01M8.5 16h.01M12 16h.01M15.5 16h.01" stroke="currentColor" stroke-width="2.2" stroke-linecap="round"/></svg>'
};
function paint() {
nums();
var d = rows(), L = box.querySelector('.kit-list');
@@ -245,7 +250,7 @@
paint();
box.addEventListener('click', function (e) {
var b = e.target.closest('.kit-e'); if (!b) return;
var b = e.target.closest('.kit-e,.kit-mb'); if (!b) return;
try { navigator.vibrate && navigator.vibrate(8); } catch (x) {}
var k = b.dataset.k;
if (k === 'qz') location.href = 'guangchang/' + cleanQ({ c: 'ceshi' });