style(components): 统一背景模糊元素尺寸单位

将多个组件中的背景模糊元素尺寸从像素值改为rem单位
修复hero-section中bg-gradient-to-r拼写错误
调整cases-section中背景渐变类名拼写
This commit is contained in:
张翔
2026-03-28 22:53:01 +08:00
parent dd2a0999bb
commit 45e96e2fe4
4 changed files with 9 additions and 9 deletions
+3 -3
View File
@@ -55,8 +55,8 @@ export function CasesSection() {
return (
<section id="cases" role="region" aria-labelledby="cases-heading" className="py-24 bg-white relative overflow-hidden" ref={ref}>
<div className="absolute top-1/3 left-0 w-[400px] h-[400px] bg-[rgba(196,30,58,0.03)] rounded-full blur-3xl" />
<div className="absolute top-1/3 right-0 w-[300px] h-[300px] bg-[rgba(196,30,58,0.02)] rounded-full blur-3xl" />
<div className="absolute top-1/3 left-0 w-100 h-100 bg-[rgba(196,30,58,0.03)] rounded-full blur-3xl" />
<div className="absolute top-1/3 right-0 w-75 h-75 bg-[rgba(196,30,58,0.02)] rounded-full blur-3xl" />
<div className="container-wide relative z-10">
<motion.div
@@ -90,7 +90,7 @@ export function CasesSection() {
>
<Link href={`/cases/${caseItem.slug}`}>
<Card className="h-full group cursor-pointer border-[#E5E5E5] hover:border-[#C41E3A] transition-colors overflow-hidden">
<div className="relative h-40 bg-gradient-to-br from-[#F5F5F5] to-[#E5E5E5] flex items-center justify-center">
<div className="relative h-40 bg-linear-to-br from-[#F5F5F5] to-[#E5E5E5] flex items-center justify-center">
<Building2 className="w-16 h-16 text-[#C41E3A]/20 group-hover:scale-110 transition-transform duration-300" />
<div className="absolute top-4 right-4">
<Badge className="bg-white/90 text-[#1C1C1C] hover:bg-white">
@@ -77,7 +77,7 @@ export function HeroDescription(_props: HeroContentProps) {
<div className="mb-10">
<BlurReveal delay={0.3}>
<p className="text-xl sm:text-2xl text-[#4A5568] mb-4">
<span className="font-semibold bg-gradient-to-r from-[#C41E3A] via-[#E04A68] to-[#C41E3A] bg-clip-text text-transparent">
<span className="font-semibold bg-linear-to-r from-[#C41E3A] via-[#E04A68] to-[#C41E3A] bg-clip-text text-transparent">
</span>
</p>
@@ -157,7 +157,7 @@ export function HeroStats() {
useEffect(() => {
const statsEl = document.getElementById('stats-section');
if (!statsEl) return;
if (!statsEl) {return;}
const observer = new IntersectionObserver(
([entry]) => {
+2 -2
View File
@@ -61,8 +61,8 @@ export function ProductsSection({ config }: ProductsSectionProps) {
return (
<section id="products" role="region" aria-labelledby="products-heading" className="py-24 bg-[#F5F7FA] relative overflow-hidden" ref={ref}>
<div className="absolute top-1/2 left-0 w-[400px] h-[400px] bg-[rgba(79,70,229,0.03)] rounded-full blur-3xl" />
<div className="absolute top-1/3 right-0 w-[300px] h-[300px] bg-[rgba(196,30,58,0.02)] rounded-full blur-3xl" />
<div className="absolute top-1/2 left-0 w-100 h-100 bg-[rgba(79,70,229,0.03)] rounded-full blur-3xl" />
<div className="absolute top-1/3 right-0 w-75 h-75 bg-[rgba(196,30,58,0.02)] rounded-full blur-3xl" />
<div className="container-wide relative z-10">
<motion.div
initial={{ opacity: 0, y: 20 }}
+2 -2
View File
@@ -66,8 +66,8 @@ export function ServicesSection({ config }: ServicesSectionProps) {
return (
<section id="services" aria-labelledby="services-heading" className="py-24 bg-white relative overflow-hidden" ref={ref}>
<div className="absolute top-1/3 left-0 w-[400px] h-[400px] bg-[rgba(196,30,58,0.03)] rounded-full blur-3xl" />
<div className="absolute top-1/3 right-0 w-[300px] h-[300px] bg-[rgba(196,30,58,0.02)] rounded-full blur-3xl" />
<div className="absolute top-1/3 left-0 w-100 h-100 bg-[rgba(196,30,58,0.03)] rounded-full blur-3xl" />
<div className="absolute top-1/3 right-0 w-75 h-75 bg-[rgba(196,30,58,0.02)] rounded-full blur-3xl" />
<div className="container-wide relative z-10">
<motion.div