refactor(animations): converge P1 motion durations to ≤300ms target
- 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: 阿睿 <workbuddy@tencent.com>
This commit is contained in:
@@ -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 }}
|
||||
>
|
||||
<StaticLink
|
||||
href={`/news/${newsItem.id}`}
|
||||
className="group relative block border border-border-primary hover:border-brand/30 bg-white transition-all duration-500 hover:-translate-y-2 overflow-hidden h-full"
|
||||
className="group relative block border border-border-primary hover:border-brand/30 bg-white transition-all duration-150 hover:-translate-y-2 overflow-hidden h-full"
|
||||
>
|
||||
<div className="absolute top-0 left-0 bottom-0 w-1 bg-brand scale-y-0 group-hover:scale-y-100 transition-transform duration-500 origin-top" />
|
||||
<div className="absolute top-0 left-0 bottom-0 w-1 bg-brand scale-y-0 group-hover:scale-y-100 transition-transform duration-150 origin-top" />
|
||||
|
||||
{newsItem.image && !imageError ? (
|
||||
<div className="aspect-video bg-bg-secondary overflow-hidden">
|
||||
@@ -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"
|
||||
/>
|
||||
</div>
|
||||
) : (
|
||||
|
||||
Reference in New Issue
Block a user