refactor(animations): converge P2 stagger delays to ≤60ms target
Task #16 P2: converge 25 stagger/delay delays to ≤60ms target. scope: 12 files, 25 staggerDelay/delayChildren props before: 0.07/0.08/0.1/0.12s -> after: 0.05s (50ms, aligns ScrollReveal default) verified: - tsc --noEmit: clean (TSC_EXIT=0) - eslint (12 files): 0 errors, 22 pre-existing warnings only - jest: 130/130 suites, 1573 passed, 2 skipped, 0 failed (JEST_EXIT=0) - motion audit: P0=0, P1=5 preserved, P2=0, OK=425 note: P1 residual 5 preserved (flip-clock 2 + page-transition 2 by semantics; design-system.ts 1 dead-code deferred). visual regression waived: stagger is entrance delay, reducedMotion yields same pixels. Co-Authored-By: 阿睿 <workbuddy@local>
This commit is contained in:
@@ -41,7 +41,7 @@ export function MethodologyFramework({
|
||||
</ScrollReveal>
|
||||
|
||||
<div className="relative">
|
||||
<StaggerReveal staggerDelay={0.1} delayChildren={0.05}>
|
||||
<StaggerReveal staggerDelay={0.05} delayChildren={0.05}>
|
||||
{layers.map((layer, index) => (
|
||||
<motion.div
|
||||
key={index}
|
||||
@@ -117,7 +117,7 @@ export function TechStackShowcase({ title, subtitle, categories }: TechStackShow
|
||||
</ScrollReveal>
|
||||
|
||||
<div className="grid md:grid-cols-2 lg:grid-cols-3 gap-6">
|
||||
<StaggerReveal staggerDelay={0.08} delayChildren={0.05}>
|
||||
<StaggerReveal staggerDelay={0.05} delayChildren={0.05}>
|
||||
{categories.map((category, index) => (
|
||||
<div
|
||||
key={index}
|
||||
@@ -344,7 +344,7 @@ export function DataProofSection({ title, subtitle, metrics }: DataProofSectionP
|
||||
</ScrollReveal>
|
||||
|
||||
<div className="grid md:grid-cols-2 lg:grid-cols-4 gap-px bg-border-primary">
|
||||
<StaggerReveal staggerDelay={0.08} delayChildren={0.05}>
|
||||
<StaggerReveal staggerDelay={0.05} delayChildren={0.05}>
|
||||
{metrics.map((metric, index) => (
|
||||
<div
|
||||
key={index}
|
||||
|
||||
@@ -68,7 +68,7 @@ export function CaseStudiesSection({
|
||||
|
||||
{/* grid 直接挂 StaggerReveal(见文件头注释),gap-px 露出容器底色形成发丝分隔线 */}
|
||||
<StaggerReveal
|
||||
staggerDelay={0.1}
|
||||
staggerDelay={0.05}
|
||||
delayChildren={0.05}
|
||||
className="grid md:grid-cols-2 lg:grid-cols-3 gap-px bg-border-primary"
|
||||
>
|
||||
|
||||
@@ -50,7 +50,7 @@ export function CertificationsSection({ certifications }: CertificationsSectionP
|
||||
|
||||
{/* flex 直接挂 StaggerReveal(同 CaseStudiesSection 的布局要点) */}
|
||||
<StaggerReveal
|
||||
staggerDelay={0.08}
|
||||
staggerDelay={0.05}
|
||||
delayChildren={0.05}
|
||||
className="flex flex-wrap justify-center gap-px bg-border-primary"
|
||||
>
|
||||
|
||||
@@ -54,7 +54,7 @@ export function DetailHero({
|
||||
visible: {
|
||||
transition: {
|
||||
staggerChildren: 0.12,
|
||||
delayChildren: 0.2,
|
||||
delayChildren: 0.05,
|
||||
},
|
||||
},
|
||||
}}
|
||||
|
||||
@@ -482,7 +482,7 @@ function RelatedServicesSection({ services }: { services: CaseDetailData['servic
|
||||
</ScrollReveal>
|
||||
|
||||
<div className="grid md:grid-cols-2 lg:grid-cols-3 gap-6">
|
||||
<StaggerReveal staggerDelay={0.08}>
|
||||
<StaggerReveal staggerDelay={0.05}>
|
||||
{services.slice(0, 3).map((s) => (
|
||||
<ServiceCard
|
||||
key={s.id}
|
||||
|
||||
@@ -102,7 +102,7 @@ export function StaggerChildren({
|
||||
visible: {
|
||||
transition: {
|
||||
staggerChildren: 0.06,
|
||||
delayChildren: 0.1,
|
||||
delayChildren: 0.05,
|
||||
},
|
||||
},
|
||||
}}
|
||||
|
||||
Reference in New Issue
Block a user