feat(ui): 共享组件补齐——Card 面色分层 + Button link/lg + 4 原子件
- Card 新增 tone(panel/card/soft)/flat/interactive;cardClass 兼容旧字符串签名 - Button 新增 link(coral 文字链) 变体与 lg 尺寸 - 新增原子件 Eyebrow(统一眉题) / StatusDot(状态点·读屏可见) / Skeleton(motion-safe 占位) / Meter(进度条·progressbar) - PageHeader/SectionHeader 用 display/title 字阶 + Eyebrow 眉题
This commit is contained in:
18
apps/web/components/ui/Skeleton.tsx
Normal file
18
apps/web/components/ui/Skeleton.tsx
Normal file
@@ -0,0 +1,18 @@
|
||||
import { cn } from "@/lib/ui/variants";
|
||||
|
||||
interface SkeletonProps {
|
||||
className?: string;
|
||||
}
|
||||
|
||||
// 加载占位:柔和线条底 + motion-safe 脉冲(尊重 prefers-reduced-motion)。
|
||||
export function Skeleton({ className }: SkeletonProps) {
|
||||
return (
|
||||
<span
|
||||
aria-hidden="true"
|
||||
className={cn(
|
||||
"block rounded-md bg-line/60 motion-safe:animate-pulse",
|
||||
className,
|
||||
)}
|
||||
/>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user