From ffc6b7414fdd89179e2260937d2e778e85189409 Mon Sep 17 00:00:00 2001 From: ljy Date: Wed, 29 Jul 2026 23:02:06 +0800 Subject: [PATCH] =?UTF-8?q?fix:=E4=BF=AE=E6=94=B9=E9=A6=96=E9=A1=B5?= =?UTF-8?q?=E7=9A=84=E5=8A=A8=E7=94=BB?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/App.css | 46 ++++++++++++++++++++++++++++++++++++---------- 1 file changed, 36 insertions(+), 10 deletions(-) diff --git a/src/App.css b/src/App.css index b4a3809..911d431 100644 --- a/src/App.css +++ b/src/App.css @@ -960,7 +960,6 @@ blockquote cite { .tech-grid article, .ports-grid article, .partner-list span, -.qr-card, .stage-panel { border: 1px solid var(--tech-line); background: var(--tech-card); @@ -1182,15 +1181,35 @@ blockquote cite { .qr-card { display: grid; justify-items: center; - gap: 1rem; - padding: 1.75rem; + align-self: center; + gap: 1.35rem; + margin-block: 1.75rem; + padding: 3.75rem 1.75rem 3.5rem; + border: 1px solid rgba(201, 154, 69, 0.2); + border-radius: 1.25rem; + background: rgba(255, 255, 255, 0.045); + box-shadow: inset 0 1px 0 rgba(255, 244, 223, 0.06); + backdrop-filter: blur(1.125rem); } .qr-card img { - width: 15rem; - height: 15rem; - border-radius: 1.125rem; + width: 14.5rem; + height: 14.5rem; + padding: 0.65rem; + border-radius: 0.75rem; background: #fff; + box-sizing: border-box; + object-fit: contain; +} + +.qr-card span { + max-width: 13.5rem; + margin: 0; + color: rgba(255, 244, 223, 0.72); + font-size: 0.8125rem; + letter-spacing: 0.08em; + line-height: 1.6; + text-align: center; } .footer { @@ -1852,8 +1871,8 @@ blockquote cite { bottom: 3.625rem; } @keyframes floatBottle { - 0%, 100% { transform: translateY(0); } - 50% { transform: translateY(-0.75rem); } + 0%, 100% { transform: translateY(0) rotate(-10deg); } + 50% { transform: translateY(-2rem) rotate(0deg); } } @media (max-width: 1100px) { @@ -2143,13 +2162,20 @@ blockquote cite { } .qr-card { - padding: 0.75rem !important; - gap: 0.5rem !important; + margin-block: clamp(0.75rem, 2vh, 1.5rem) !important; + padding: 2.25rem 0.9rem 2.1rem !important; + gap: 0.85rem !important; } .qr-card img { width: min(28vh, 11rem) !important; height: min(28vh, 11rem) !important; + padding: 0.45rem !important; +} + +.qr-card span { + font-size: clamp(0.7rem, 1.2vh, 0.8125rem) !important; + line-height: 1.5 !important; } .contact-person strong {