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

首页卡片：轻毛玻璃 + 标题区主题色光晕 + 底层彩色光斑 (v26100229)

Browse Source 
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
Karlcarlo
2026-10-03 12:30:29 +00:00
parent 5608b389be
commit c248cb8122
3 changed files with 34 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

32
mama-box.css
View File

@@ -4373,3 +4373,35 @@ a.skip:focus{left:16px;top:16px}
.today-line.fp2 .ab-say{margin-top:5px;font-family:inherit;font-size:14px;font-weight:500;line-height:1.6;color:#3A2C27;background:none;
display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.today-line.fp2 .fn-foot{display:none}
/* ================= 首页卡片 · 轻毛玻璃 + 标题区光晕（2026-10-03 v26100229）=================
用户：「卡片有点素、没设计感；标题那块做点效果，别太重，干净整洁；整卡毛玻璃像底部 Tab 那样，但不要太重；
卡片底下要有点东西才显得出毛玻璃」。三层：
① 卡片底下：#homeBody 铺几团很淡的彩色光斑（左右交替，按整列高度的百分比定位），只为让玻璃「磨」出颜色；
卡片几乎通栏，光斑大部分藏在卡片后面，透过玻璃看到的是一层柔和的色雾。
② 卡片本身：照底部 Tab 的配方减一档 —— 半透白 .62→.5 + blur(16px) saturate(160%) + 白细边 + 顶部 1px 高光 + 暖色淡投影。
去掉 v26100213 的磨砂颗粒（要干净）。卡片里没有 fixed/sticky 子元素，backdrop-filter 改参照系的风险已核对过。
③ 标题区：左上角一团该模块主题色的淡光晕 + 顶边一道从主题色淡出的 2px 细线，只在标题那一带，往下就是纯玻璃。
恢复上一版（纯毛玻璃颗粒）：删掉这一整段即可。 */
#homeBody{position:relative;background:
radial-gradient(260px 220px at 8% 6%,rgba(255,190,165,.55),rgba(255,190,165,0) 70%),
radial-gradient(240px 220px at 96% 20%,rgba(255,196,214,.5),rgba(255,196,214,0) 70%),
radial-gradient(260px 240px at 4% 40%,rgba(255,224,150,.5),rgba(255,224,150,0) 70%),
radial-gradient(260px 240px at 98% 60%,rgba(186,232,210,.55),rgba(186,232,210,0) 70%),
radial-gradient(250px 230px at 6% 78%,rgba(214,200,255,.45),rgba(214,200,255,0) 70%),
radial-gradient(260px 230px at 94% 94%,rgba(255,206,160,.5),rgba(255,206,160,0) 70%)}
#homeBody>section:not(.ny-peek):not(.game-promo){
--gt:255,155,120;
background:
linear-gradient(90deg,rgba(var(--gt),.55),rgba(var(--gt),0) 62%) top/100% 2px no-repeat,
radial-gradient(240px 110px at 0 0,rgba(var(--gt),.20),rgba(var(--gt),0) 72%),
linear-gradient(180deg,rgba(255,255,255,.62),rgba(255,255,255,.5))!important;
-webkit-backdrop-filter:blur(16px) saturate(160%);backdrop-filter:blur(16px) saturate(160%);
border:1px solid rgba(255,255,255,.85);
box-shadow:0 12px 30px rgba(190,110,80,.10),0 2px 6px rgba(190,110,80,.04),inset 0 1px 0 #fff!important}
#homeBody>section.tool-dock{--gt:255,150,112}
#homeBody>section.preg-tips{--gt:255,140,175}
#homeBody>section.exch-wrap{--gt:240,178,60}
#homeBody>section.today-line{--gt:70,190,145}
#homeBody>section.shelf{--gt:255,160,90}
@media (prefers-reduced-transparency:reduce){#homeBody>section:not(.ny-peek):not(.game-promo){background:#FFFCFA!important;backdrop-filter:none;-webkit-backdrop-filter:none}}