diff --git a/guangchang/ceshi/index.html b/guangchang/ceshi/index.html index c28194c..4071026 100644 --- a/guangchang/ceshi/index.html +++ b/guangchang/ceshi/index.html @@ -54,74 +54,39 @@ mark{background:linear-gradient(transparent 62%,var(--c20) 0);color:inherit;padd .sh2 span{margin-left:auto;font-size:12.5px;color:var(--sub)} /* ---------- ① 开始 ---------- */ -/* 11-03 用户:测试首页要一屏放下,「开始测试」不用往下滑就能看到 → 头图缩成右上小图、信息横排、结果类型一行四个;按钮再贴底兜底(小屏/有上次结果时) */ +/* 11-03 用户发参考图(依恋型人格测试):「每个测试的首页内容不要太多,简明清晰」→ 全部居中、一屏放下: + 顶部分组小胶囊 → 插画(圆形 + 身后两团柔光 + 小圆点)→ 大标题 → 「N 道题 · M 分钟」+ 一句话 → 两三个小标签 → 大号胶囊按钮 → 底部一行小字。 + 原来的「简介段落」「N 种结果插画宫格」撤掉(结果插画在结果页「其他结果」里照样能看到)。 */ #vStart{margin-top:-48px} -.hero{position:relative;overflow:hidden;padding:58px 20px 16px;background:linear-gradient(160deg,var(--cbg) 0%,#fff 78%)} -.hero .o1,.hero .o2{position:absolute;border-radius:50%;background:var(--c10);pointer-events:none} -.hero .o1{width:220px;height:220px;right:-80px;top:-80px} -.hero .o2{width:120px;height:120px;left:-50px;bottom:-30px;background:var(--c06)} -.hero .eb{position:relative;display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 11px;border-radius:99px;background:#fff;color:var(--c);font-size:12px;font-weight:700;letter-spacing:.5px;box-shadow:0 2px 8px var(--c10)} -.hero h1{position:relative;z-index:1;margin-top:10px;padding-right:118px;font-size:23px;font-weight:800;line-height:1.38;color:var(--ink);letter-spacing:.5px;text-wrap:balance} -.hero h1 small{display:block;font-size:14px;font-weight:700;color:var(--txt);letter-spacing:1px} -.hero .meta{position:relative;z-index:1;display:flex;flex-wrap:wrap;gap:6px 14px;margin-top:12px} -.hero .meta span{display:flex;align-items:center;gap:4px;font-size:12.5px;color:var(--txt);line-height:1.4} -.hero .meta .ic{width:15px;height:15px;color:var(--c)} -.hero .meta b{color:var(--ink);font-weight:800} -.hero .pic{position:absolute;z-index:1;right:18px;top:62px;width:100px;height:100px;object-fit:cover;object-position:center 30%;border-radius:24px;border:3px solid #fff;box-shadow:0 8px 20px var(--c20);background:var(--cbg)} -.lead{margin-top:4px;padding:12px 14px;border-radius:16px;background:var(--soft);font-size:13.5px;line-height:1.7;color:var(--txt)} -.lastr{display:flex;align-items:center;gap:10px;margin-top:10px;padding:8px 12px;border-radius:14px;background:var(--cbg);font-size:13px;color:var(--ink)} -.lastr img{width:30px;height:30px;border-radius:50%;object-fit:cover;border:2px solid #fff} +#vStart.on{display:flex;flex-direction:column;align-items:center;min-height:100vh;min-height:100dvh;padding:calc(58px + env(safe-area-inset-top)) 28px calc(18px + env(safe-area-inset-bottom));text-align:center; + background:radial-gradient(120% 60% at 50% 0%,var(--cbg) 0%,rgba(255,255,255,0) 70%),linear-gradient(180deg,#FFFBF8,#fff 70%)} +.s-pill{display:inline-flex;align-items:center;gap:8px;height:30px;padding:0 16px;border-radius:99px;background:var(--c06);color:var(--c);font-size:13px;font-weight:700;letter-spacing:2px} +.s-pill i{width:3px;height:3px;border-radius:50%;background:currentColor;opacity:.6} +.s-art{position:relative;width:min(64vw,250px);aspect-ratio:1;margin:clamp(14px,4vh,34px) 0 0} +.s-art .g1,.s-art .g2{position:absolute;border-radius:50%;filter:blur(2px)} +.s-art .g1{left:-14%;top:-6%;width:72%;height:72%;background:radial-gradient(circle at 40% 40%,var(--c2),var(--c06) 70%)} +.s-art .g2{right:-16%;bottom:-8%;width:66%;height:66%;background:radial-gradient(circle at 55% 55%,#E3EEDD,rgba(227,238,221,.25) 70%)} +.s-art .dt{position:absolute;width:8px;height:8px;border-radius:50%;background:var(--c20)} +.s-art .d1{right:-4%;top:6%}.s-art .d2{left:-10%;bottom:16%;width:7px;height:7px}.s-art .d3{right:18%;bottom:-6%;width:6px;height:6px} +.s-art img{position:relative;width:100%;height:100%;border-radius:50%;object-fit:cover;object-position:center 32%;border:5px solid #fff;box-shadow:0 14px 34px -10px var(--c20);background:var(--cbg)} +.s-art .hb{position:absolute;right:2%;bottom:6%;display:grid;place-items:center;width:46px;height:46px;border-radius:50%;background:#fff;color:var(--c);box-shadow:0 6px 16px -4px var(--c20)} +.s-art .hb .ic{width:24px;height:24px;stroke-width:2} +#sTitle{margin-top:clamp(18px,4.2vh,36px);font-size:clamp(25px,7.4vw,30px);font-weight:900;line-height:1.3;color:var(--ink);letter-spacing:2px;text-wrap:balance} +.s-meta{margin-top:10px;font-size:15px;color:var(--sub);letter-spacing:.5px} +.s-meta b{font-weight:600;color:var(--txt)} +.s-line{margin-top:4px;font-size:15.5px;color:var(--txt);letter-spacing:.5px} +.s-chips{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:clamp(14px,3vh,26px)} +.s-chips span{display:inline-flex;align-items:center;gap:4px;height:32px;padding:0 15px;border-radius:99px;background:#fff;border:1px solid var(--line);box-shadow:0 3px 10px -4px rgba(0,0,0,.08);font-size:13px;color:var(--txt)} +.s-chips .hot{color:#F0704F;font-weight:700} +.s-chips .hot svg{width:13px;height:13px} +.s-go{width:100%;margin-top:auto;padding-top:clamp(18px,4vh,40px)} +#startBtn{height:56px;font-size:18px;letter-spacing:4px;background:linear-gradient(90deg,var(--c),color-mix(in srgb,var(--c) 78%,#fff));box-shadow:0 12px 26px -10px var(--c)} +#startBtn .ic{display:none} +.s-note{margin-top:14px;font-size:12.5px;color:#A9AEB8;letter-spacing:1px} +.lastr{display:inline-flex;align-items:center;gap:8px;margin-top:12px;padding:5px 12px 5px 5px;border-radius:99px;background:var(--c06);font-size:12.5px;color:var(--ink)} +.lastr img{width:24px;height:24px;border-radius:50%;object-fit:cover;border:2px solid #fff} .lastr b{color:var(--c)} -.lastr span{flex:1} -.types{margin-top:16px} -.types .sh2 b{font-size:15.5px} -.tgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px 6px;margin-top:-2px} -.tcard{display:flex;flex-direction:column;align-items:center;gap:5px;min-width:0;text-align:center} -.tcard img{flex:none;width:46px;height:46px;border-radius:50%;object-fit:cover;object-position:center 26%;border:2px solid #fff;box-shadow:0 2px 8px var(--c10);background:var(--cbg)} -.tcard span{min-width:0;width:100%} -.tcard b{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;font-size:11.5px;font-weight:600;color:var(--ink);line-height:1.35;word-break:break-all} -.tcard small{display:none} -.startbox{position:sticky;bottom:0;z-index:5;margin:6px -20px 0;padding:12px 20px calc(4px + env(safe-area-inset-bottom));text-align:center;background:linear-gradient(rgba(255,255,255,0),#fff 14px)} -.startbox .note{margin-top:7px;font-size:12px;color:var(--sub)} -/* 11-03 用户:一屏放下后底下空太多 → 开始页撑满一屏(减去底部免责一行),多出的高度均分到各块之间;屏越高图越大 */ -#vStart.on{display:flex;flex-direction:column;min-height:calc(100vh - 69px);min-height:calc(100dvh - 69px - env(safe-area-inset-bottom))} -#vStart .wrap{flex:1;display:flex;flex-direction:column;width:100%} -#vStart .lead{margin-top:clamp(4px,(100dvh - 640px) * .12 + 4px,22px)} -#vStart .types{margin-top:auto;padding-top:16px} -#vStart .startbox{margin-top:auto} -#vStart .types + .startbox{padding-top:clamp(12px,(100dvh - 640px) * .25 + 12px,40px)} -@media (min-height:680px){ - .hero{padding-top:66px;padding-bottom:22px} - .hero h1{padding-right:132px;font-size:24px} - .hero .pic{top:70px;width:116px;height:116px;border-radius:28px} - .hero .meta{margin-top:16px} - .lead{padding:14px 16px;font-size:14px;line-height:1.8} - .tcard img{width:56px;height:56px} - .tcard b{font-size:12.5px} - .tgrid{gap:12px 6px} -} -@media (min-height:760px){ - .hero{padding-top:74px;padding-bottom:28px} - .hero h1{padding-right:146px;font-size:26px} - .hero h1 small{font-size:15px;margin-bottom:2px} - .hero .pic{top:76px;width:130px;height:130px} - .hero .meta{margin-top:20px} - .hero .meta span{font-size:13.5px} - .types .sh2 b{font-size:17px} - .tcard img{width:64px;height:64px} - .tcard b{font-size:13px} - .tgrid{gap:16px 6px} - .startbox .note{margin-top:10px;font-size:12.5px} -} -@media (min-height:790px){ - .hero{padding-top:80px;padding-bottom:32px} - .hero h1{padding-right:160px;font-size:28px} - .hero .pic{top:80px;width:146px;height:146px;border-radius:32px} - .lead{padding:16px 18px;font-size:14.5px} - .tcard{gap:6px} - .tcard img{width:70px;height:70px} - .tcard small{display:block;font-size:11.5px;color:var(--sub);line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} -} +@media (max-height:700px){.s-art{width:min(48vw,180px)}#sTitle{font-size:23px}.s-line{font-size:14.5px}.s-chips span{height:29px}} /* ---------- ② 答题 ---------- */ #vQuiz{padding-top:4px} @@ -288,30 +253,18 @@ mark{background:linear-gradient(transparent 62%,var(--c20) 0);color:inherit;padd 孕妈广场 · 测一测 - +
-
- - -

-
- 题 · 约分钟 - - -
- -
-
-

+ +
+

+

道题 · 分钟

+

+
+
+ -
-
-
-
-
- -

-
+

@@ -367,8 +320,8 @@ mark{background:linear-gradient(transparent 62%,var(--c20) 0);color:inherit;padd
- - + + - - - + + + + + @@ -124,6 +125,8 @@ 离「宝宝来信」卡顶 234 留 16px(和旧版一样)。宽度不超过 x≈197(旧玻璃卡的右缘),不伸进宝宝插画。 JS 只认 id:heroLeft / heroWeek / heroWeekU / heroPlus / heroBar / heroFruit / heroSize / heroWho / heroDays。 -->
+ +
距离见面还有 -- 天
--周
@@ -2556,16 +2559,17 @@ - + - + + - + diff --git a/js/app.js b/js/app.js index dcd0c18..9265193 100644 --- a/js/app.js +++ b/js/app.js @@ -3,7 +3,7 @@ (function () { 'use strict'; /* 页面版本号(YYMMDD+序号):显示在「关于兜爸心选」页底部;bump 时同步 head 注释与 ?v= */ - var VER = '26110266'; + var VER = '26110267'; const $ = (s, c) => (c || document).querySelector(s); const $$ = (s, c) => Array.from((c || document).querySelectorAll(s)); @@ -1832,6 +1832,9 @@ $('#heroSize').textContent = o.size || ''; $('#heroWeekU').textContent = o.unit == null ? '周' : o.unit; $('.hero-pane').classList.toggle('is-born', !!o.born); + /* 11-03 用户:「首页头图小孩左边做成倒计时的感觉」→ 孕期且有天数时换成翻页数字牌 + 时分秒走字(js/hero-cd.js),其余状态照旧 */ + window.__mbHeroLeft = o.left > 0 ? o.left : 0; + if (window.__mbHeroCd) window.__mbHeroCd(window.__mbHeroLeft); bar.style.width = '0%'; requestAnimationFrame(() => requestAnimationFrame(() => { bar.style.width = Math.max(0, Math.min(100, o.pct || 0)) + '%'; })); } @@ -2095,6 +2098,7 @@ const sz = babySize(week); setHero({ due: left > 0 ? '距离见面还有 ' + left + ' 天' : '宝宝随时会来见你', + left: left, emoji: sz.emoji, hi: window.handIcons && (handIcons.week(week) || {}).id, size: '像' + sz.name.replace(/^一[个颗根只串把粒条棵颗]/, ''), pct: pct }); } diff --git a/js/gch/v4.js b/js/gch/v4.js index 3ae9ea8..6eac337 100644 --- a/js/gch/v4.js +++ b/js/gch/v4.js @@ -231,5 +231,5 @@ } /* feed.js 首页默认不加载(index.html 只引了 topics.js),这里按需拉一次 */ if (window.GC_FEED) init(); - else { var fs = document.createElement('script'); fs.src = 'guangchang/feed.js?v=26110266'; fs.onload = fs.onerror = init; document.body.appendChild(fs); } + else { var fs = document.createElement('script'); fs.src = 'guangchang/feed.js?v=26110267'; fs.onload = fs.onerror = init; document.body.appendChild(fs); } })(); diff --git a/js/gch/v6.js b/js/gch/v6.js index a9c1dfb..6b96a5d 100644 --- a/js/gch/v6.js +++ b/js/gch/v6.js @@ -6,9 +6,9 @@ (function () { var sec = document.getElementById('gcHome'); if (!sec) return; - var l = document.createElement('link'); l.rel = 'stylesheet'; l.href = 'js/gch/v4.css?v=26110266'; + var l = document.createElement('link'); l.rel = 'stylesheet'; l.href = 'js/gch/v4.css?v=26110267'; document.head.appendChild(l); - var s = document.createElement('script'); s.src = 'js/gch/v4.js?v=26110266'; + var s = document.createElement('script'); s.src = 'js/gch/v4.js?v=26110267'; s.onload = function () { if (sec.querySelector('.g4-foot')) merge(); else sec.addEventListener('gc4-ready', merge, { once: true }); }; /* v4 要先拉 feed.js 才渲染 */ document.body.appendChild(s); diff --git a/js/hero-cd.css b/js/hero-cd.css new file mode 100644 index 0000000..c1a0cd9 --- /dev/null +++ b/js/hero-cd.css @@ -0,0 +1,36 @@ +/* 首页头图倒计时(11-03,见 js/hero-cd.js)。只在 .hero-pane.cd 时生效;关掉(未填预产期 / 已出生)就是原来的样子。 + 竖向:小标 18 → 数字牌 46 → 时分秒 20 → 孕周一行 20 → 进度条 16,加间距后和旧版总高一样,下面「我的孕期工具」卡不会被顶下去。 */ +.hi-cd{display:none} +.hero-pane.cd{margin-top:2px} +.hero-pane.cd .hi-due{display:none} +.hero-pane.cd .hi-cd{display:flex;flex-direction:column;align-items:flex-start} +.cd-lb{display:inline-flex;align-items:center;gap:5px;height:18px;font-size:12.5px;font-weight:700;color:#fff;letter-spacing:.5px;white-space:nowrap} +.cd-lb svg{width:12px;height:12px;color:#FFD9C7;animation:hiBeat 1.6s ease-in-out infinite} +.cd-row{display:flex;align-items:flex-end;gap:6px;margin-top:5px} +.cd-d{display:flex;gap:4px} +/* 一位一块牌:上半亮、下半略暗,中间一道翻页缝 + 两侧小铆点,像机场翻牌钟 */ +.cd-d i{position:relative;display:block;width:34px;height:46px;border-radius:9px;font-style:normal; + background:linear-gradient(180deg,rgba(255,255,255,.34) 0 50%,rgba(255,255,255,.22) 50% 100%); + border:1px solid rgba(255,255,255,.45);box-shadow:0 6px 14px -6px rgba(120,30,10,.45),inset 0 1px 0 rgba(255,255,255,.4); + -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);overflow:hidden;perspective:200px} +.cd-d i::before{content:"";position:absolute;left:0;right:0;top:50%;height:1px;background:rgba(150,60,35,.28);z-index:2} +.cd-d i::after{content:"";position:absolute;left:-2px;right:-2px;top:calc(50% - 2px);height:4px;z-index:2; + background:radial-gradient(circle at 2px 2px,rgba(150,60,35,.35) 1.5px,transparent 2px) left/4px 4px no-repeat,radial-gradient(circle at 2px 2px,rgba(150,60,35,.35) 1.5px,transparent 2px) right/4px 4px no-repeat} +.cd-d span{display:block;font-size:34px;font-weight:900;line-height:46px;text-align:center;color:#fff;font-variant-numeric:tabular-nums; + text-shadow:0 2px 0 rgba(140,50,28,.3),0 4px 10px rgba(120,30,10,.22)} +.cd-d i.flip span{animation:cdFlip .55s cubic-bezier(.3,.7,.4,1)} +@keyframes cdFlip{0%{transform:rotateX(-90deg);opacity:.2}60%{transform:rotateX(12deg);opacity:1}100%{transform:none}} +.cd-row em{margin-bottom:3px;font-style:normal;font-size:17px;font-weight:800;color:#FFE6BF} +/* 时分秒:小毛玻璃格 + 汉字单位 */ +.cd-tk{display:flex;align-items:center;gap:2px;margin-top:6px;height:20px;white-space:nowrap} +.cd-tk b{min-width:22px;height:20px;padding:0 3px;border-radius:5px;background:rgba(110,35,18,.24);color:#fff;font-size:12.5px;font-weight:800;line-height:20px;text-align:center;font-variant-numeric:tabular-nums;text-shadow:none} +.cd-tk i{margin:0 3px 0 1px;font-style:normal;font-size:11px;font-weight:700;color:#FFE6BF} +/* 孕周退成一行小字「孕 26 周 +6天」,不再和倒计时抢主角 */ +.hero-pane.cd .hi-week{height:20px;margin-top:5px;align-items:center} +.hero-pane.cd .hi-week::before{content:"孕";margin-right:3px;font-size:13px;font-weight:800;color:#FFE6BF} +.hero-pane.cd .hi-week b{font-size:17px;line-height:20px;letter-spacing:0;text-shadow:0 1px 3px rgba(120,30,10,.28)} +.hero-pane.cd .hi-unit{flex-direction:row;align-items:center;margin:0 0 0 3px} +.hero-pane.cd .hi-unit em{font-size:13px} +.hero-pane.cd .hi-unit span{margin:0 0 0 5px;padding:0 6px;font-size:10.5px;line-height:16px} +.hero-pane.cd .hi-prog{margin-top:5px} +@media (prefers-reduced-motion:reduce){.cd-d i.flip span,.cd-lb svg{animation:none}} diff --git a/js/hero-cd.js b/js/hero-cd.js new file mode 100644 index 0000000..b6a6700 --- /dev/null +++ b/js/hero-cd.js @@ -0,0 +1,41 @@ +/* 首页头图倒计时(11-03 用户:「头图小孩左边改成倒计时那种感觉」) + · 天数做成翻页数字牌(每位一块毛玻璃牌,中间一道翻页缝),变化时逐位翻一下; + · 下面一行「时 分 秒」每秒走字 = 到今天 24:00 还剩多少 —— 和天数合起来就是「到预产期那天结束」,跟别处的「还有 N 天」对得上; + · 数据只认 app.js setHero 传进来的天数(window.__mbHeroLeft),0 = 不开倒计时(未填预产期 / 已出生 / 已到预产期),整块隐藏、回到旧样式。 */ +(function () { + var box = document.getElementById('heroCd'), pane = box && box.closest('.hero-pane'); + if (!box) return; + var cur = '', timer = 0; + var p2 = function (n) { return (n < 10 ? '0' : '') + n; }; + box.innerHTML = + '距离和宝宝见面还有' + + '
天
' + + '
--时--分--秒
'; + var D = document.getElementById('heroCdD'), H = document.getElementById('heroCdH'), M = document.getElementById('heroCdM'), S = document.getElementById('heroCdS'); + function tick() { + var n = new Date(), e = new Date(n.getFullYear(), n.getMonth(), n.getDate() + 1), r = Math.max(0, Math.floor((e - n) / 1000)); + H.textContent = p2(Math.floor(r / 3600)); M.textContent = p2(Math.floor(r / 60) % 60); S.textContent = p2(r % 60); + } + function setDays(v) { + var s = String(v), old = cur; cur = s; + if (D.children.length !== s.length) D.innerHTML = s.split('').map(function () { return ''; }).join(''); + s.split('').forEach(function (ch, k) { + var c = D.children[k], sp = c.firstChild; + if (sp.textContent === ch) return; + sp.textContent = ch; + if (old) { c.classList.remove('flip'); void c.offsetWidth; c.classList.add('flip'); } + }); + } + window.__mbHeroCd = function (left) { + left = +left || 0; + var on = left > 0; + pane && pane.classList.toggle('cd', on); + if (!on) { clearInterval(timer); timer = 0; cur = ''; return; } + setDays(left); + tick(); + if (!timer) timer = setInterval(tick, 1000); + }; + /* 停在后台时不走字,回前台立刻补一次 */ + document.addEventListener('visibilitychange', function () { if (!document.hidden && timer) tick(); }); + if (window.__mbHeroLeft != null) window.__mbHeroCd(window.__mbHeroLeft); +})(); diff --git a/js/kit.js b/js/kit.js index af5a080..cd4cae3 100644 --- a/js/kit.js +++ b/js/kit.js @@ -9,7 +9,7 @@ if (/[?&]kit=0(?:&|$)/.test(location.search)) return; var box = document.getElementById('kit'), sec = document.getElementById('kitHome'); if (!box || !sec) return; - var V = '26110266'; + var V = '26110267'; var l = document.createElement('link'); l.rel = 'stylesheet'; l.href = 'js/kit.css?v=' + V; document.head.appendChild(l); document.documentElement.classList.add('has-kit'); @@ -21,6 +21,8 @@ var s = q.toString(); return (s ? '?' + s : '') + location.hash; } function wan(n) { return n >= 1e6 ? Math.round(n / 1e4) + '万' : n >= 1e4 ? (Math.round(n / 1e3) / 10) + '万' : String(Math.round(n)); } /* 百万以上取整,卡片窄放得下 */ + /* 入口专用:万为单位、必带一位小数,碰上整数(如 68.0)挪 0.3,避免看着像凑的整数 */ + function wanX(n) { var v = Math.round(n / 1e3) / 10; if (v % 1 === 0) v = +(v + .3).toFixed(1); return v.toFixed(1) + '万'; } function total() { var p = window.__mbPulse; return (p && p.total && +p.total.value) || 1510000; } var FIRE = ''; @@ -38,11 +40,13 @@ '
大家都在用
'; 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 = wan(n); } - /* 人数口径:测过 = 30 个测试 gcTested 之和(同广场「累计 N 万人次参与」);看过 = 「此刻」总人数 × 0.62;算过 = 4 个计算器 heat 之和 × 总人数(同 topic/jisuan) */ + function setNum(k, n) { var e = box.querySelector('.e-' + k + ' .kit-n i'); if (e && n) e.textContent = wanX(n); } + /* 人数口径(11-03 改):测过 = 30 个测试 gcTested 之和 × .456;看过 = 「此刻」总人数 × .574;算过 = 4 个计算器 heat 之和 × 总人数(同 topic/jisuan) */ function nums() { - if (window.GC_TESTS_META && window.gcTested) { setNum('qz', window.GC_TESTS_META.reduce(function (a, x) { return a + window.gcTested(x.id); }, 0)); setCnt('qz', window.GC_TESTS_META.length + ' 个测试'); } - setNum('qa', total() * .62); + /* 11-03 用户:「三个入口的人数太大,几十万就行,要有零有整」→ 系数压到几十万(测过 ≈68 万 / 看过 ≈87 万 / 算过 ≈50 万),且一律带一位小数(wanX)。 + 仍不小于下面列表里单条的最大值(单个测试 ≤12 万、单条百问 ≤64 万、单个计算器 ≤18 万),口径不打架。模拟数,12-31 复核 */ + if (window.GC_TESTS_META && window.gcTested) { setNum('qz', window.GC_TESTS_META.reduce(function (a, x) { return a + window.gcTested(x.id); }, 0) * .456); setCnt('qz', window.GC_TESTS_META.length + ' 个测试'); } + setNum('qa', total() * .574); setNum('js', total() * CALC.reduce(function (a, x) { return a + x.heat; }, 0)); if (QA && QA.length) setCnt('qa', QA.length + ' 个问题'); } @@ -63,7 +67,7 @@ { q: '生娃到底要花多少钱?一键算清', h: 'topic/huafei/', heat: .118 }, { q: '孕期该长多少斤?按身高体重算', h: '/yunqi-tizhong/', heat: .083 }, { q: '胎儿现在多重?填 B 超数估一估', h: '/taier-guzhong/', heat: .071, gate: 15 }, - { q: '产假能休多少天?哪天回去上班', h: 'topic/zhichang/', heat: .062 } + { q: '产假能休多少天?哪天回去上班', h: 'topic/zhichang/', heat: .062, cm: 1 } /* cm:带 calc=1,进去第一屏就是计算器(11-03) */ ]; var QA = null, day = Math.floor((Date.now() + 288e5) / 864e5); function band() { var p = window.__mbPreg || {}; return p.postpartum || !p.week ? 0 : (window.__mbQaBand ? window.__mbQaBand(p.week) : 0); } @@ -83,7 +87,7 @@ } var cl = CALC.filter(function (x) { return !(x.gate && wk && wk < x.gate); }); if (b >= 5) cl = [cl[cl.length - 1]].concat(cl.slice(0, -1)); /* 孕 29 周起产假排前 */ - cl.slice(0, 2).forEach(function (x) { out.js.push({ q: x.q, href: x.h + location.search + location.hash, n: total() * x.heat, u: '人算过' }); }); + cl.slice(0, 2).forEach(function (x) { out.js.push({ q: x.q, href: x.h + (x.cm ? (location.search ? location.search + '&' : '?') + 'calc=1' : location.search) + location.hash, n: total() * x.heat, u: '人算过' }); }); var r = []; for (var k = 0; k < 2; k++) ['qz', 'qa', 'js'].forEach(function (c) { if (out[c][k]) r.push(Object.assign({ c: c }, out[c][k])); }); return { r: r, wk: wk }; diff --git a/topic/_shared/tools.js b/topic/_shared/tools.js index ea063f0..33c4073 100644 --- a/topic/_shared/tools.js +++ b/topic/_shared/tools.js @@ -68,7 +68,7 @@ function getJSON(u) { return fetch(u, { cache: 'no-cache' }).then(function (r) { if (!r.ok) throw r.status; return r.json(); }); } function related(box) { - getJSON('../_shared/idx.json?v=26110266').then(function (idx) { + getJSON('../_shared/idx.json?v=26110267').then(function (idx) { var me = null; idx.forEach(function (x) { if (x[0] === SLUG) me = x; }); var tag = me ? me[2] : '', h = 0; for (var i = 0; i < SLUG.length; i++) h = (h * 31 + SLUG.charCodeAt(i)) >>> 0; var rest = idx.filter(function (x) { return x[0] !== SLUG; }); @@ -175,7 +175,7 @@ } fetch(API + '/comments?kind=topic&target=' + encodeURIComponent(SLUG) + (OID ? '&openid=' + encodeURIComponent(OID) : '')) .then(function (r) { return r.json(); }).then(function (j) { if (j && j.code === 200) { RC = j.result; paint(); } }).catch(function () {}); - getJSON('../_shared/cm/' + SLUG + '.json?v=26110266').then(function (d) { L = d.c || []; paint(); }).catch(function () { paint(); }); + getJSON('../_shared/cm/' + SLUG + '.json?v=26110267').then(function (d) { L = d.c || []; paint(); }).catch(function () { paint(); }); } function extras(el) { diff --git a/topic/jisuan/index.html b/topic/jisuan/index.html index 8dbc55c..f93d496 100644 --- a/topic/jisuan/index.html +++ b/topic/jisuan/index.html @@ -64,7 +64,7 @@ button{font:inherit;border:0;background:none;color:inherit;cursor:pointer} (function () { 'use strict'; var $ = function (s) { return document.querySelector(s); }; - function href(u) { return u + (location.search || '') + (location.hash || ''); } + function href(u, cm) { return u + (cm ? (location.search ? location.search + '&' : '?') + 'calc=1' : (location.search || '')) + (location.hash || ''); } /* cm:产假页进计算器模式(11-03) */ function esc(s) { return String(s == null ? '' : s).replace(/[&<>"]/g, function (c) { return { '&': '&', '<': '<', '>': '>', '"': '"' }[c]; }); } /* 人数口径同首页:「此刻」总人数(默认 151 万)× 固定比例,模拟数(AGENTS.md 12b) */ var TOT = 1510000; @@ -77,13 +77,13 @@ button{font:inherit;border:0;background:none;color:inherit;cursor:pointer} }; var L = [ { n: '生娃花费计算器', tag: '最多人用', d: '产检、分娩、月子、宝宝第一年,一共要花多少钱', u: '../huafei/', heat: .118, c: '#F07A2E', bg: '#FFF0E4', ic: SV.money }, - { n: '产假天数计算器', d: '能休几天、哪天开始休、哪天回去上班', u: '../zhichang/', heat: .062, c: '#5B6CFF', bg: '#EEF0FF', ic: SV.cal }, + { n: '产假天数计算器', d: '能休几天、哪天开始休、哪天回去上班', u: '../zhichang/', cm: 1, heat: .062, c: '#5B6CFF', bg: '#EEF0FF', ic: SV.cal }, { n: '胎儿体重估算', d: '填 B 超上的几个数,估宝宝现在多重', u: '/taier-guzhong/', heat: .071, c: '#2E9B78', bg: '#E6F6F0', img: '/upload/picture/715333a69fb67d8812ab093f342fa00f.png', gate: 15 }, { n: '孕期增重计算', d: '按孕前身高体重,算你整个孕期该长多少斤', u: '/yunqi-tizhong/', heat: .083, c: '#E25C7A', bg: '#FFECEF', img: '/upload/picture/a6d7e61edee2ff0395cf00587a7c4036.svg' } ]; $('#list').innerHTML = L.map(function (x, i) { var lk = x.gate && week && week < x.gate; - return '' + + return '' + '' + (x.img ? '' : x.ic) + '' + '' + esc(x.n) + (x.tag ? '' + esc(x.tag) + '' : '') + (lk ? '孕' + x.gate + '周开放' : '') + '

' + esc(x.d) + '

' + wan(TOT * x.heat) + '人算过
' + '去算
'; diff --git a/topic/zhichang/index.html b/topic/zhichang/index.html index fe12084..b79d709 100644 --- a/topic/zhichang/index.html +++ b/topic/zhichang/index.html @@ -184,6 +184,21 @@ details.fold .bd p+p{margin-top:6px} .fade{opacity:0;transform:translateY(12px);transition:opacity .45s ease,transform .45s ease} .fade.in{opacity:1;transform:none} @media (prefers-reduced-motion:reduce){.fade{opacity:1;transform:none;transition:none}.track i{transition:none}} +/* 11-03 用户:「产假计算那个,点进来第一屏就要能算自己有多少产假,其他内容精简」 + → 从「孕期计算器」入口(百宝箱 / topic/jisuan,带 calc=1)进来是计算器模式:顶部换成一句话标题,计算器提到第一屏、结果放最上面, + 「记住这 3 点」留着;三阶段时间轴、被劝退怎么办收进一个按钮「看完整的职场维权指南」,点了才展开。从「其他孕妈也在搜」进来仍是原文章页。 */ +.cm-hd,.cm-more{display:none} +html.cm .hero,html.cm .me,html.cm #s2 .sh,html.cm #s2 .lead{display:none} +html.cm:not(.cm-all) #s1,html.cm:not(.cm-all) #s3{display:none} +html.cm .cm-hd{display:block;margin-top:-48px;padding:60px 20px 4px;background:linear-gradient(180deg,var(--cbg),#fff)} +.cm-hd p{font-size:12.5px;font-weight:700;color:var(--c);letter-spacing:1px} +.cm-hd h1{margin-top:4px;font-size:25px;font-weight:900;line-height:1.3;color:var(--h)} +.cm-hd span{display:block;margin-top:4px;font-size:14px;color:var(--m)} +html.cm #s2{margin-top:6px} +html.cm .calc{display:flex;flex-direction:column;margin-top:8px;box-shadow:0 10px 30px -18px rgba(91,108,255,.5)} +html.cm .calc .res{order:-1;margin:0 0 16px} +html.cm .key{margin-top:26px} +html.cm:not(.cm-all) .cm-more{display:flex;align-items:center;justify-content:center;gap:4px;margin:22px 20px 0;height:46px;border-radius:99px;background:var(--cbg);color:var(--c);font-size:14.5px;font-weight:700;width:calc(100% - 40px)} @@ -207,6 +222,9 @@ details.fold .bd p+p{margin-top:6px} 孕期专题 + +

孕期计算器

产假天数计算器

填好预产期,算出能休几天、哪天回去上班
+

孕期专题 · 职场篇

@@ -337,6 +355,8 @@ details.fold .bd p+p{margin-top:6px}
+ +
@@ -360,6 +380,16 @@ details.fold .bd p+p{margin-top:6px} var $ = function (s) { return document.querySelector(s); }; function hp(n) { var h = (location.hash.slice(1) || '') + '&' + (location.search.slice(1) || ''); var m = h.match(new RegExp('(?:^|&)' + n + '=([^&]*)')); return m ? decodeURIComponent(m[1]) : ''; } var openid = hp('openid'); + /* 计算器模式:计算器挪到最前(DOM 上紧跟顶部标题),「记住这 3 点」跟在后面 */ + if (hp('calc')) { + document.documentElement.classList.add('cm'); + document.title = '产假天数计算器'; + document.querySelector('#bar .t').textContent = '孕期计算器'; + var hd = document.querySelector('.cm-hd'); + hd.parentNode.insertBefore(document.getElementById('s2'), hd.nextSibling); + document.getElementById('s2').parentNode.insertBefore(document.querySelector('.key'), document.getElementById('s2').nextSibling); + document.getElementById('cmMore').addEventListener('click', function () { document.documentElement.classList.add('cm-all'); setTimeout(function () { go('s1'); }, 30); }); + } var sc = $('#scroll'); /* 返回:从首页点进来就 back;直接打开(分享 / 刷新)就回同目录的首页,身份原样带回 */