diff --git a/index.html b/index.html
index 29a5e29..dd3667f 100644
--- a/index.html
+++ b/index.html
@@ -7,7 +7,7 @@
diff --git a/js/app.js b/js/app.js
index 528a8f7..ab5f363 100644
--- a/js/app.js
+++ b/js/app.js
@@ -3,7 +3,7 @@
(function () {
'use strict';
/* 页面版本号(YYMMDD+序号):显示在「关于兜爸心选」页底部;bump 时同步 head 注释与 ?v= */
- var VER = '26100170';
+ var VER = '26100171';
const $ = (s, c) => (c || document).querySelector(s);
const $$ = (s, c) => Array.from((c || document).querySelectorAll(s));
@@ -3387,7 +3387,7 @@
}).join('');
}
function paintCard(it, i) {
- card.innerHTML = '
' + (it.mine ? '我说的' : '') + esc(it.text) + '
' +
+ card.innerHTML = '
' + (it.mine ? '我说的' : '刚划过的那颗星说') + '' + esc(it.text) + '
' +
'
孕 ' + it.week + ' 周的妈妈 · ' + esc(it.ago) + '' + hugBtn(it) + '
' +
'
';
card.classList.remove('show');
@@ -3397,13 +3397,25 @@
const au = $$('#whvAura i');
au[0].style.backgroundColor = pal[0]; au[1].style.backgroundColor = pal[1];
}
- function stopMeteor() {
+ /* 七改(用户:「点一个流星底下就出现文字,好像就不用看流星上面写什么了」):
+ 内容卡改到流星划完才浮出来(小字回放 + 抱抱),先看流星、再看卡;中途换星就不出旧卡。 */
+ function stopMeteor(done) {
if (!mt) return;
cancelAnimationFrame(mt.raf);
mt.el.remove();
mt.btn.classList.remove('flare', 'gone');
mt.btn.classList.add('seen');
+ const m = mt;
mt = null;
+ if (done) paintCard(m.it, m.i);
+ }
+ /* 第一次进来:一闪一闪的提示,点过一次星星就永久收起 */
+ const TIP = 'mmbox.whtip.v1';
+ const tipEl = $('#wskTip');
+ function tip(on) {
+ if (on) { try { on = !localStorage.getItem(TIP); } catch (e) {} }
+ else { try { localStorage.setItem(TIP, '1'); } catch (e) {} }
+ tipEl.classList.toggle('show', !!on);
}
function launch(i) {
const it = list()[i - 1];
@@ -3412,12 +3424,13 @@
cur = i;
seen.add(it.id);
$$('.wsk-st.hint', page).forEach(x => x.classList.remove('hint'));
+ tip(false);
+ card.classList.remove('show');
$$('.wsk-st.cur', page).forEach(x => x.classList.remove('cur'));
- paintCard(it, i);
const btn = $('.wsk-st[data-go="' + i + '"]', page);
- if (!btn) return;
+ if (!btn) { paintCard(it, i); return; }
btn.classList.add('cur');
- if (RM) { btn.classList.add('seen'); return; }
+ if (RM) { btn.classList.add('seen'); paintCard(it, i); return; }
const pr = page.getBoundingClientRect(), br = btn.getBoundingClientRect();
const x0 = br.left + br.width / 2 - pr.left, y0 = br.top + br.height / 2 - pr.top;
/* 瞄准左下(屏幕左边外、六成高处):越靠左起步角度越陡,保证在屏幕里拖得够长 */
@@ -3434,9 +3447,9 @@
const body = off.length ? off[n - 1] + fs[n - 1] * .6 : gap;
const el = document.createElement('div');
el.className = 'wmt' + (it.mine ? ' mine' : '');
- el.innerHTML = '
' + chars.map((c, k) => '
' + esc(c) + '').join('');
+ el.innerHTML = '
' + chars.map((c, k) => '
' + esc(c) + '').join('');
page.insertBefore(el, card);
- const line = el.children[0], core = el.children[1], head = el.children[2], sp = $$('span', el);
+ const line = el.children[0], head = el.children[1], sp = $$('span', el);
line.style.height = (f1 * 1.9).toFixed(0) + 'px';
line.style.marginTop = (-f1 * .95).toFixed(0) + 'px';
/* 节奏:星闪 420ms → 以约 90px/s 起步并缓缓提速,整句拖出来后再留 0.7 秒给眼睛 → 加速度猛增,1.3 秒内唰出屏幕 */
@@ -3454,8 +3467,8 @@
const st = Math.min(1.6, Math.max(0, (v - .25) / .5));
head.style.transform = at + ' scaleX(' + (1 + st * 1.6).toFixed(2) + ')';
const tl = Math.min(s, body + 70 + 260 * st);
- line.style.width = core.style.width = tl.toFixed(0) + 'px';
- line.style.transform = core.style.transform = at;
+ line.style.width = tl.toFixed(0) + 'px';
+ line.style.transform = at;
const fade = u < .6 ? 1 : Math.max(0, 1 - (u - .6) / .4);
el.style.setProperty('--bl', (st * 1.6).toFixed(1) + 'px');
sp.forEach((c, k) => {
@@ -3464,10 +3477,10 @@
c.style.opacity = (Math.min(1, d / 26) * fade).toFixed(2);
c.style.transform = 'translate(' + (x0 + dx * d).toFixed(1) + 'px,' + (y0 + dy * d).toFixed(1) + 'px) translate(-50%,-50%) rotate(' + rot.toFixed(1) + 'deg)';
});
- if (u >= 1) { stopMeteor(); return; }
+ if (u >= 1) { stopMeteor(true); return; }
mt.raf = requestAnimationFrame(frame);
};
- mt = { el, btn, raf: requestAnimationFrame(frame) };
+ mt = { el, btn, it, i, raf: requestAnimationFrame(frame) };
}
function nextStar() {
const l = list(), n = l.length;
@@ -3507,6 +3520,7 @@
cur = 0;
card.classList.remove('show');
paintPage();
+ tip(true);
page.classList.add('show');
page.setAttribute('aria-hidden', 'false');
drawer(false);
diff --git a/mama-box.css b/mama-box.css
index 19736ad..a7e3d68 100644
--- a/mama-box.css
+++ b/mama-box.css
@@ -3938,3 +3938,20 @@ a.skip:focus{left:16px;top:16px}
.wsk-st.flare i{animation:wskFlare2 .42s ease-out forwards}
@keyframes wskFlare2{0%{transform:scale(1)}55%{transform:scale(3.4);box-shadow:0 0 26px 14px #fff,0 0 60px 24px rgba(230,210,255,.7)}100%{transform:scale(2);box-shadow:0 0 20px 10px #fff}}
.wsk-st.gone{opacity:0;transition:opacity .5s}
+/* 七改:去掉中线;字改细体更清楚;首次提示一闪一闪;内容卡在流星划完才出、改小 */
+.wmt span{font-weight:300;letter-spacing:.5px;text-shadow:0 0 6px rgba(255,255,255,.45),0 0 14px rgba(200,170,255,.45)}
+.wmt.mine span{font-weight:300}
+.wsk-tip{position:absolute;left:0;right:0;top:56%;z-index:3;margin:0;display:flex;align-items:center;justify-content:center;gap:8px;
+ font-size:14px;font-weight:300;letter-spacing:2px;color:#FFF3E2;pointer-events:none;opacity:0;visibility:hidden;transition:opacity .4s,visibility .4s;
+ text-shadow:0 0 10px rgba(255,220,180,.7)}
+.wsk-tip.show{visibility:visible;animation:wskBlink 1.8s ease-in-out infinite}
+.wsk-tip i{width:6px;height:6px;border-radius:50%;background:#fff;box-shadow:0 0 8px 3px rgba(255,235,210,.9)}
+@keyframes wskBlink{0%,100%{opacity:.25}50%{opacity:1}}
+.wsc{padding:12px 16px 11px;border-radius:16px}
+.wsc-k{display:block;font-size:11px;color:rgba(255,226,190,.7);letter-spacing:1px}
+.wsc-q{margin-top:4px;font-size:15px;line-height:1.5;font-weight:400;color:rgba(255,255,255,.92);padding-right:70px}
+.wsc-m{margin-top:6px;font-size:11.5px}
+.wsc-next{top:10px;height:26px}
+.wsc .whp-hug{height:26px;padding:0 10px;font-size:12px}
+@media (prefers-reduced-motion:reduce){.wsk-tip.show{animation:none;opacity:1}}
+.wmt-l{filter:blur(9px);background:linear-gradient(90deg,rgba(255,255,255,.5),rgba(220,200,255,.22) 30%,rgba(255,180,200,.08) 70%,transparent)}