Skip to content

Commit 44da984

Browse files
committed
enhance: add 专业版 name to Pro card and strengthen visual prominence
1 parent 942ab79 commit 44da984

File tree

1 file changed

+20
-12
lines changed

1 file changed

+20
-12
lines changed

pricing.html

Lines changed: 20 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -42,22 +42,27 @@
4242

4343
/* PLAN CARDS */
4444
.pr-plans{padding:48px 0 36px}
45-
.plans-grid{display:grid;grid-template-columns:1fr 1fr;gap:28px;margin:0 auto;align-items:stretch}
45+
.plans-grid{display:grid;grid-template-columns:1fr 1.08fr;gap:28px;margin:0 auto;align-items:stretch}
4646
.plan{background:var(--card);border:1.5px solid var(--border);border-radius:var(--r-xl);padding:44px 40px;
4747
position:relative;overflow:hidden;transition:all .35s cubic-bezier(.4,0,.2,1);
4848
display:flex;flex-direction:column;box-shadow:var(--shadow-card)}
4949
.plan:hover{transform:translateY(-4px);box-shadow:var(--shadow-card-hover)}
50-
.plan-pop{border-color:rgba(199,70,52,.35);padding:0;overflow:hidden}
51-
.plan-pop::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,var(--red),var(--accent2))}
52-
.plan-hero-zone{text-align:center;padding:40px 40px 28px;
53-
background:linear-gradient(180deg,rgba(199,70,52,.12) 0%,rgba(199,70,52,.03) 60%,transparent 100%);
50+
.plan-pop{border-color:rgba(199,70,52,.45);padding:0;overflow:hidden;
51+
box-shadow:0 4px 30px rgba(199,70,52,.12),0 1px 3px rgba(0,0,0,.2);
52+
transform:scale(1.02)}
53+
.plan-pop:hover{transform:scale(1.02) translateY(-4px);box-shadow:0 12px 48px rgba(199,70,52,.18),0 0 20px rgba(199,70,52,.08)}
54+
.plan-pop::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--red),var(--accent2))}
55+
.plan-hero-zone{text-align:center;padding:44px 40px 30px;
56+
background:linear-gradient(180deg,rgba(199,70,52,.18) 0%,rgba(199,70,52,.06) 50%,transparent 100%);
5457
position:relative}
55-
.plan-pop .plan-badge{margin-bottom:14px}
56-
.plan-orig-price{font-size:.95rem;color:var(--text-muted);text-decoration:line-through;margin-bottom:4px}
57-
.plan-big-price{font-size:4.5rem;font-weight:900;color:var(--text);line-height:1;margin-bottom:8px;font-family:var(--display);letter-spacing:-2px}
58-
.plan-yen{font-size:1.6rem;font-weight:700;color:var(--red-glow);vertical-align:super;margin-right:2px}
59-
.plan-save-tag{display:inline-block;background:rgba(199,70,52,.15);color:var(--red-glow);
60-
font-size:.75rem;font-weight:700;padding:4px 14px;border-radius:20px;margin-bottom:10px;letter-spacing:.5px}
58+
.plan-pop .plan-badge{margin-bottom:10px}
59+
.plan-pop .plan-name{font-size:1.6rem;margin-bottom:12px}
60+
.plan-orig-price{font-size:.95rem;color:var(--text-muted);text-decoration:line-through;margin-bottom:6px}
61+
.plan-big-price{font-size:5rem;font-weight:900;color:var(--text);line-height:1;margin-bottom:10px;font-family:var(--display);letter-spacing:-2px}
62+
.plan-yen{font-size:1.8rem;font-weight:700;color:var(--red-glow);vertical-align:super;margin-right:2px}
63+
.plan-save-tag{display:inline-block;background:rgba(199,70,52,.2);color:var(--red-glow);
64+
font-size:.78rem;font-weight:700;padding:5px 16px;border-radius:20px;margin-bottom:12px;letter-spacing:.5px;
65+
border:1px solid rgba(199,70,52,.2)}
6166
.plan-buy-type{font-size:.82rem;color:var(--text-dim);letter-spacing:1px}
6267
.plan-pop .plan-divider{margin:0 40px 20px}
6368
.plan-pop .plan-features{padding:0 40px;margin-bottom:24px}
@@ -149,8 +154,10 @@
149154

150155
@media(max-width:768px){
151156
.plans-grid{grid-template-columns:1fr}
157+
.plan-pop{transform:none}
158+
.plan-pop:hover{transform:translateY(-4px)}
152159
.plan-hero-zone{padding:32px 24px 22px}
153-
.plan-big-price{font-size:3.5rem}
160+
.plan-big-price{font-size:3.8rem}
154161
.plan-pop .plan-divider{margin:0 24px 16px}
155162
.plan-pop .plan-features{padding:0 24px}
156163
.plan-pop .plan-btn{margin:0 24px}
@@ -257,6 +264,7 @@ <h1 class="anim-up grad-text" data-i18n="prTitle">选择适合您的版本</h1>
257264
<div class="plan plan-pop reveal">
258265
<div class="plan-hero-zone">
259266
<div class="plan-badge" data-i18n="planPaidBadge">限时特惠</div>
267+
<div class="plan-name" data-i18n="planPaidName">专业版</div>
260268
<div class="plan-orig-price" data-i18n="planOrigPrice">¥999</div>
261269
<div class="plan-big-price"><span class="plan-yen">¥</span><span data-i18n="planBigNum">99</span></div>
262270
<div class="plan-save-tag" data-i18n="planSaveTag">立省 ¥900</div>

0 commit comments

Comments
 (0)