From 495f6d4ecaf4be055eff56dc9866cc998da40143 Mon Sep 17 00:00:00 2001 From: zhangxiang Date: Thu, 3 Sep 2026 21:34:52 +0800 Subject: [PATCH] =?UTF-8?q?refactor(animations):=20converge=20P1=20motion?= =?UTF-8?q?=20durations=20to=20=E2=89=A4300ms=20target?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 151 scripted + 1 manual duration fixes across 46 files - framer entrance 0.5/0.6s -> 0.3s - Tailwind hover -> duration-150, entrance -> duration-300 - preserve flip-clock/page-transition per semantic decision - design-system.ts dead-code deferred - P1 violations 156 -> 5; P0 remains 0; OK class 249 -> 400 - verified: tsc clean, eslint 0 errors - verified: 130/130 jest suites, 1573 passed - verified: visual regression 46/46 zero-pixel diff Co-Authored-By: 阿睿 --- .../(marketing)/about/about-content-v4.tsx | 4 ++-- .../(marketing)/about/brand/brand-content.tsx | 8 +++---- .../(marketing)/cases/cases-content-v3.tsx | 8 +++---- src/app/(marketing)/home-content-v15.tsx | 2 +- .../news/[slug]/NewsDetailClient.tsx | 6 ++--- src/app/(marketing)/news/news-content-v3.tsx | 8 +++---- .../news/news-detail-content-v3.tsx | 8 +++---- .../erp-upgrade/erp-upgrade-content-v2.tsx | 12 +++++----- .../products/product-detail-content-v3.tsx | 8 +++---- .../products/products-content-v3.tsx | 8 +++---- .../products/standalone/[id]/client.tsx | 8 +++---- .../services/service-detail-content-v4.tsx | 10 ++++---- .../services/services-content-v3.tsx | 2 +- .../solutions/solution-detail-content-v3.tsx | 18 +++++++------- .../solutions/solutions-content-v3.tsx | 2 +- src/app/(marketing)/team/team-content-v3.tsx | 24 +++++++++---------- src/app/(marketing)/template.tsx | 2 +- src/components/content/sections.tsx | 10 ++++---- src/components/content/testimonials.tsx | 6 ++--- src/components/detail/detail-case-study.tsx | 2 +- src/components/detail/detail-cta-section.tsx | 4 ++-- src/components/detail/detail-hero.tsx | 6 ++--- .../detail/detail-product-value.tsx | 6 ++--- .../detail/detail-trust-section.tsx | 10 ++++---- src/components/detail/list-page-hero.tsx | 14 +++++------ src/components/detail/product-card.tsx | 4 ++-- src/components/detail/service-value.tsx | 6 ++--- .../detail/solution-service-card.tsx | 6 ++--- src/components/detail/solution-value.tsx | 10 ++++---- src/components/sections/case-card.tsx | 4 ++-- src/components/sections/case-detail-page.tsx | 6 ++--- src/components/sections/challenge-section.tsx | 2 +- src/components/sections/cta-section.tsx | 4 ++-- src/components/sections/hero-section-v2.tsx | 6 ++--- src/components/sections/industry-grid.tsx | 8 +++---- src/components/sections/insight-card.tsx | 4 ++-- .../sections/methodology-section.tsx | 2 +- src/components/sections/product-card.tsx | 10 ++++---- .../sections/product-matrix-section.tsx | 2 +- src/components/sections/question-card.tsx | 2 +- src/components/sections/section-header.tsx | 6 ++--- src/components/sections/service-card.tsx | 2 +- .../sections/social-proof-section.tsx | 8 +++---- src/components/sections/why-us-section.tsx | 8 +++---- src/components/ui/brand-visuals.tsx | 2 +- src/components/ui/stats-showcase.tsx | 4 ++-- 46 files changed, 151 insertions(+), 151 deletions(-) diff --git a/src/app/(marketing)/about/about-content-v4.tsx b/src/app/(marketing)/about/about-content-v4.tsx index b1a4fab..aa02803 100644 --- a/src/app/(marketing)/about/about-content-v4.tsx +++ b/src/app/(marketing)/about/about-content-v4.tsx @@ -134,7 +134,7 @@ function MetricsStrip({ data }: { data: AboutData }) { initial={{ opacity: 0, y: 20 }} whileInView={{ opacity: 1, y: 0 }} viewport={{ once: true, margin: '-80px' }} - transition={{ duration: 0.6, delay: i * 0.08, ease: EASE_OUT }} + transition={{ duration: 0.3, delay: i * 0.08, ease: EASE_OUT }} className="text-center lg:text-left" >
@@ -264,7 +264,7 @@ function MilestonesSection({ data }: { data: AboutData }) { initial={{ opacity: 0, x: -20 }} whileInView={{ opacity: 1, x: 0 }} viewport={{ once: true, margin: '-60px' }} - transition={{ duration: 0.6, delay: idx * 0.08, ease: EASE_OUT }} + transition={{ duration: 0.3, delay: idx * 0.08, ease: EASE_OUT }} className="relative pl-8 sm:pl-12 md:pl-16 pb-10 sm:pb-12 md:pb-14 last:pb-0" >
diff --git a/src/app/(marketing)/about/brand/brand-content.tsx b/src/app/(marketing)/about/brand/brand-content.tsx index 58addb4..06aa798 100644 --- a/src/app/(marketing)/about/brand/brand-content.tsx +++ b/src/app/(marketing)/about/brand/brand-content.tsx @@ -75,7 +75,7 @@ export default function BrandContent() { @@ -106,7 +106,7 @@ export default function BrandContent() { {brandStats.map((stat, i) => ( @@ -125,7 +125,7 @@ export default function BrandContent() { 公司于 2026 年 1 月正式成立,核心团队专注企业数字化,从战略规划到系统落地,致力于陪伴每一家企业实现可衡量的业务改善。 @@ -162,7 +162,7 @@ export default function BrandContent() { {brandValues.map((item, i) => (
-
+
diff --git a/src/app/(marketing)/cases/cases-content-v3.tsx b/src/app/(marketing)/cases/cases-content-v3.tsx index 77e8831..febe0e6 100644 --- a/src/app/(marketing)/cases/cases-content-v3.tsx +++ b/src/app/(marketing)/cases/cases-content-v3.tsx @@ -25,10 +25,10 @@ function CaseCard({ caseItem, index }: { caseItem: CaseStudy; index: number }) { initial={{ opacity: 0, y: 20 }} whileInView={{ opacity: 1, y: 0 }} viewport={{ once: true, margin: '-60px' }} - transition={{ duration: 0.6, delay: index * 0.06, ease: EASE_OUT }} - className="group relative block overflow-hidden border border-border-primary hover:border-border-secondary bg-white hover:bg-bg-secondary transition-all duration-500 flex flex-col h-full" + transition={{ duration: 0.3, delay: index * 0.06, ease: EASE_OUT }} + className="group relative block overflow-hidden border border-border-primary hover:border-border-secondary bg-white hover:bg-bg-secondary transition-all duration-150 flex flex-col h-full" > -
+
@@ -207,7 +207,7 @@ export default function CasesContentV3({ initial={{ opacity: 0, y: 20 }} whileInView={{ opacity: 1, y: 0 }} viewport={{ once: true, margin: '-80px' }} - transition={{ duration: 0.6, delay: i * 0.08, ease: EASE_OUT }} + transition={{ duration: 0.3, delay: i * 0.08, ease: EASE_OUT }} className="text-center lg:text-left" >
({ + const rise = (y: number, delay: number, duration = 0.3) => ({ initial: reduceMotion ? {} : { opacity: 0, y }, animate: reduceMotion ? {} : { opacity: 1, y: 0 }, transition: { duration: reduceMotion ? 0 : duration, delay: reduceMotion ? 0 : delay, ease: EASE_OUT }, diff --git a/src/app/(marketing)/news/[slug]/NewsDetailClient.tsx b/src/app/(marketing)/news/[slug]/NewsDetailClient.tsx index d38fb92..456fe5e 100644 --- a/src/app/(marketing)/news/[slug]/NewsDetailClient.tsx +++ b/src/app/(marketing)/news/[slug]/NewsDetailClient.tsx @@ -40,7 +40,7 @@ export function NewsDetailClient({ news }: NewsDetailClientProps) { @@ -67,7 +67,7 @@ export function NewsDetailClient({ news }: NewsDetailClientProps) { initial={shouldReduceMotion ? {} : { opacity: 0, y: 20 }} whileInView={{ opacity: 1, y: 0 }} viewport={{ once: true }} - transition={{ duration: 0.6, ease: EASE }} + transition={{ duration: 0.3, ease: EASE }} className="max-w-4xl" > {/* Featured Image */} @@ -110,7 +110,7 @@ export function NewsDetailClient({ news }: NewsDetailClientProps) { {related.title} ) : (
diff --git a/src/app/(marketing)/news/news-content-v3.tsx b/src/app/(marketing)/news/news-content-v3.tsx index f1f0051..e97cd65 100644 --- a/src/app/(marketing)/news/news-content-v3.tsx +++ b/src/app/(marketing)/news/news-content-v3.tsx @@ -23,13 +23,13 @@ function NewsCard({ newsItem, index }: { newsItem: NewsItem; index: number }) { initial={{ opacity: 0, y: 20 }} whileInView={{ opacity: 1, y: 0 }} viewport={{ once: true, margin: '-80px' }} - transition={{ duration: 0.5, delay: index * 0.08, ease: EASE_OUT }} + transition={{ duration: 0.3, delay: index * 0.08, ease: EASE_OUT }} > -
+
{newsItem.image && !imageError ? (
@@ -37,7 +37,7 @@ function NewsCard({ newsItem, index }: { newsItem: NewsItem; index: number }) { src={newsItem.image} alt={newsItem.title} onError={() => setImageError(true)} - className="w-full h-full object-cover group-hover:scale-105 transition-transform duration-700" + className="w-full h-full object-cover group-hover:scale-105 transition-transform duration-150" />
) : ( diff --git a/src/app/(marketing)/news/news-detail-content-v3.tsx b/src/app/(marketing)/news/news-detail-content-v3.tsx index b5c7c6c..cb385f1 100644 --- a/src/app/(marketing)/news/news-detail-content-v3.tsx +++ b/src/app/(marketing)/news/news-detail-content-v3.tsx @@ -15,20 +15,20 @@ function RelatedNewsCard({ news, index }: { news: NewsItem; index: number }) { initial={{ opacity: 0, y: 20 }} whileInView={{ opacity: 1, y: 0 }} viewport={{ once: true, margin: '-80px' }} - transition={{ duration: 0.5, delay: index * 0.1, ease: EASE_OUT }} + transition={{ duration: 0.3, delay: index * 0.1, ease: EASE_OUT }} > -
+
{news.image ? ( {news.title} ) : (
diff --git a/src/app/(marketing)/products/erp-upgrade/erp-upgrade-content-v2.tsx b/src/app/(marketing)/products/erp-upgrade/erp-upgrade-content-v2.tsx index 5ad723c..fc0a5ec 100644 --- a/src/app/(marketing)/products/erp-upgrade/erp-upgrade-content-v2.tsx +++ b/src/app/(marketing)/products/erp-upgrade/erp-upgrade-content-v2.tsx @@ -183,9 +183,9 @@ export default function ErpUpgradeContentV2({ item }: ErpUpgradeContentV2Props) {PAIN_POINTS.map((item, index) => (
-
+
@@ -220,7 +220,7 @@ export default function ErpUpgradeContentV2({ item }: ErpUpgradeContentV2Props) {UPGRADE_BENEFITS.map((item, index) => (
@@ -254,9 +254,9 @@ export default function ErpUpgradeContentV2({ item }: ErpUpgradeContentV2Props) {FEATURE_MODULES.map((item, index) => (
-
+
@@ -357,7 +357,7 @@ export default function ErpUpgradeContentV2({ item }: ErpUpgradeContentV2Props) {certifications.map((cert, index) => (
diff --git a/src/app/(marketing)/products/product-detail-content-v3.tsx b/src/app/(marketing)/products/product-detail-content-v3.tsx index f25a4b6..613b2b8 100644 --- a/src/app/(marketing)/products/product-detail-content-v3.tsx +++ b/src/app/(marketing)/products/product-detail-content-v3.tsx @@ -136,7 +136,7 @@ function FeaturesSection({ features }: FeaturesSectionProps) { {features.map((feature, idx) => (
@@ -179,7 +179,7 @@ function BenefitsSection({ benefits }: BenefitsSectionProps) { {benefits.map((benefit, idx) => (
@@ -232,9 +232,9 @@ function ProcessSection({ process }: ProcessSectionProps) { {process.map((step, idx) => (
-
+
{idx + 1}
diff --git a/src/app/(marketing)/products/products-content-v3.tsx b/src/app/(marketing)/products/products-content-v3.tsx index c2e761e..de8116a 100644 --- a/src/app/(marketing)/products/products-content-v3.tsx +++ b/src/app/(marketing)/products/products-content-v3.tsx @@ -67,7 +67,7 @@ function StatItem({ value, suffix, label, start, delay }: { value: number; suffi
{count}{suffix} @@ -171,7 +171,7 @@ function ProductCard({ product, size = 'small' }: { product: Product; size?: 'la initial={{ opacity: 0, y: 20 }} whileInView={{ opacity: 1, y: 0 }} viewport={{ once: true, margin: '-60px' }} - transition={{ duration: 0.6, ease: EASE_OUT }} + transition={{ duration: 0.3, ease: EASE_OUT }} className="h-full" >
@@ -445,7 +445,7 @@ function SuiteCombosSection({ products }: { products: Product[] }) {
-

+

{combo.label}

diff --git a/src/app/(marketing)/products/standalone/[id]/client.tsx b/src/app/(marketing)/products/standalone/[id]/client.tsx index abad5d9..2f53cf2 100644 --- a/src/app/(marketing)/products/standalone/[id]/client.tsx +++ b/src/app/(marketing)/products/standalone/[id]/client.tsx @@ -74,7 +74,7 @@ export function StandaloneProductClient({ item }: StandaloneProductClientProps) initial={{ opacity: 0, y: 20 }} whileInView={{ opacity: 1, y: 0 }} viewport={{ once: true }} - transition={{ duration: 0.5 }} + transition={{ duration: 0.3 }} className="max-w-3xl mx-auto text-center" >
@@ -133,7 +133,7 @@ export function StandaloneProductClient({ item }: StandaloneProductClientProps) initial={{ opacity: 0, x: -20 }} whileInView={{ opacity: 1, x: 0 }} viewport={{ once: true }} - transition={{ duration: 0.5 }} + transition={{ duration: 0.3 }} >

核心能力

{features.length > 0 ? ( @@ -167,7 +167,7 @@ export function StandaloneProductClient({ item }: StandaloneProductClientProps) initial={{ opacity: 0, y: 20 }} whileInView={{ opacity: 1, y: 0 }} viewport={{ once: true }} - transition={{ duration: 0.5 }} + transition={{ duration: 0.3 }} className="mb-10" >
@@ -210,7 +210,7 @@ export function StandaloneProductClient({ item }: StandaloneProductClientProps) initial={{ opacity: 0, y: 20 }} whileInView={{ opacity: 1, y: 0 }} viewport={{ once: true }} - transition={{ duration: 0.5 }} + transition={{ duration: 0.3 }} className="mb-10" >
diff --git a/src/app/(marketing)/services/service-detail-content-v4.tsx b/src/app/(marketing)/services/service-detail-content-v4.tsx index c86a336..2b5da9f 100644 --- a/src/app/(marketing)/services/service-detail-content-v4.tsx +++ b/src/app/(marketing)/services/service-detail-content-v4.tsx @@ -173,8 +173,8 @@ function FeaturesSection({ service }: { service: Service }) { initial={{ opacity: 0, y: 20 }} whileInView={{ opacity: 1, y: 0 }} viewport={{ once: true, margin: '-60px' }} - transition={{ duration: 0.6, delay: index * 0.06, ease: EASE_OUT }} - className="group relative p-8 sm:p-10 transition-all duration-500 hover:bg-bg-secondary hover:shadow-lg hover:-translate-y-1 bg-bg-primary" + transition={{ duration: 0.3, delay: index * 0.06, ease: EASE_OUT }} + className="group relative p-8 sm:p-10 transition-all duration-150 hover:bg-bg-secondary hover:shadow-lg hover:-translate-y-1 bg-bg-primary" >
@@ -227,8 +227,8 @@ function ProcessSection({ service }: { service: Service }) { initial={{ opacity: 0, y: 20 }} whileInView={{ opacity: 1, y: 0 }} viewport={{ once: true, margin: '-60px' }} - transition={{ duration: 0.6, delay: index * 0.08, ease: EASE_OUT }} - className="relative group p-6 sm:p-8 bg-bg-primary hover:bg-bg-secondary hover:shadow-lg hover:-translate-y-1 transition-all duration-500" + transition={{ duration: 0.3, delay: index * 0.08, ease: EASE_OUT }} + className="relative group p-6 sm:p-8 bg-bg-primary hover:bg-bg-secondary hover:shadow-lg hover:-translate-y-1 transition-all duration-150" >

diff --git a/src/app/(marketing)/services/services-content-v3.tsx b/src/app/(marketing)/services/services-content-v3.tsx index 8387ed7..67c99af 100644 --- a/src/app/(marketing)/services/services-content-v3.tsx +++ b/src/app/(marketing)/services/services-content-v3.tsx @@ -209,7 +209,7 @@ function ServicesGridSection({ services, pageCopy }: { services?: Service[]; pag initial={{ opacity: 0, y: 30 }} whileInView={{ opacity: 1, y: 0 }} viewport={{ once: true, margin: '-60px' }} - transition={{ duration: 0.6, delay: i * 0.08, ease: EASE_OUT }} + transition={{ duration: 0.3, delay: i * 0.08, ease: EASE_OUT }} > (
-
+
{idx + 1} @@ -169,9 +169,9 @@ function SolutionsSection({ solutions }: SolutionsSectionProps) { {solutions.map((solution, idx) => (
-
+
@@ -226,9 +226,9 @@ function ValuePropositionSection({ valueProposition }: ValuePropositionProps) { return (
-
+
{icon} @@ -279,9 +279,9 @@ function SuiteCombinationSection({ suiteCombination, products }: SuiteCombinatio {primaryProducts.map((product) => product && (
-
+
@@ -303,7 +303,7 @@ function SuiteCombinationSection({ suiteCombination, products }: SuiteCombinatio -
+
diff --git a/src/app/(marketing)/solutions/solutions-content-v3.tsx b/src/app/(marketing)/solutions/solutions-content-v3.tsx index 54320de..a5f64c0 100644 --- a/src/app/(marketing)/solutions/solutions-content-v3.tsx +++ b/src/app/(marketing)/solutions/solutions-content-v3.tsx @@ -129,7 +129,7 @@ function SolutionCard({ solution, index, products, featured = false }: { solutio initial={{ opacity: 0, y: 30 }} whileInView={{ opacity: 1, y: 0 }} viewport={{ once: true, margin: '-60px' }} - transition={{ duration: 0.6, delay: index * 0.08, ease: EASE_OUT }} + transition={{ duration: 0.3, delay: index * 0.08, ease: EASE_OUT }} > -
+
@@ -88,7 +88,7 @@ function StrengthCard({ strength, index }: { strength: StrengthData; index: numb

{strength.description}

-
+
); } @@ -100,14 +100,14 @@ function CultureCard({ culture, index }: { culture: CultureData; index: number } return ( -
+
@@ -120,7 +120,7 @@ function CultureCard({ culture, index }: { culture: CultureData; index: number }

{culture.description}

-
+
); } @@ -152,7 +152,7 @@ export default function TeamContentV3({ data }: { data: Record @@ -183,7 +183,7 @@ export default function TeamContentV3({ data }: { data: Record {stats.map((stat, i) => ( @@ -204,7 +204,7 @@ export default function TeamContentV3({ data }: { data: Record {teamData.heroDescription} @@ -215,7 +215,7 @@ export default function TeamContentV3({ data }: { data: Record diff --git a/src/app/(marketing)/template.tsx b/src/app/(marketing)/template.tsx index d260486..85d554f 100644 --- a/src/app/(marketing)/template.tsx +++ b/src/app/(marketing)/template.tsx @@ -12,7 +12,7 @@ const pageVariants: Variants = { opacity: 1, y: 0, transition: { - duration: 0.35, + duration: 0.3, ease: [0.16, 1, 0.3, 1] as [number, number, number, number], }, }, diff --git a/src/components/content/sections.tsx b/src/components/content/sections.tsx index ef91d07..08ea84e 100644 --- a/src/components/content/sections.tsx +++ b/src/components/content/sections.tsx @@ -49,7 +49,7 @@ export function MethodologyFramework({ initial={{ opacity: 0, x: -30 }} whileInView={{ opacity: 1, x: 0 }} viewport={{ once: true, margin: '-50px' }} - transition={{ duration: 0.6, delay: index * 0.08, ease: EASE_OUT }} + transition={{ duration: 0.3, delay: index * 0.08, ease: EASE_OUT }} >
@@ -121,7 +121,7 @@ export function TechStackShowcase({ title, subtitle, categories }: TechStackShow {categories.map((category, index) => (

{category.name}

@@ -196,7 +196,7 @@ export function DeliveryTimeline({
@@ -295,7 +295,7 @@ export function FAQSection({ title, subtitle, items }: FAQSectionProps) { height: openIndex === index ? 'auto' : 0, opacity: openIndex === index ? 1 : 0, }} - transition={{ duration: 0.4, ease: EASE_OUT }} + transition={{ duration: 0.3, ease: EASE_OUT }} className="overflow-hidden" >
@@ -348,7 +348,7 @@ export function DataProofSection({ title, subtitle, metrics }: DataProofSectionP {metrics.map((metric, index) => (
diff --git a/src/components/content/testimonials.tsx b/src/components/content/testimonials.tsx index 77e825d..01ab0b8 100644 --- a/src/components/content/testimonials.tsx +++ b/src/components/content/testimonials.tsx @@ -50,7 +50,7 @@ export function TestimonialSection({ {testimonials.map((testimonial, index) => (
@@ -94,7 +94,7 @@ export function TestimonialSection({ key={index} onClick={() => setActiveIndex(index)} className={cn( - 'h-2 rounded-full transition-all duration-500', + 'h-2 rounded-full transition-all duration-300', activeIndex === index ? 'w-8' : 'w-2 bg-border-primary hover:bg-border-secondary' @@ -133,7 +133,7 @@ export function LogoWall({ title, logos }: LogoWallProps) { initial={{ opacity: 0, y: 20 }} whileInView={{ opacity: 1, y: 0 }} viewport={{ once: true }} - transition={{ duration: 0.5, delay: index * 0.05, ease: EASE_OUT }} + transition={{ duration: 0.3, delay: index * 0.05, ease: EASE_OUT }} className="flex items-center justify-center p-8 bg-bg-primary hover:bg-bg-secondary transition-colors duration-300" >
diff --git a/src/components/detail/detail-case-study.tsx b/src/components/detail/detail-case-study.tsx index 5eed5c1..700df5e 100644 --- a/src/components/detail/detail-case-study.tsx +++ b/src/components/detail/detail-case-study.tsx @@ -14,7 +14,7 @@ export function CaseStudyCard({ study, index }: CaseStudyCardProps) { initial={{ opacity: 0, y: 20 }} whileInView={{ opacity: 1, y: 0 }} viewport={{ once: true, margin: '-50px' }} - transition={{ duration: 0.5, delay: index * 0.1 }} + transition={{ duration: 0.3, delay: index * 0.1 }} className="rounded-xl border border-gray-200 bg-white p-6 shadow-sm transition-shadow hover:shadow-md" >
diff --git a/src/components/detail/detail-cta-section.tsx b/src/components/detail/detail-cta-section.tsx index df1aa56..6d2bd38 100644 --- a/src/components/detail/detail-cta-section.tsx +++ b/src/components/detail/detail-cta-section.tsx @@ -37,7 +37,7 @@ export function DetailCTASection({ initial={{ opacity: 0, y: 32 }} whileInView={{ opacity: 1, y: 0 }} viewport={{ once: true, margin: '-100px' }} - transition={{ duration: 0.7, ease: [0.22, 1, 0.36, 1] }} + transition={{ duration: 0.3, ease: [0.22, 1, 0.36, 1] }} className="max-w-3xl" > {/* 标签 */} @@ -77,7 +77,7 @@ export function DetailCTASection({ initial={{ opacity: 0 }} whileInView={{ opacity: 1 }} viewport={{ once: true }} - transition={{ delay: 0.5, duration: 0.6 }} + transition={{ delay: 0.5, duration: 0.3 }} className="mt-10 text-sm text-white/50" > 平均响应时间 < 2小时 · 7×24小时技术支持 · 无需预付费用 diff --git a/src/components/detail/detail-hero.tsx b/src/components/detail/detail-hero.tsx index 8576f7a..c1cc531 100644 --- a/src/components/detail/detail-hero.tsx +++ b/src/components/detail/detail-hero.tsx @@ -69,7 +69,7 @@ export function DetailHero({ scale: 1, filter: 'blur(0px)', transition: { - duration: 0.7, + duration: 0.3, ease: [0.22, 1, 0.36, 1] as const, }, }, @@ -136,7 +136,7 @@ export function DetailHero({ opacity: 1, y: 0, transition: { - duration: 0.65, + duration: 0.3, delay: 0.4, ease: [0.22, 1, 0.36, 1] as const, }, @@ -156,7 +156,7 @@ export function DetailHero({ opacity: 1, y: 0, transition: { - duration: 0.6, + duration: 0.3, delay: 0.55, ease: [0.22, 1, 0.36, 1] as const, }, diff --git a/src/components/detail/detail-product-value.tsx b/src/components/detail/detail-product-value.tsx index 871370e..aaf62e4 100644 --- a/src/components/detail/detail-product-value.tsx +++ b/src/components/detail/detail-product-value.tsx @@ -147,7 +147,7 @@ export function ProductValueSection({ product }: ProductValueSectionProps) { whileInView={{ opacity: 1, y: 0 }} viewport={{ once: true }} transition={{ - duration: 0.5, + duration: 0.3, delay: index * 0.06, ease: [0.22, 1, 0.36, 1], }} @@ -188,7 +188,7 @@ export function ProductValueSection({ product }: ProductValueSectionProps) { whileInView={{ opacity: 1, x: 0 }} viewport={{ once: true }} transition={{ - duration: 0.4, + duration: 0.3, delay: index * 0.06, ease: [0.22, 1, 0.36, 1], }} @@ -223,7 +223,7 @@ export function ProductValueSection({ product }: ProductValueSectionProps) { viewport={{ once: true }} transition={{ delay: 0.3 + index * 0.05, - duration: 0.35, + duration: 0.3, ease: [0.22, 1, 0.36, 1], }} className="flex items-start gap-3 text-sm text-text-secondary" diff --git a/src/components/detail/detail-trust-section.tsx b/src/components/detail/detail-trust-section.tsx index ea706e3..e2c2f35 100644 --- a/src/components/detail/detail-trust-section.tsx +++ b/src/components/detail/detail-trust-section.tsx @@ -78,7 +78,7 @@ export function DetailTrustSection({ initial={{ opacity: 0, y: 24 }} whileInView={{ opacity: 1, y: 0 }} viewport={{ once: true, margin: '-80px' }} - transition={{ duration: 0.7, ease: [0.22, 1, 0.36, 1] }} + transition={{ duration: 0.3, ease: [0.22, 1, 0.36, 1] }} className="mb-12" >
@@ -102,7 +102,7 @@ export function DetailTrustSection({ whileInView={{ opacity: 1, y: 0 }} viewport={{ once: true, margin: '-60px' }} transition={{ - duration: 0.5, + duration: 0.3, delay: index * 0.08, ease: [0.22, 1, 0.36, 1], }} @@ -123,7 +123,7 @@ export function DetailTrustSection({ initial={{ opacity: 0, y: 24 }} whileInView={{ opacity: 1, y: 0 }} viewport={{ once: true, margin: '-80px' }} - transition={{ duration: 0.7, ease: [0.22, 1, 0.36, 1] }} + transition={{ duration: 0.3, ease: [0.22, 1, 0.36, 1] }} className="mb-12" >

@@ -139,7 +139,7 @@ export function DetailTrustSection({ whileInView={{ opacity: 1, y: 0 }} viewport={{ once: true, margin: '-60px' }} transition={{ - duration: 0.5, + duration: 0.3, delay: index * 0.08, ease: [0.22, 1, 0.36, 1], }} @@ -156,7 +156,7 @@ export function DetailTrustSection({ initial={{ opacity: 0, y: 24 }} whileInView={{ opacity: 1, y: 0 }} viewport={{ once: true, margin: '-80px' }} - transition={{ duration: 0.7, ease: [0.22, 1, 0.36, 1] }} + transition={{ duration: 0.3, ease: [0.22, 1, 0.36, 1] }} className="text-center" >

资质认证

diff --git a/src/components/detail/list-page-hero.tsx b/src/components/detail/list-page-hero.tsx index 1994aff..11ac108 100644 --- a/src/components/detail/list-page-hero.tsx +++ b/src/components/detail/list-page-hero.tsx @@ -77,7 +77,7 @@ export function ListPageHero({ initial={shouldReduceMotion ? {} : { opacity: 0, y: 20 }} whileInView={{ opacity: 1, y: 0 }} viewport={{ once: true }} - transition={{ duration: 0.6, ease: [0.16, 1, 0.3, 1] }} + transition={{ duration: 0.3, ease: [0.16, 1, 0.3, 1] }} className="max-w-4xl mx-auto text-center" > {/* Dynamic Badge */} @@ -86,7 +86,7 @@ export function ListPageHero({ initial={shouldReduceMotion ? {} : { opacity: 0, scale: 0.95, y: 8 }} whileInView={{ opacity: 1, scale: 1, y: 0 }} viewport={{ once: true }} - transition={{ delay: 0.1, duration: 0.5, ease: [0.16, 1, 0.3, 1] }} + transition={{ delay: 0.1, duration: 0.3, ease: [0.16, 1, 0.3, 1] }} className="inline-flex items-center gap-2 px-4 py-1.5 rounded-full text-sm font-medium mb-6 backdrop-blur-sm" style={{ backgroundColor: badgeStyle.bg, color: badgeStyle.text, border: `1px solid ${badgeStyle.border}` }} > @@ -100,7 +100,7 @@ export function ListPageHero({ initial={shouldReduceMotion ? {} : { opacity: 0, y: 24 }} whileInView={{ opacity: 1, y: 0 }} viewport={{ once: true }} - transition={{ delay: 0.15, duration: 0.7, ease: [0.16, 1, 0.3, 1] }} + transition={{ delay: 0.15, duration: 0.3, ease: [0.16, 1, 0.3, 1] }} className="text-4xl md:text-5xl lg:text-6xl font-bold tracking-tight mb-6 text-[var(--color-text-primary)]" > {title} @@ -111,7 +111,7 @@ export function ListPageHero({ initial={shouldReduceMotion ? {} : { opacity: 0, y: 20 }} whileInView={{ opacity: 1, y: 0 }} viewport={{ once: true }} - transition={{ delay: 0.25, duration: 0.65, ease: [0.16, 1, 0.3, 1] }} + transition={{ delay: 0.25, duration: 0.3, ease: [0.16, 1, 0.3, 1] }} className="text-lg md:text-xl max-w-2xl mx-auto leading-relaxed mb-4 text-[var(--color-text-secondary)]" > {subtitle} @@ -123,7 +123,7 @@ export function ListPageHero({ initial={shouldReduceMotion ? {} : { opacity: 0, y: 18 }} whileInView={{ opacity: 1, y: 0 }} viewport={{ once: true }} - transition={{ delay: 0.35, duration: 0.6, ease: [0.16, 1, 0.3, 1] }} + transition={{ delay: 0.35, duration: 0.3, ease: [0.16, 1, 0.3, 1] }} className="text-base max-w-xl mx-auto mb-10 text-[var(--color-text-muted)]" > {description} @@ -136,7 +136,7 @@ export function ListPageHero({ initial={shouldReduceMotion ? {} : { opacity: 0, y: 24 }} whileInView={{ opacity: 1, y: 0 }} viewport={{ once: true }} - transition={{ delay: 0.4, duration: 0.7, ease: [0.16, 1, 0.3, 1] }} + transition={{ delay: 0.4, duration: 0.3, ease: [0.16, 1, 0.3, 1] }} className="flex flex-wrap justify-center gap-8 md:gap-12 mt-12 pt-12 border-t border-[var(--color-border-primary)]" > {stats.map((stat, index) => ( @@ -145,7 +145,7 @@ export function ListPageHero({ initial={shouldReduceMotion ? {} : { opacity: 0, scale: 0.95 }} whileInView={{ opacity: 1, scale: 1 }} viewport={{ once: true }} - transition={{ delay: 0.5 + index * 0.08, duration: 0.45, ease: [0.16, 1, 0.3, 1] }} + transition={{ delay: 0.5 + index * 0.08, duration: 0.3, ease: [0.16, 1, 0.3, 1] }} className="text-center min-w-[100px]" >
diff --git a/src/components/detail/product-card.tsx b/src/components/detail/product-card.tsx index 28483ae..54cdd02 100644 --- a/src/components/detail/product-card.tsx +++ b/src/components/detail/product-card.tsx @@ -24,7 +24,7 @@ export function ProductCard({ product }: ProductCardProps) { whileInView={{ opacity: 1, y: 0 }} viewport={{ once: true }} transition={{ - duration: 0.65, + duration: 0.3, ease: [0.22, 1, 0.36, 1] as const, }} className="group" @@ -37,7 +37,7 @@ export function ProductCard({ product }: ProductCardProps) { alt={product.title} fill sizes="(max-width: 768px) 100vw, (max-width: 1200px) 50vw, 33vw" - className="object-cover group-hover:scale-105 transition-transform duration-500" + className="object-cover group-hover:scale-105 transition-transform duration-150" />
diff --git a/src/components/detail/service-value.tsx b/src/components/detail/service-value.tsx index 8caf89a..9492d22 100644 --- a/src/components/detail/service-value.tsx +++ b/src/components/detail/service-value.tsx @@ -63,7 +63,7 @@ export function ServiceValueSection({ service }: ServiceValueSectionProps) { viewport={{ once: true }} transition={{ delay: index * 0.06, - duration: 0.5, + duration: 0.3, ease: [0.22, 1, 0.36, 1], }} className="bain-card p-6" @@ -105,7 +105,7 @@ export function ServiceValueSection({ service }: ServiceValueSectionProps) { viewport={{ once: true }} transition={{ delay: index * 0.06, - duration: 0.4, + duration: 0.3, ease: [0.22, 1, 0.36, 1], }} className="bain-card p-5 flex items-start gap-3" @@ -135,7 +135,7 @@ export function ServiceValueSection({ service }: ServiceValueSectionProps) { viewport={{ once: true }} transition={{ delay: index * 0.08, - duration: 0.45, + duration: 0.3, ease: [0.22, 1, 0.36, 1], }} className="bain-card p-5" diff --git a/src/components/detail/solution-service-card.tsx b/src/components/detail/solution-service-card.tsx index dafb866..be4afda 100644 --- a/src/components/detail/solution-service-card.tsx +++ b/src/components/detail/solution-service-card.tsx @@ -37,7 +37,7 @@ export function SolutionCard({ solution }: SolutionCardProps) { whileInView={{ opacity: 1, y: 0 }} viewport={{ once: true }} transition={{ - duration: 0.65, + duration: 0.3, ease: [0.22, 1, 0.36, 1] as const, }} className="group" @@ -50,7 +50,7 @@ export function SolutionCard({ solution }: SolutionCardProps) { src={solution.image} alt={solution.title} fill - className="object-cover group-hover:scale-105 transition-transform duration-500" + className="object-cover group-hover:scale-105 transition-transform duration-150" /> ) : ( @@ -117,7 +117,7 @@ export function ServiceCard({ service }: ServiceCardProps) { whileInView={{ opacity: 1, y: 0 }} viewport={{ once: true }} transition={{ - duration: 0.65, + duration: 0.3, ease: [0.22, 1, 0.36, 1] as const, }} className="group" diff --git a/src/components/detail/solution-value.tsx b/src/components/detail/solution-value.tsx index 65f3168..512c08f 100644 --- a/src/components/detail/solution-value.tsx +++ b/src/components/detail/solution-value.tsx @@ -45,7 +45,7 @@ export function SolutionValueSection({ solution }: SolutionValueSectionProps) { initial={{ opacity: 0, x: -30 }} whileInView={{ opacity: 1, x: 0 }} viewport={{ once: true, margin: '-80px' }} - transition={{ duration: 0.7, ease: [0.22, 1, 0.36, 1] }} + transition={{ duration: 0.3, ease: [0.22, 1, 0.36, 1] }} >

@@ -63,7 +63,7 @@ export function SolutionValueSection({ solution }: SolutionValueSectionProps) { viewport={{ once: true }} transition={{ delay: index * 0.08, - duration: 0.45, + duration: 0.3, ease: [0.22, 1, 0.36, 1], }} className="flex items-start gap-3 text-text-secondary" @@ -81,7 +81,7 @@ export function SolutionValueSection({ solution }: SolutionValueSectionProps) { initial={{ opacity: 0, x: 30 }} whileInView={{ opacity: 1, x: 0 }} viewport={{ once: true, margin: '-80px' }} - transition={{ duration: 0.7, delay: 0.15, ease: [0.22, 1, 0.36, 1] }} + transition={{ duration: 0.3, delay: 0.15, ease: [0.22, 1, 0.36, 1] }} >

@@ -99,7 +99,7 @@ export function SolutionValueSection({ solution }: SolutionValueSectionProps) { viewport={{ once: true }} transition={{ delay: 0.25 + index * 0.08, - duration: 0.45, + duration: 0.3, ease: [0.22, 1, 0.36, 1], }} className="flex items-start gap-3 text-text-secondary" @@ -142,7 +142,7 @@ export function SolutionValueSection({ solution }: SolutionValueSectionProps) { viewport={{ once: true }} transition={{ delay: index * 0.08, - duration: 0.5, + duration: 0.3, ease: [0.22, 1, 0.36, 1], }} className="bain-card p-7" diff --git a/src/components/sections/case-card.tsx b/src/components/sections/case-card.tsx index 41d1aab..754c9b4 100644 --- a/src/components/sections/case-card.tsx +++ b/src/components/sections/case-card.tsx @@ -44,14 +44,14 @@ export function CaseCard({ return (
{/* Background image */} {image && ( )} -
+
{isNumeric && inView && !shouldReduceMotion ? (
diff --git a/src/components/sections/cta-section.tsx b/src/components/sections/cta-section.tsx index 55ffd8c..e6e94ab 100644 --- a/src/components/sections/cta-section.tsx +++ b/src/components/sections/cta-section.tsx @@ -40,7 +40,7 @@ export function CTASection({ initial={shouldReduceMotion ? {} : { opacity: 0, scale: 0.96, y: 16 }} whileInView={{ opacity: 1, scale: 1, y: 0 }} viewport={{ once: true, margin: '-80px' }} - transition={{ duration: 0.6, ease: [0.16, 1, 0.3, 1] }} + transition={{ duration: 0.3, ease: [0.16, 1, 0.3, 1] }} className="text-center max-w-3xl mx-auto relative" >
@@ -50,7 +50,7 @@ export function CTASection({ initial={shouldReduceMotion ? {} : { opacity: 0, y: -8 }} whileInView={{ opacity: 1, y: 0 }} viewport={{ once: true }} - transition={{ duration: 0.4, delay: 0.15 }} + transition={{ duration: 0.3, delay: 0.15 }} className="inline-flex items-center gap-2 px-4 py-1.5 rounded-full bg-[var(--color-brand-soft)] border border-[var(--color-border-primary)] mb-8" > diff --git a/src/components/sections/hero-section-v2.tsx b/src/components/sections/hero-section-v2.tsx index c1202eb..476d484 100644 --- a/src/components/sections/hero-section-v2.tsx +++ b/src/components/sections/hero-section-v2.tsx @@ -43,7 +43,7 @@ export function HeroSectionV2() { const fadeUp = (delay: number) => ({ initial: shouldReduceMotion ? {} : { opacity: 0, y: 24 }, animate: { opacity: 1, y: 0 }, - transition: { duration: 0.5, delay, ease: EASE }, + transition: { duration: 0.3, delay, ease: EASE }, }); return ( @@ -106,7 +106,7 @@ export function HeroSectionV2() {
setIsCardHovered(false)} >
- -
+ +
{item.name}
-
+
{item.count}
diff --git a/src/components/sections/insight-card.tsx b/src/components/sections/insight-card.tsx index 0e1de2e..17a3989 100644 --- a/src/components/sections/insight-card.tsx +++ b/src/components/sections/insight-card.tsx @@ -41,7 +41,7 @@ export function InsightCard({