From 55e293874f9ee161154c24cb834132b5fb8c4c4b Mon Sep 17 00:00:00 2001 From: Karlcarlo Date: Sun, 4 Oct 2026 06:28:24 +0000 Subject: [PATCH] =?UTF-8?q?style(=E9=A6=96=E9=A1=B5=E5=A4=B4=E5=9B=BE):=20?= =?UTF-8?q?LOGO=20=E6=B7=B1=E6=A3=95=E7=99=BD=E6=8F=8F=E8=BE=B9=EF=BC=9B?= =?UTF-8?q?=E5=80=92=E8=AE=A1=E6=97=B6=E7=99=BD=E8=83=B6=E5=9B=8A=E3=80=81?= =?UTF-8?q?=E5=AD=95=E5=91=A8=E5=B1=82=E6=AC=A1=EF=BC=9B=E5=85=89=E6=9D=9F?= =?UTF-8?q?=E6=91=86=E5=8A=A8=E5=8A=A0=E5=A4=A7=EF=BC=9B=E6=B0=B4=E6=B3=A2?= =?UTF-8?q?=E6=81=A2=E5=A4=8D=E4=B8=94=E9=81=BF=E5=BC=80=E5=AE=9D=E5=AE=9D?= =?UTF-8?q?=20(v26100419)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Co-Authored-By: Claude Opus 5.5 --- index.html | 2 +- js/app.js | 2 +- js/hero-fx.js | 14 +++++++++----- mama-box.css | 18 ++++++++++++++++++ 4 files changed, 29 insertions(+), 7 deletions(-) diff --git a/index.html b/index.html index 8844c56..eceb6a1 100644 --- a/index.html +++ b/index.html @@ -7,7 +7,7 @@ 兜爸心选 · 孕育陪伴 - + diff --git a/js/app.js b/js/app.js index f3d4f5e..4492156 100644 --- a/js/app.js +++ b/js/app.js @@ -3,7 +3,7 @@ (function () { 'use strict'; /* 页面版本号（YYMMDD+序号）：显示在「关于兜爸心选」页底部；bump 时同步 head 注释与 ?v= */ - var VER = '26100418'; + var VER = '26100419'; const $ = (s, c) => (c || document).querySelector(s); const $$ = (s, c) => Array.from((c || document).querySelectorAll(s)); diff --git a/js/hero-fx.js b/js/hero-fx.js index f9b95f9..1a98631 100644 --- a/js/hero-fx.js +++ b/js/hero-fx.js @@ -90,7 +90,7 @@ // 宝宝保护：孕囊中心附近 → 0，囊边 → 1 function guard(x, y) { const d = Math.hypot(x - SX, y - SY) / SR; - return d < .45 ? 0 : d > .95 ? 1 : (d - .45) / .5; + return d < .62 ? 0 : d > 1.05 ? 1 : (d - .62) / .43; // 宝宝缩到 70% 后大约占孕囊半径的 6 成 } // 水波：四层不同方向、不同速度的长波叠加，取正半部分 → 一片片柔和的亮斑缓缓流过 function water(t) { @@ -101,7 +101,7 @@ let w = Math.sin(u * 1.1 + T) + Math.sin(v * 1.3 - T * .8 + u * .4) + Math.sin((u - v) * .9 + T * .6) + Math.sin(Math.hypot(u - 4.5, v - 1) * 1.6 - T * 1.1); w = w / 4; w = w > 0 ? w * w : 0; // 只留亮的那半，平方让过渡更软 const X = x / CW * W, Y = y / ch * H; - const g = .15 + .85 * guard(X, Y); + const g = guard(X, Y); // 宝宝那一圈完全不叠水波 const o = (y * CW + x) * 4; d[o] = 255; d[o + 1] = 238; d[o + 2] = 214; d[o + 3] = w * 200 * g * (1 - y / ch * .35); } @@ -123,8 +123,9 @@ rx.clearRect(0, 0, w, h); rx.globalCompositeOperation = 'lighter'; RAYS.forEach(([a0, ww, al], i) => { - const a = Math.PI * .6 + a0 + Math.sin(t * .09 + i * 1.9) * .03; - const k = al * (.6 + .4 * Math.sin(t * .23 + i * 2.1)); + // 2026-10-04 用户：「射下来的光束可以动一动」→ 摆幅 .03→.07、摆速加快，明暗起伏更明显 + const a = Math.PI * .6 + a0 + Math.sin(t * .16 + i * 1.9) * .07; + const k = al * (.45 + .55 * Math.sin(t * .35 + i * 2.1)); const wv = ww * (1 + .2 * Math.sin(t * .17 + i)); const gr = rx.createLinearGradient(ox, oy, ox + Math.cos(a) * L * .8, oy + Math.sin(a) * L * .8); gr.addColorStop(0, 'rgba(255,248,228,0)'); @@ -173,7 +174,10 @@ const t = now / 1000; ctx.setTransform(dpr, 0, 0, dpr, 0, 0); ctx.clearRect(0, 0, W, H); - // 2026-10-04 用户：「水波纹那一层先去掉，动的是宝宝自己（腿脚、嘴角），不是水」→ 不再画水波 + /* 水波：2026-10-04 先关后开 —— 用户之前看到的「宝宝脸/腿变形」其实是 GIF 自带的扭动（已停用 GIF）， + 这层只是叠加的柔光，不做任何形变；而且宝宝那一圈（guard）完全不叠，宝宝表情一点不受影响。 */ + if ((tick ^= 1)) water(t); + drawWater(); rays(t); dots(t, dt); } diff --git a/mama-box.css b/mama-box.css index d8a9b72..9b6b0aa 100644 --- a/mama-box.css +++ b/mama-box.css @@ -4477,3 +4477,21 @@ a.skip:focus{left:16px;top:16px} .t-badge{min-width:17px;width:auto;height:17px;padding:0 4.5px;box-sizing:border-box;top:2px;left:calc(50% + 6px); border-radius:999px;border:1.5px solid #fff;color:#fff;font:700 10.5px/14px -apple-system,"PingFang SC",sans-serif;text-align:center; box-shadow:0 2px 6px rgba(255,59,48,.35)} + +/* ============ 2026-10-04 头图文字层次（用户：「LOGO 不明显，不一定用彩色；天数、孕周全是大白字有点单调」） ============ + · LOGO：白色抠图 → 深可可棕字 + 白描边 + 轻投影，跟底栏「记一下」贴纸同一套语言，压在橙底上一眼可见、又不花。 + 做法：img 留着撑尺寸（透明），::before 用同一张 PNG 当 mask 填棕色；描边/投影是 h1 上的 drop-shadow 叠出来的。 + · 倒计时胶囊：半透明白框 → 实心白胶囊、棕红字，「92」用主题橙红加大 —— 头图里唯一一块「白底深字」，层次一下拉开。 + · 大孕周：白字加一道棕色实投影（贴纸厚度感）；「周」「像西葫芦」换奶油色；「+6天」放进深色小胶囊。 */ +.home-hero .hero-brand{position:relative;filter:drop-shadow(1.3px 0 0 #fff) drop-shadow(-1.3px 0 0 #fff) drop-shadow(0 1.3px 0 #fff) drop-shadow(0 -1.3px 0 #fff) drop-shadow(0 3px 5px rgba(110,30,10,.3))} +.home-hero .hero-logo{opacity:0;filter:none} +.home-hero .hero-brand::before{content:"";position:absolute;inset:0;background:#5A2214; + -webkit-mask:url(assets/img/db2f99232b39.png) left center/contain no-repeat;mask:url(assets/img/db2f99232b39.png) left center/contain no-repeat} +.hi-due{height:24px;padding:0 11px 0 9px;background:rgba(255,255,255,.94);border:0;color:#9A3F27;text-shadow:none;box-shadow:0 3px 10px rgba(130,40,20,.18)} +.hi-due b{color:#E2512E;font-size:15px} +.hi-heart path{fill:#F0603C} +.hi-week b{color:#fff;text-shadow:0 2px 0 rgba(140,50,28,.35),0 6px 14px rgba(120,30,10,.25)} +.hi-unit em{color:#FFE6BF} +.hi-unit span{display:inline-block;margin-top:4px;padding:1px 6px;border-radius:999px;font-size:11px;opacity:1;background:rgba(110,35,18,.28);color:#FFF1DC;text-shadow:none} +.hi-unit span:empty{display:none} +.hi-size{color:#FFE6BF}