kurihada
0c5676493e
- UserAvatar: 统一头像渲染（5 种尺寸），新增 resolveAvatar 工具函数，替换 SwipeDeck 和 RoomManageModal 中的重复逻辑 - Input: 统一表单输入样式（4 种尺寸 + default/purple 变体），替换 AuthModal、ProfilePage、BlindboxPage 共 12 处 - Card: 统一卡片容器样式 + 可选淡入动画和延迟，替换 ProfilePage 中 7 处重复的 motion.div
38 lines
724 B
TypeScript
38 lines
724 B
TypeScript
import { motion } from "framer-motion";
|
|
import type { ReactNode } from "react";
|
|
|
|
interface CardProps {
|
|
children: ReactNode;
|
|
className?: string;
|
|
animated?: boolean;
|
|
delay?: number;
|
|
}
|
|
|
|
const fadeUp = {
|
|
initial: { y: 10, opacity: 0 },
|
|
animate: { y: 0, opacity: 1 },
|
|
} as const;
|
|
|
|
export default function Card({
|
|
children,
|
|
className = "",
|
|
animated = false,
|
|
delay,
|
|
}: CardProps) {
|
|
const cls = `rounded-2xl bg-surface p-4 ring-1 ring-border ${className}`;
|
|
|
|
if (animated) {
|
|
return (
|
|
<motion.div
|
|
className={cls}
|
|
{...fadeUp}
|
|
transition={delay ? { delay } : undefined}
|
|
>
|
|
{children}
|
|
</motion.div>
|
|
);
|
|
}
|
|
|
|
return <div className={cls}>{children}</div>;
|
|
}
|