72 lines
1.2 KiB
TypeScript
72 lines
1.2 KiB
TypeScript
import { cn } from "@/lib/utils";
|
|
|
|
export function Card({
|
|
className,
|
|
children,
|
|
}: {
|
|
className?: string;
|
|
children: React.ReactNode;
|
|
}) {
|
|
return (
|
|
<div className={cn("rounded-xl border border-white/10 bg-white/[0.02] shadow-lg shadow-black/20", className)}>
|
|
{children}
|
|
</div>
|
|
);
|
|
}
|
|
|
|
export function CardHeader({
|
|
className,
|
|
children,
|
|
}: {
|
|
className?: string;
|
|
children: React.ReactNode;
|
|
}) {
|
|
return (
|
|
<div className={cn("border-b border-white/10 px-6 py-4", className)}>
|
|
{children}
|
|
</div>
|
|
);
|
|
}
|
|
|
|
export function CardTitle({
|
|
className,
|
|
children,
|
|
}: {
|
|
className?: string;
|
|
children: React.ReactNode;
|
|
}) {
|
|
return (
|
|
<h3 className={cn("text-lg font-semibold text-white", className)}>
|
|
{children}
|
|
</h3>
|
|
);
|
|
}
|
|
|
|
export function CardContent({
|
|
className,
|
|
children,
|
|
}: {
|
|
className?: string;
|
|
children: React.ReactNode;
|
|
}) {
|
|
return (
|
|
<div className={cn("px-6 py-4", className)}>
|
|
{children}
|
|
</div>
|
|
);
|
|
}
|
|
|
|
export function CardFooter({
|
|
className,
|
|
children,
|
|
}: {
|
|
className?: string;
|
|
children: React.ReactNode;
|
|
}) {
|
|
return (
|
|
<div className={cn("border-t border-white/10 px-6 py-4", className)}>
|
|
{children}
|
|
</div>
|
|
);
|
|
}
|