fix(首页): 删除妈妈的树洞 / 预览页不再自动跳上次应用 / 「我的」加盲盒卡册常驻入口 (v26100103)
- 妈妈的树洞整块删除（HTML/CSS/JS），需要恢复看 git 历史 - 预览页 /mama-box-preview/ 跳过冷启动恢复上次应用，避免一打开链接就跳到孕检日历 - 「我的」设置与服务里加「我的孕期卡册 N/37」，与首页横幅同一入口；未建档/未到孕周时隐藏 Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
97
mama-box.css
97
mama-box.css
@@ -414,7 +414,7 @@ a.skip:focus{left:16px;top:16px}
|
||||
对齐的是内容，出血的是底色，这两件事要分开。
|
||||
⚠️ 三块的圆角、底色、左右内边距改成在这里一处定义。以后要调，改这一条，
|
||||
别再回到各自的规则里单独写，那正是上一稿乱掉的原因。 */
|
||||
.tool-dock,.game-promo,.preg-tips,.today-line,.tree-hole,.shelf{
|
||||
.tool-dock,.game-promo,.preg-tips,.today-line,.shelf{
|
||||
margin:0 -26px;padding:16px 26px 18px;border-radius:26px;
|
||||
background-color:#fff;
|
||||
/* ⚠️ 这两条是一对，缺一不可，而且必须一起看：
|
||||
@@ -428,7 +428,7 @@ a.skip:focus{left:16px;top:16px}
|
||||
/* 块间距。给后两块，第一块的上间距另有规则（来信卡收放要用）。
|
||||
⚠️ 这是**块与块之间**的缝。某一块自己内部觉得挤，要调的是那块的 padding，
|
||||
不是这里 —— 改这里会把三块的关系一起改掉。 */
|
||||
.tool-dock,.game-promo,.preg-tips,.today-line,.tree-hole,.shelf{margin-top:16px}
|
||||
.tool-dock,.game-promo,.preg-tips,.today-line,.shelf{margin-top:16px}
|
||||
|
||||
/* ===== 后两块的暖色渐变底（本批新增）=====
|
||||
用户原话：「在那个宝宝的今日脚印那块，稍微给背景它加一点渐变」
|
||||
@@ -618,95 +618,9 @@ a.skip:focus{left:16px;top:16px}
|
||||
.pt-grid.is-shown .pt-card:nth-child(4){transition-delay:.24s}
|
||||
.pt-foot{margin-top:9px;font-size:11px;color:var(--muted);text-align:center}
|
||||
|
||||
/* ============ 妈妈的树洞 · 星夜版（2026-10-01 重做）============
|
||||
外层仍是统一的白块；里面一块深夜蓝小天幕 .th-night（高约 190px，比旧版矮）。
|
||||
天幕层次（下→上）：渐变夜空 → 月亮光晕 → 星星（#thSky，每颗亮星 = 一条心事）→ 萤火虫 → 剪影树 + 漩涡树洞 → 输入条。
|
||||
动效：星星各自眨眼；萤火虫游走；树冠轻晃；树洞漩涡一直慢转、光晕呼吸；
|
||||
扔进去时字逐个被吸进漩涡（JS），洞口爆亮（.is-eat），新星从洞口射上天（JS）。 */
|
||||
.th-head{display:flex;align-items:center;gap:8px}
|
||||
.th-title{font-size:16.5px;font-weight:800;letter-spacing:-.2px}
|
||||
.th-lock{margin-left:auto;display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:600;
|
||||
color:#6C6FA8;background:#EFEFFB;border-radius:999px;padding:3px 9px}
|
||||
.th-night{position:relative;overflow:hidden;margin-top:10px;height:188px;border-radius:22px;isolation:isolate;
|
||||
background:radial-gradient(120% 90% at 85% 100%,#4B3F7E 0%,rgba(75,63,126,0) 60%),
|
||||
linear-gradient(170deg,#141632 0%,#1E2150 48%,#36306A 100%);
|
||||
box-shadow:inset 0 0 0 1px rgba(255,255,255,.06),0 10px 24px rgba(40,36,90,.22)}
|
||||
.th-sky{position:absolute;inset:0;z-index:0}
|
||||
.th-sky i{position:absolute;width:2px;height:2px;border-radius:50%;background:#fff;opacity:.5;
|
||||
animation:thTw 3.2s ease-in-out infinite}
|
||||
.th-sky i.me{width:5px;height:5px;background:#FFF1C9;opacity:1;
|
||||
box-shadow:0 0 6px 2px rgba(255,214,140,.75),0 0 14px 4px rgba(255,190,120,.25)}
|
||||
.th-sky i.me::before,.th-sky i.me::after{content:"";position:absolute;left:50%;top:50%;background:rgba(255,236,190,.7);
|
||||
transform:translate(-50%,-50%);border-radius:2px}
|
||||
.th-sky i.me::before{width:13px;height:1px}.th-sky i.me::after{width:1px;height:13px}
|
||||
.th-sky i.me.is-new{animation:thBorn 1.4s var(--ease) both,thTw 3.2s 1.4s ease-in-out infinite}
|
||||
@keyframes thTw{0%,100%{opacity:var(--o,.55);transform:scale(1)}50%{opacity:.15;transform:scale(.7)}}
|
||||
@keyframes thBorn{0%{transform:scale(3.2);opacity:1;filter:brightness(2)}100%{transform:scale(1);filter:none}}
|
||||
.th-moon{position:absolute;z-index:0;left:18px;top:14px;width:26px;height:26px;border-radius:50%;
|
||||
background:radial-gradient(circle at 35% 35%,#FFF7DD,#F6DFA8);box-shadow:0 0 18px 6px rgba(255,226,160,.22)}
|
||||
.th-moon::after{content:"";position:absolute;left:8px;top:-3px;width:24px;height:24px;border-radius:50%;background:#18193A}
|
||||
.th-fly{position:absolute;z-index:1;width:4px;height:4px;border-radius:50%;background:#FFE7A0;
|
||||
box-shadow:0 0 8px 3px rgba(255,220,120,.6);opacity:0;animation:thFly 7s ease-in-out infinite}
|
||||
.th-fly.f1{left:52%;top:62%}.th-fly.f2{left:70%;top:40%;animation-delay:2.4s;animation-duration:8s}
|
||||
.th-fly.f3{left:36%;top:46%;animation-delay:4.6s;animation-duration:9s}
|
||||
@keyframes thFly{0%{opacity:0;transform:translate(0,0)}20%{opacity:.95}50%{transform:translate(16px,-14px)}
|
||||
80%{opacity:.8}100%{opacity:0;transform:translate(-8px,-30px)}}
|
||||
.th-lead{position:absolute;z-index:2;left:18px;top:52px;margin:0;font-size:13px;line-height:1.7;font-weight:700;color:#F3F0FF;
|
||||
text-shadow:0 1px 8px rgba(10,10,40,.5)}
|
||||
.th-lead em{font-style:normal;font-weight:500;font-size:11.5px;color:#BDB8E8}
|
||||
.th-tree{position:absolute;z-index:1;right:-6px;bottom:44px;width:118px;height:128px;overflow:visible}
|
||||
.th-crown{transform-origin:60px 74px;animation:thSway 6s ease-in-out infinite}
|
||||
@keyframes thSway{0%,100%{transform:rotate(-1.4deg)}50%{transform:rotate(1.4deg)}}
|
||||
.th-halo{transform-origin:60px 102px;animation:thBreath 3s ease-in-out infinite}
|
||||
@keyframes thBreath{0%,100%{opacity:.55;transform:scale(.9)}50%{opacity:1;transform:scale(1.12)}}
|
||||
.th-vortex{transform-origin:60px 102px;animation:thSpin 4s linear infinite}
|
||||
@keyframes thSpin{to{transform:rotate(360deg)}}
|
||||
.th-tree.is-eat .th-halo{animation:thBurst .9s ease-out}
|
||||
.th-tree.is-eat .th-vortex{animation-duration:.5s}
|
||||
.th-tree.is-eat .th-crown{animation:thShake .7s ease-in-out}
|
||||
@keyframes thBurst{0%{opacity:1;transform:scale(1)}35%{opacity:1;transform:scale(2.3)}100%{opacity:.55;transform:scale(.9)}}
|
||||
@keyframes thShake{0%,100%{transform:rotate(0)}25%{transform:rotate(-4deg)}60%{transform:rotate(3deg)}}
|
||||
.th-form{position:absolute;z-index:3;left:10px;right:10px;bottom:10px;display:flex;align-items:flex-end;gap:8px;
|
||||
padding:5px 5px 5px 14px;border-radius:20px;background:rgba(255,255,255,.1);
|
||||
-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:inset 0 0 0 1px rgba(255,255,255,.16)}
|
||||
.th-form textarea{flex:1;min-width:0;display:block;border:0;outline:0;resize:none;background:transparent;
|
||||
font:inherit;font-size:13.5px;line-height:20px;height:20px;max-height:60px;margin:6px 0;color:#fff;transition:height .25s var(--ease)}
|
||||
.th-form textarea::placeholder{color:rgba(230,226,255,.55)}
|
||||
.th-night.is-typing .th-form textarea{height:60px}
|
||||
.th-night.is-typing .th-lead{opacity:0;transform:translateY(-6px)}
|
||||
.th-lead{transition:opacity .25s,transform .25s}
|
||||
.th-send{flex:0 0 auto;width:34px;height:34px;border:0;border-radius:50%;display:grid;place-items:center;color:#3A2A12;
|
||||
background:linear-gradient(135deg,#FFE3A1,#FFAE6E);box-shadow:0 0 14px rgba(255,190,110,.55);transition:transform .2s,opacity .2s}
|
||||
.th-send:disabled{opacity:.35;box-shadow:none}
|
||||
.th-send:not(:disabled){animation:thPing 2s ease-in-out infinite}
|
||||
@keyframes thPing{0%,100%{box-shadow:0 0 10px rgba(255,190,110,.45)}50%{box-shadow:0 0 20px 3px rgba(255,190,110,.8)}}
|
||||
.th-send:active{transform:scale(.9)}
|
||||
.th-row{display:flex;align-items:center;gap:8px;margin-top:9px;min-height:20px}
|
||||
.th-mine{border:0;background:none;padding:0;font:inherit;font-size:12px;font-weight:600;color:#6C6FA8}
|
||||
.th-mine b{font-weight:800;color:#4B3F9E}
|
||||
.th-done{margin-left:auto;font-size:12px;font-weight:700;color:#7A6BD0;opacity:0;transform:translateY(4px);transition:opacity .3s,transform .3s}
|
||||
.th-done.is-on{opacity:1;transform:none}
|
||||
.th-done.is-sos{margin-left:0}
|
||||
.th-done .th-sos{font-weight:500;color:var(--ink-2);margin-top:2px}
|
||||
.th-row{flex-wrap:wrap}.th-done.is-sos{flex-basis:100%}
|
||||
.th-ch{position:fixed;z-index:60;left:0;top:0;pointer-events:none;font-size:14px;font-weight:700;color:#FFF1C9;
|
||||
text-shadow:0 0 8px rgba(255,200,120,.9)}
|
||||
.th-shoot{position:fixed;z-index:60;left:0;top:0;width:6px;height:6px;margin:-3px 0 0 -3px;border-radius:50%;pointer-events:none;
|
||||
background:#FFF4D2;box-shadow:0 0 10px 4px rgba(255,210,130,.8)}
|
||||
.th-list{list-style:none;margin:8px 0 0;padding:0}
|
||||
.th-list.hide{display:none}
|
||||
.th-list li{position:relative;background:#F6F5FD;border-radius:14px;padding:9px 34px 9px 30px;margin-top:8px}
|
||||
.th-list li::before{content:"";position:absolute;left:12px;top:15px;width:6px;height:6px;border-radius:50%;
|
||||
background:#FFC978;box-shadow:0 0 6px 2px rgba(255,200,120,.6)}
|
||||
.th-list time{display:block;font-size:11px;color:#9A97C2}
|
||||
.th-list p{margin:3px 0 0;font-size:13px;line-height:1.6;color:var(--ink-2);white-space:pre-wrap;word-break:break-all}
|
||||
.th-list .th-del{position:absolute;right:8px;top:8px;border:0;background:none;padding:2px 4px;font-size:15px;color:#B8B6D6}
|
||||
.th-list .th-empty{text-align:center;color:var(--muted);font-size:12px;background:none;padding:6px}
|
||||
.th-list .th-empty::before{display:none}
|
||||
.th-help{margin:8px 0 0;font-size:10.5px;line-height:1.55;color:var(--muted)}
|
||||
.th-help a{color:#6C6FA8;font-weight:700}
|
||||
|
||||
@media (prefers-reduced-motion:reduce){
|
||||
.pt-float,.pt-day.is-today i,.th-crown,.th-halo,.th-vortex,.th-fly,.th-sky i,.th-send{animation:none!important}
|
||||
.pt-float,.pt-day.is-today i{animation:none!important}
|
||||
.pt-grid .pt-card{opacity:1;transform:none;transition:none}
|
||||
}
|
||||
|
||||
@@ -2768,5 +2682,4 @@ a.skip:focus{left:16px;top:16px}
|
||||
.pt-foot{margin-top:6px;font-size:10.5px}
|
||||
.pt-card.is-open p{-webkit-line-clamp:unset;display:block}
|
||||
.pt-grid{scroll-padding:0 26px}
|
||||
.th-tree{bottom:50px}
|
||||
.th-crown{filter:drop-shadow(0 -1px 0 rgba(170,160,255,.35)) drop-shadow(0 0 10px rgba(120,110,230,.25))}
|
||||
.li.hide{display:none}
|
||||
|
||||
Reference in New Issue
Block a user