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

首页消消乐与 3D 婴儿房对调位置

Browse Source 
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
Karlcarlo
2026-10-01 11:24:04 +00:00
parent ed05acdf55
commit 6bf7fa4058
2 changed files with 37 additions and 37 deletions
Download Patch File Download Diff File Expand all files Collapse all files

72
index.html
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:26100125 缓存版本标记：改 css/js 时同步 bump 该值（与 js/app.js 的 VER 同源），静态资源按 mtime 走 ETag 自动刷新 -->
<!-- V:26100126 缓存版本标记：改 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 第四节） -->
@@ -302,22 +302,25 @@
</section>
<!-- 宝宝消消乐 · 推广入口（2026-09-30）。用户原话：「做了一个消消乐小游戏（待产清单主题），
放到首页展示并推广，宝妈们业余时间玩，名字叫宝宝消消乐」。
放在工具托盘正下方：首屏滑一下就能看到。右侧 3×3 小棋盘是纯装饰动画
（每隔几秒一行三个同样的待产用品闪一下「消掉」再换新），JS 在 app.js gamePromo()。
游戏地址在 app.js 的 GAME_URL；为空时整块隐藏（.hide 默认）。点击走 jumpApp()，带身份跳转。 -->
<section class="game-promo hide" id="gamePromo">
<button class="gp-card ripple" id="gpCard" type="button" aria-label="开始玩宝宝消消乐">
<span class="gp-new">新游戏</span>
<span class="gp-text">
<span class="gp-name">宝宝消消乐</span>
<span class="gp-sub">奶瓶、尿不湿、小衣服……<br>三个一样就消掉，边玩边备齐待产包</span>
<span class="gp-cta">开始玩 <svg viewBox="0 0 24 24" width="12" height="12" aria-hidden="true"><path d="M8 5l8 7-8 7z" fill="currentColor"/></svg></span>
</span>
<span class="gp-board" id="gpBoard" aria-hidden="true"></span>
<span class="gp-spark s1" aria-hidden="true">✦</span><span class="gp-spark s2" aria-hidden="true">✦</span><span class="gp-spark s3" aria-hidden="true">✦</span>
</button>
<!-- 3D 婴儿房 · 「透过页面看到后面的房间」（2026-10-01 三版）。用户原话：
「把那个房间整体……铺到它的后边……两个模块中间，它不用点击，从外边其实就能看到这个里边是什么，
整个铺到这个背景的后边，有一个引导进入的按钮，我点进去再弹出这个新的页面」。
做法：这一块没有底色，是页面上开的一道「空隙」；房间图层（#nypLayer）由 JS 每次滚动都对齐到 .screen 的可视区，
所以页面往上滚时房间不跟着走，看起来就是铺在整页背后、从缝里露出来（视差）。上下两条内阴影 = 上下模块压在房间上面。
只有「进去布置」按钮能点（整块不点，免得滚动时误触）。
图：assets/img/nursery-day.jpg / nursery-night.jpg，由「3D 婴儿房」会话（33d6c837）导出的无 UI 渲染
（原图 yef/cover-day.png、cover-night.png，1125×1500，**原尺寸**存 JPG —— 375 宽 × 3 倍屏正好 1125 像素，别再缩，缩到 750 在 iPhone 上会糊（2026-10-01 用户反馈过）)；里面摆的是演示布置，不是用户自己的房间。
底色必须和图边一致：白天 #FFECD8、夜间 #5A5890，否则缝里会露出图片边框。
2026-10-01 晚：3D 婴儿房会话把封面换成「整栋小别墅外景」（婴儿房是二楼剖开那一间），房子占画面中部偏下、上方约 20% 纯底色。
缝高 300→340、图宽 100%→88%（max 420）、上提 40px：缝滚到屏幕中间时屋顶到草坪整栋都露出来，草坪压在玻璃条下面；标题改「我们的家」。
位置：2026-10-01 用户要求和消消乐对调 —— 现在在「此刻」下面、孕期小知识上面（原来在今天的动线和书架之间）。北京时间 19:00–6:00 换夜间图（开灯版）。JS 在 app.js nurseryRender()。 -->
<section class="ny-peek" id="nursery">
<div class="nyp-layer" id="nypLayer" aria-hidden="true"><img id="nypImg" src="assets/img/nursery-day.jpg" alt="" decoding="async"></div>
<span class="nyp-chip">往里看看 · 3D 婴儿房</span>
<div class="nyp-bar">
<div class="nyp-txt"><b id="nyTitle">我们的家</b><span id="nySub">做孕期任务攒兜豆，一件件布置好</span></div>
<button class="nyp-btn" id="nyBtn" type="button">进去布置 <svg viewBox="0 0 24 24" width="11" height="11" aria-hidden="true"><path d="M8 5l8 7-8 7z" fill="currentColor"/></svg></button>
</div>
</section>
<!-- 孕期小知识（2026-09-30）。用户原话：「按她填写的孕周，比如孕 20 周 5 天，给她列出几个小模块，
@@ -452,25 +455,22 @@
⚠️ 纸团飞进树洞的动画靠 Element.animate；不支持的老内核直接跳到「已收好」，不影响收存。 -->
<!-- 「妈妈的树洞」整块已删（2026-10-01 用户要求）。样式与 JS 一并删除，需要恢复看 git 历史 70c9786。 -->
<!-- 3D 婴儿房 · 「透过页面看到后面的房间」（2026-10-01 三版）。用户原话：
「把那个房间整体……铺到它的后边……两个模块中间，它不用点击，从外边其实就能看到这个里边是什么，
整个铺到这个背景的后边，有一个引导进入的按钮，我点进去再弹出这个新的页面」。
做法：这一块没有底色，是页面上开的一道「空隙」；房间图层（#nypLayer）由 JS 每次滚动都对齐到 .screen 的可视区，
所以页面往上滚时房间不跟着走，看起来就是铺在整页背后、从缝里露出来（视差）。上下两条内阴影 = 上下模块压在房间上面。
只有「进去布置」按钮能点（整块不点，免得滚动时误触）。
图：assets/img/nursery-day.jpg / nursery-night.jpg，由「3D 婴儿房」会话（33d6c837）导出的无 UI 渲染
（原图 yef/cover-day.png、cover-night.png，1125×1500，**原尺寸**存 JPG —— 375 宽 × 3 倍屏正好 1125 像素，别再缩，缩到 750 在 iPhone 上会糊（2026-10-01 用户反馈过）)；里面摆的是演示布置，不是用户自己的房间。
底色必须和图边一致：白天 #FFECD8、夜间 #5A5890，否则缝里会露出图片边框。
2026-10-01 晚：3D 婴儿房会话把封面换成「整栋小别墅外景」（婴儿房是二楼剖开那一间），房子占画面中部偏下、上方约 20% 纯底色。
缝高 300→340、图宽 100%→88%（max 420）、上提 40px：缝滚到屏幕中间时屋顶到草坪整栋都露出来，草坪压在玻璃条下面；标题改「我们的家」。
位置：今天的动线 → 这道空隙 → 书架（首页后半段）。北京时间 19:00–6:00 换夜间图（开灯版）。JS 在 app.js nurseryRender()。 -->
<section class="ny-peek" id="nursery">
<div class="nyp-layer" id="nypLayer" aria-hidden="true"><img id="nypImg" src="assets/img/nursery-day.jpg" alt="" decoding="async"></div>
<span class="nyp-chip">往里看看 · 3D 婴儿房</span>
<div class="nyp-bar">
<div class="nyp-txt"><b id="nyTitle">我们的家</b><span id="nySub">做孕期任务攒兜豆，一件件布置好</span></div>
<button class="nyp-btn" id="nyBtn" type="button">进去布置 <svg viewBox="0 0 24 24" width="11" height="11" aria-hidden="true"><path d="M8 5l8 7-8 7z" fill="currentColor"/></svg></button>
</div>
<!-- 宝宝消消乐 · 推广入口（2026-09-30）。用户原话：「做了一个消消乐小游戏（待产清单主题），
放到首页展示并推广，宝妈们业余时间玩，名字叫宝宝消消乐」。
2026-10-01 用户要求和 3D 婴儿房对调位置：现在在「今天的动线」和书架之间（原来在工具托盘正下方）。右侧 3×3 小棋盘是纯装饰动画
（每隔几秒一行三个同样的待产用品闪一下「消掉」再换新），JS 在 app.js gamePromo()。
游戏地址在 app.js 的 GAME_URL；为空时整块隐藏（.hide 默认）。点击走 jumpApp()，带身份跳转。 -->
<section class="game-promo hide" id="gamePromo">
<button class="gp-card ripple" id="gpCard" type="button" aria-label="开始玩宝宝消消乐">
<span class="gp-new">新游戏</span>
<span class="gp-text">
<span class="gp-name">宝宝消消乐</span>
<span class="gp-sub">奶瓶、尿不湿、小衣服……<br>三个一样就消掉，边玩边备齐待产包</span>
<span class="gp-cta">开始玩 <svg viewBox="0 0 24 24" width="12" height="12" aria-hidden="true"><path d="M8 5l8 7-8 7z" fill="currentColor"/></svg></span>
</span>
<span class="gp-board" id="gpBoard" aria-hidden="true"></span>
<span class="gp-spark s1" aria-hidden="true">✦</span><span class="gp-spark s2" aria-hidden="true">✦</span><span class="gp-spark s3" aria-hidden="true">✦</span>
</button>
</section>
<!-- 模块三 · 书架卡带。