diff --git a/frontend/src/pages/front/LandingPage.css b/frontend/src/pages/front/LandingPage.css index 397850a..f1c3590 100644 --- a/frontend/src/pages/front/LandingPage.css +++ b/frontend/src/pages/front/LandingPage.css @@ -96,9 +96,8 @@ /* 右侧广告位:min-width:0 让其严格贴合网格右轨道,右边框与顶栏"免费注册"垂直对齐、绝不外溢 */ .lp-hero-ad { display: flex; flex-direction: column; min-width: 0; } -.lp-ad-head { display: flex; align-items: baseline; gap: var(--space-md); margin-bottom: var(--space-lg); flex-wrap: wrap; } -.lp-ad-title { font-size: var(--text-lg); font-weight: 700; color: var(--color-text-primary); } -.lp-ad-sub { font-size: var(--text-sm); color: var(--color-text-tertiary); } +.lp-ad-head { display: flex; justify-content: center; align-items: center; margin-bottom: var(--space-lg); } +.lp-ad-title { font-size: var(--text-lg); font-weight: 700; color: var(--color-text-primary); text-align: center; } .lp-hero-ad .lp-carousel { width: 100%; } .lp-hero-ad .lp-carousel-card { min-height: 340px; } .lp-hero-ad .lp-cc-content { max-width: 62%; } @@ -136,14 +135,14 @@ .lp-arrow { position: absolute; top: 50%; transform: translateY(-50%); z-index: 3; - width: 44px; height: 44px; border-radius: 50%; border: none; cursor: pointer; - background: rgba(255,255,255,.85); color: var(--color-accent); display: flex; align-items: center; justify-content: center; - box-shadow: var(--shadow-md); transition: all var(--transition-normal); + width: 44px; height: 44px; border-radius: 50%; border: 1px solid rgba(255,255,255,.6); cursor: pointer; + background: rgba(255,255,255,.5); color: var(--color-accent); display: flex; align-items: center; justify-content: center; + backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px); box-shadow: none; transition: all var(--transition-normal); } -.lp-arrow:hover { background: #fff; transform: translateY(-50%) scale(1.05); } +.lp-arrow:hover { background: rgba(255,255,255,.85); transform: translateY(-50%) scale(1.05); } .lp-arrow-l { left: 12px; } .lp-arrow-r { right: 12px; } .lp-dots { display: flex; justify-content: center; gap: var(--space-sm); margin-top: var(--space-lg); } -.lp-dot { width: 8px; height: 8px; border-radius: 50%; border: none; background: var(--color-border-hover); cursor: pointer; transition: all var(--transition-fast); } +.lp-dot { width: 8px; height: 8px; border-radius: 50%; border: none; background: rgba(91,95,237,.28); cursor: pointer; transition: all var(--transition-fast); } .lp-dot.on { width: 24px; border-radius: var(--radius-full); background: var(--color-accent); } /* ===== 栅格 ===== */ diff --git a/frontend/src/pages/front/LandingPage.tsx b/frontend/src/pages/front/LandingPage.tsx index 2d0401f..76fc9a6 100644 --- a/frontend/src/pages/front/LandingPage.tsx +++ b/frontend/src/pages/front/LandingPage.tsx @@ -234,7 +234,6 @@ const LandingPage: React.FC = () => { {banners.length > 0 && (
精选推荐 - 热门技能广告位 · 提升展现与下载
)}
setIsPaused(true)} onMouseLeave={() => setIsPaused(false)}>