feat(首页头图): 背景改暖桃橙,和羊水同色调顺下来 (v26093007)

- 头图底子从暗紫玫瑰改成取自囊内羊水的暖桃橙渐变,光晕和散景光点同步改暖、调淡;
  左侧天数卡那块也是同一色调。压字渐变改成很淡的暖色(.14)。
- 静态囊图按新底子重新合成(视频不变)。

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
2026-09-30 09:23:51 +00:00
parent f21af1e25b
commit 9bb3c5a533
7 changed files with 12 additions and 11 deletions

Binary file not shown.

Before

Width:  |  Height:  |  Size: 40 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 21 KiB

BIN
assets/img/973ada248e19.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 15 KiB

BIN
assets/img/c8db7fd56e68.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 38 KiB

View File

@@ -7,7 +7,7 @@
<meta name="mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-capable" content="yes">
<title>兜爸心选 · 孕育陪伴</title>
<!-- V:26093006 缓存版本标记:改 css/js 时同步 bump 该值(与 js/app.js 的 VER 同源),静态资源按 mtime 走 ETag 自动刷新 -->
<!-- V:26093007 缓存版本标记:改 css/js 时同步 bump 该值(与 js/app.js 的 VER 同源),静态资源按 mtime 走 ETag 自动刷新 -->
<link rel="stylesheet" href="mama-box.css">
<script src="https://res.wx.qq.com/open/js/jweixin-1.6.0.js"></script>
<!-- 共享助手:授权/跳商城/位置上报(分享卡片同步,见 docs/h5-auth-standard.md 第四节) -->
@@ -64,7 +64,7 @@
静态图 .hero-sac 垫底(= 视频第 1 帧),上面叠一段只截了囊内的循环短视频 .hero-kid,
宝宝自己吸手指、蹬腿,囊本身不动。视频放不起来(微信拦自动播放等)就停在静态图上。 -->
<div class="hero-baby" aria-hidden="true">
<img class="hero-sac" src="assets/img/70812d56ec5f.jpg" alt="">
<img class="hero-sac" src="assets/img/c8db7fd56e68.jpg" alt="">
<video class="hero-kid" id="heroKid" src="assets/video/b6476cfce328.mp4"
muted autoplay loop playsinline webkit-playsinline x5-playsinline
preload="auto" disablepictureinpicture></video>

View File

@@ -3,7 +3,7 @@
(function () {
'use strict';
/* 页面版本号(YYMMDD+序号):显示在「关于兜爸心选」页底部;bump 时同步 head 注释与 ?v= */
var VER = '26093006';
var VER = '26093007';
const $ = (s, c) => (c || document).querySelector(s);
const $$ = (s, c) => Array.from((c || document).querySelectorAll(s));

View File

@@ -191,19 +191,20 @@ a.skip:focus{left:16px;top:16px}
hero 橙色区底缘:中部 ≈y420(210) 两侧 ≈y340(170) → 椭圆下沿 44px
⚠️ 上面这些是**设计稿**的数,不是现在的实现值。设计稿里没有 slogan,
加进去之后品牌字以下整列都下移了,实际纵向排布以 .home-hero 里那笔账为准。 */
/* 2026-09-30 背景换成孕 25 周图(底子 assets/img/7dfe5be4e828.jpg,1560×750 = 3 倍图 520×250;
羊水囊 + 宝宝单独一层 70812d56ec5f.jpg + 视频 b6476cfce328.mp4,见 .hero-baby):
/* 2026-09-30 背景换成孕 25 周图(底子 assets/img/973ada248e19.jpg,1560×750 = 3 倍图 520×250;
羊水囊 + 宝宝单独一层 c8db7fd56e68.jpg + 视频 b6476cfce328.mp4,见 .hero-baby):
只抠了原图里的羊水囊 + 宝宝(孕肚太写实,用户要求去掉),缩到原来约 8 成放在右侧,
底子是按原图色调重铺的紫玫瑰渐变 + 囊后一圈暖光晕 + 散景光点。
图高钉死 = 橙区高、右对齐,屏宽 ≤520 都铺得满;再宽就露底色 #5c344e(=图左缘色)。
上面叠一层很淡的左深右透渐变,只为让左边白字(孕周环、天数卡)再稳一点。
底子是暖桃橙渐变(取囊内羊水色 ≈#D6724F,用户要求整块头图和羊水同色调顺下来)
+ 囊后一圈淡暖光晕 + 淡金色散景光点。
图高钉死 = 橙区高、右对齐,屏宽 ≤520 都铺得满;再宽就露底色 #c8644c(=图左缘色)。
上面叠一层很淡的暖色左深右透渐变,只为让左边白字(孕周环、天数卡)再稳一点。
形状(高度、底部椭圆弧)不变。 */
.home-hero{
position:relative;color:#fff;overflow:hidden;
background:
linear-gradient(90deg,rgba(40,14,28,.22) 0%,rgba(40,14,28,.08) 38%,rgba(40,14,28,0) 58%),
url(assets/img/7dfe5be4e828.jpg) right center/auto 100% no-repeat,
#5c344e;
linear-gradient(90deg,rgba(150,55,35,.14) 0%,rgba(150,55,35,.05) 38%,rgba(150,55,35,0) 58%),
url(assets/img/973ada248e19.jpg) right center/auto 100% no-repeat,
#c8644c;
padding:env(safe-area-inset-top) 15px 0 16px;
/* 设计稿橙区 210px。但设计稿里气泡下缘是被白卡盖住的,
现在气泡补全成整圆(高 189.5),橙区必须够高才不会被 overflow:hidden 切掉。