fix: remove all unnecessary animations from all pages

- Remove dead code animations (animate-in, fade-in, slide-in, zoom-in, shake) from tailwindcss-animate plugin (not installed)
- Remove decorative transition effects (transition-all, transition-colors) from all page components
- Remove scale effects (active:scale-95) from buttons
- Remove bounce animations (animate-bounce) from icons
- Keep functional animate-spin on loading spinners as they provide essential loading feedback

Affected pages: Dashboard, Timestamp, Jwt, JsonTools, Base64Converter, HtmlToMarkdown, MarkdownToHtml, QrCode, TextStatistics
This commit is contained in:
雨霖铃
2026-05-25 20:29:12 +08:00
parent af2262d2c9
commit 0f3b6c4cd8
23 changed files with 64 additions and 83 deletions
+3 -9
View File
@@ -50,7 +50,7 @@ const ResultView = React.memo(
return (
<div
className={cn(
'flex-1 flex items-center justify-center text-sm font-medium border border-dashed border-border/60 rounded-xl py-12 px-4 text-center text-muted-foreground bg-muted/20 min-h-[320px] animate-in fade-in duration-200',
'flex-1 flex items-center justify-center text-sm font-medium border border-dashed border-border/60 rounded-xl py-12 px-4 text-center text-muted-foreground bg-muted/20 min-h-[320px]',
className,
)}
{...props}
@@ -61,13 +61,7 @@ const ResultView = React.memo(
}
return (
<div
className={cn(
'animate-in fade-in slide-in-from-bottom-2 duration-300 flex flex-col w-full',
className,
)}
{...props}
>
<div className={cn('flex flex-col w-full', className)} {...props}>
{/* 顶部小标签 */}
<span className="block text-muted-foreground/90 mb-2.5 text-xs font-semibold tracking-wider uppercase">
{t('timestamp:resultLabel')}
@@ -78,7 +72,7 @@ const ResultView = React.memo(
对齐 shadcn 官方卡片风格,使用 bg-card、border-border 构筑多层级阴影。
核心数值直接拉粗为 text-foreground (在黑夜模式下会自动转为大气的纯白,完美避开刺眼强光)
*/}
<div className="bg-card text-card-foreground border border-border p-4 sm:p-5 rounded-xl relative mb-3.5 shadow-sm flex justify-between items-center gap-4 focus-within:ring-1 focus-within:ring-ring transition-all">
<div className="bg-card text-card-foreground border border-border p-4 sm:p-5 rounded-xl relative mb-3.5 shadow-sm flex justify-between items-center gap-4 focus-within:ring-1 focus-within:ring-ring">
<span className="font-mono font-extrabold text-foreground break-all text-xl sm:text-2xl tracking-tight leading-tight select-all tabular-nums">
{result}
</span>