feat: 移动端UI精致化优化

- 添加页面过渡动画(淡入+滑动)
- 优化统计卡片视觉,添加渐变色和微动效
- 实现列表项左滑删除手势(编辑+删除按钮)
- 优化底部导航,缩小高度并添加点击波纹效果
- 改进空状态,添加插画和引导按钮

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
Developer
2026-03-18 16:48:42 +08:00
co-authored by Claude
parent af3fcbea96
commit 349760b60c
6 changed files with 466 additions and 40 deletions
+27
View File
@@ -0,0 +1,27 @@
import { Icon } from './icons';
export default function EmptyState({
icon = 'info',
title = '暂无数据',
description = '这里还没有内容',
action,
actionLabel,
onAction,
}) {
return (
<div className="empty-state-enhanced">
<div className="empty-state-illustration">
<div className="empty-state-bg">
<Icon name={icon} size={32} />
</div>
</div>
<h3 className="empty-state-title">{title}</h3>
{description && <p className="empty-state-description">{description}</p>}
{action && (
<button type="button" className="btn btn-primary empty-state-action" onClick={onAction}>
{actionLabel}
</button>
)}
</div>
);
}