宝宝的房间做孕期任务攒兜豆,一件件布置好
diff --git a/js/app.js b/js/app.js
index e390097..883721b 100644
--- a/js/app.js
+++ b/js/app.js
@@ -3,7 +3,7 @@
(function () {
'use strict';
/* 页面版本号(YYMMDD+序号):显示在「关于兜爸心选」页底部;bump 时同步 head 注释与 ?v= */
- var VER = '26100112';
+ var VER = '26100113';
const $ = (s, c) => (c || document).querySelector(s);
const $$ = (s, c) => Array.from((c || document).querySelectorAll(s));
@@ -3140,7 +3140,10 @@
place();
const tick = () => {
const h = new Date(Date.now() + 8 * 3600e3).getUTCHours(); // 北京时间
- sec.classList.toggle('is-night', h >= 19 || h < 6);
+ const night = h >= 19 || h < 6;
+ sec.classList.toggle('is-night', night);
+ const img = $('#nypImg'), src = 'assets/img/nursery-' + (night ? 'night' : 'day') + '.jpg';
+ if (img.getAttribute('src') !== src) img.setAttribute('src', src);
};
tick(); setInterval(tick, 600e3);
nurseryRender();
diff --git a/mama-box.css b/mama-box.css
index bc2dd03..fae12aa 100644
--- a/mama-box.css
+++ b/mama-box.css
@@ -566,9 +566,8 @@ a.skip:focus{left:16px;top:16px}
::after = 上下模块压在房间上的阴影,要盖在图层之上、按钮之下。 */
.ny-peek{position:relative;margin:16px -26px 0;height:300px;overflow:hidden;background:#FFECD8}
.nyp-layer{position:absolute;left:0;top:0;width:100%;height:812px;will-change:transform;
- display:flex;align-items:center;justify-content:center;background:radial-gradient(ellipse at 50% 48%,#FFFDFB 0%,#FFF3E8 40%,#FFECD8 72%)}
-.nyp-layer img{display:block;width:100%;max-width:440px;height:auto;
- -webkit-mask-image:linear-gradient(180deg,transparent 0,#000 14%,#000 86%,transparent 100%);mask-image:linear-gradient(180deg,transparent 0,#000 14%,#000 86%,transparent 100%)}
+ display:flex;align-items:center;justify-content:center;background:#FFECD8}
+.nyp-layer img{display:block;width:100%;max-width:480px;height:auto;margin-top:-64px}
.ny-peek::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:1;
box-shadow:inset 0 16px 18px -14px rgba(120,70,50,.28),inset 0 -16px 18px -14px rgba(120,70,50,.28)}
.nyp-chip{position:absolute;left:26px;top:16px;z-index:2;font-size:11px;font-weight:800;color:#E0708A;letter-spacing:.3px;
@@ -585,9 +584,8 @@ a.skip:focus{left:16px;top:16px}
animation:nypNudge 2.8s ease-in-out infinite}
.nyp-btn:active{transform:scale(.96)}
@keyframes nypNudge{0%,80%,100%{transform:translateX(0)}86%{transform:translateX(3px)}92%{transform:translateX(0)}}
-/* 夜间:房间整体压暗,中间留一团暖灯 */
-.ny-peek.is-night .nyp-layer::after{content:"";position:absolute;inset:0;
- background:radial-gradient(ellipse at 50% 46%,rgba(255,200,120,.18) 0%,rgba(46,32,70,.32) 45%,rgba(30,22,52,.62) 100%)}
+/* 夜间:JS 换成开灯版图,底色跟着换成图边的 #5A5890 */
+.ny-peek.is-night,.ny-peek.is-night .nyp-layer{background:#5A5890}
.ny-peek.is-night .nyp-bar{background:rgba(58,47,79,.78)}
.ny-peek.is-night .nyp-txt b{color:#FFF3F5}
.ny-peek.is-night .nyp-txt span{color:#D9C5D0}