first commit
This commit is contained in:
@@ -0,0 +1,37 @@
|
||||
import { clsx } from "clsx";
|
||||
import { HTMLAttributes } from "react";
|
||||
|
||||
interface CardProps extends HTMLAttributes<HTMLDivElement> {
|
||||
padding?: boolean;
|
||||
}
|
||||
|
||||
export function Card({ className, padding = true, children, ...props }: CardProps) {
|
||||
return (
|
||||
<div
|
||||
className={clsx(
|
||||
"rounded-xl border border-border bg-surface",
|
||||
padding && "p-6",
|
||||
className
|
||||
)}
|
||||
{...props}
|
||||
>
|
||||
{children}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
export function CardHeader({ className, children, ...props }: HTMLAttributes<HTMLDivElement>) {
|
||||
return (
|
||||
<div className={clsx("mb-4 flex items-center justify-between", className)} {...props}>
|
||||
{children}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
export function CardTitle({ className, children, ...props }: HTMLAttributes<HTMLHeadingElement>) {
|
||||
return (
|
||||
<h2 className={clsx("text-lg font-semibold text-text-primary", className)} {...props}>
|
||||
{children}
|
||||
</h2>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user