diff options
author | polwex <polwex@sortug.com> | 2025-05-15 10:13:00 +0700 |
---|---|---|
committer | polwex <polwex@sortug.com> | 2025-05-15 10:13:00 +0700 |
commit | d56594d3289002566f4653d607f0837befd65109 (patch) | |
tree | f69685b458419566a78727ce6a8cecd0cdc269a5 /src/components/ui/card.tsx | |
parent | 04509d9207603d9055cf022051763ec05c9214d6 (diff) |
wtf man
Diffstat (limited to 'src/components/ui/card.tsx')
-rw-r--r-- | src/components/ui/card.tsx | 68 |
1 files changed, 68 insertions, 0 deletions
diff --git a/src/components/ui/card.tsx b/src/components/ui/card.tsx new file mode 100644 index 0000000..3ff199b --- /dev/null +++ b/src/components/ui/card.tsx @@ -0,0 +1,68 @@ +import * as React from "react" + +import { cn } from "@/lib/utils" + +function Card({ className, ...props }: React.ComponentProps<"div">) { + return ( + <div + data-slot="card" + className={cn( + "bg-card text-card-foreground rounded-xl border shadow-sm", + className + )} + {...props} + /> + ) +} + +function CardHeader({ className, ...props }: React.ComponentProps<"div">) { + return ( + <div + data-slot="card-header" + className={cn("flex flex-col gap-1.5 p-6", className)} + {...props} + /> + ) +} + +function CardTitle({ className, ...props }: React.ComponentProps<"div">) { + return ( + <div + data-slot="card-title" + className={cn("leading-none font-semibold tracking-tight", className)} + {...props} + /> + ) +} + +function CardDescription({ className, ...props }: React.ComponentProps<"div">) { + return ( + <div + data-slot="card-description" + className={cn("text-muted-foreground text-sm", className)} + {...props} + /> + ) +} + +function CardContent({ className, ...props }: React.ComponentProps<"div">) { + return ( + <div + data-slot="card-content" + className={cn("p-6 pt-0", className)} + {...props} + /> + ) +} + +function CardFooter({ className, ...props }: React.ComponentProps<"div">) { + return ( + <div + data-slot="card-footer" + className={cn("flex items-center p-6 pt-0", className)} + {...props} + /> + ) +} + +export { Card, CardHeader, CardFooter, CardTitle, CardDescription, CardContent } |