本周孕育指南改为孕周专属福利(资料免费送福利券样式)
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
42
mama-box.css
42
mama-box.css
@@ -3165,3 +3165,45 @@ a.skip:focus{left:16px;top:16px}
|
||||
.fn-sign{font-family:var(--font-kid);font-size:13px;color:#C0704F}
|
||||
.fn-foot em{margin-left:auto;font-style:normal;font-size:12px;font-weight:700;color:var(--brand)}
|
||||
.today-line.fp2.no-ai .fp-note{display:none}
|
||||
|
||||
/* ================= 本周孕育指南 → 孕周专属福利(.shelf.gift2,2026-10-01)=================
|
||||
礼盒抬头 + 三张「福利券」:孕周角标、免费印章、撕券虚线(两侧半圆缺口)、底行免费领。 */
|
||||
.shelf.gift2{background-image:
|
||||
radial-gradient(170px 110px at 100% 0%, rgba(255,200,170,.38), rgba(255,200,170,0) 70%),
|
||||
linear-gradient(180deg,#FFFDFB,#FFF7F1)}
|
||||
.gb-bar{align-items:center;gap:10px;margin-bottom:12px}
|
||||
.gb-gift{flex:0 0 42px;height:42px;border-radius:14px;display:grid;place-items:center;
|
||||
background:linear-gradient(145deg,#FFF1E6,#FFE1D2);box-shadow:inset 0 0 0 1px #FBD9C8}
|
||||
.gb-gift svg{animation:gbWiggle 3.2s ease-in-out infinite;transform-origin:50% 90%}
|
||||
@keyframes gbWiggle{0%,82%,100%{transform:rotate(0)}86%{transform:rotate(-9deg)}90%{transform:rotate(8deg)}94%{transform:rotate(-4deg)}}
|
||||
.gb-ht{flex:1;min-width:0}
|
||||
.gift2 .sh-title{font-size:18px;font-weight:900;color:var(--ink)}
|
||||
.gift2 .sh-title [data-wk]{color:#F4593C}
|
||||
.gift2 .sh-note{margin:3px 0 0;font-size:12.5px;color:#A08C82}
|
||||
.gift2 .sh-note b{color:#E8344E;font-weight:800}
|
||||
.gift2 .sh-all{align-self:flex-start;margin-top:4px}
|
||||
|
||||
.gift2 .shelf-book{position:relative;overflow:hidden;padding:14px 14px 12px}
|
||||
.sb-tag{position:absolute;left:0;top:0;z-index:1;padding:4px 10px 4px 12px;border-radius:20px 0 14px 0;
|
||||
font-size:11px;font-weight:800;color:#fff;letter-spacing:.3px;background:linear-gradient(135deg,#FF8E6E,#F4593C)}
|
||||
.sb-stamp{position:absolute;right:12px;top:12px;z-index:1;width:44px;height:44px;border-radius:50%;
|
||||
display:grid;place-items:center;text-align:center;font-size:11px;font-weight:900;line-height:1.15;color:#E8344E;
|
||||
border:2px solid rgba(232,52,78,.75);box-shadow:inset 0 0 0 2px rgba(255,255,255,.7),inset 0 0 0 3.5px rgba(232,52,78,.35);
|
||||
background:rgba(255,255,255,.55);transform:rotate(14deg)}
|
||||
.gift2 .sb-cover{margin-top:10px}
|
||||
/* 撕券线:虚线 + 左右两个半圆缺口(缺口颜色取外壳底色,近白) */
|
||||
.gift2 .sb-row{position:relative;margin-top:auto;padding-top:11px;border-top:1.5px dashed rgba(170,110,80,.28)}
|
||||
.gift2 .sb-row::before,.gift2 .sb-row::after{content:"";position:absolute;top:-8px;width:15px;height:15px;border-radius:50%;background:#FFFAF6}
|
||||
.gift2 .sb-row::before{left:-22px}
|
||||
.gift2 .sb-row::after{right:-22px}
|
||||
.gift2 .sb-desc{margin-bottom:12px}
|
||||
.gift2 .sb-row .pill-free{margin-left:auto;padding:5px 11px;border-radius:99px;font-size:12px;font-weight:800;
|
||||
color:#fff;background:linear-gradient(135deg,#FF7A5C,#E8344E);box-shadow:0 4px 10px rgba(232,52,78,.22)}
|
||||
.gift2 .unlock{display:block;text-align:center;margin:14px 0 2px;padding:9px 12px;border-radius:14px;
|
||||
background:#FFF1E8;color:#8A6A5E;font-size:12.5px}
|
||||
.gift2 .unlock b{color:#E8344E;font-size:15px;font-weight:900;margin:0 1px}
|
||||
.ul-gift{display:inline-block;vertical-align:-3px;margin-right:5px;width:16px;height:16px;background:no-repeat center/contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='3' y='9' width='18' height='12' rx='2.5' fill='%23FF7A5C'/%3E%3Crect x='2' y='7' width='20' height='4.5' rx='2' fill='%23FF9474'/%3E%3Crect x='10.6' y='7' width='2.8' height='14' fill='%23FFD36E'/%3E%3C/svg%3E")}
|
||||
@media (prefers-reduced-motion:reduce){.gb-gift svg{animation:none}}
|
||||
.gift2 .sb-faces i:nth-child(n+4){display:none}
|
||||
.gift2 .sb-row .pill-free{padding:5px 10px}
|
||||
.gift2 .unlock a{white-space:nowrap}
|
||||
|
||||
Reference in New Issue
Block a user