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

v26110267 预览：首页头图倒计时翻牌；百宝箱入口人数改几十万带小数；30 个测试开始页按参考图精简居中；产假计算器模式（calc=1）计算器置顶

Browse Source 
Co-Authored-By: AI 助手
This commit is contained in:
deploy
2026-11-03 22:26:34 +00:00
parent a536e81e01
commit aabe4f9b38
14 changed files with 211 additions and 138 deletions
Download Patch File Download Diff File Expand all files Collapse all files

30
topic/zhichang/index.html
View File

@@ -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)}
</style>
</head>
<body>
@@ -207,6 +222,9 @@ details.fold .bd p+p{margin-top:6px}
<span class="t">孕期专题</span>
</header>
<!-- 计算器模式顶部（calc=1 时显示，见样式说明） -->
<section class="cm-hd"><p>孕期计算器</p><h1>产假天数计算器</h1><span>填好预产期，算出能休几天、哪天回去上班</span></section>
<section class="hero">
<i class="blob b1"></i><i class="blob b2"></i>
<p class="eyebrow">孕期专题 · 职场篇</p>
@@ -337,6 +355,8 @@ details.fold .bd p+p{margin-top:6px}
</details>
</section>
<button type="button" class="cm-more" id="cmMore">看完整的职场维权指南 ›</button>
<div id="tools"></div>
<details class="fold src">
@@ -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；直接打开（分享 / 刷新）就回同目录的首页，身份原样带回 */