Spaces:
Build error
Build error
Upload components/ui/card.jsx with huggingface_hub
Browse files- components/ui/card.jsx +57 -0
components/ui/card.jsx
ADDED
|
@@ -0,0 +1,57 @@
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 1 |
+
import * as React from "react"
|
| 2 |
+
import { cn } from "@/lib/utils"
|
| 3 |
+
|
| 4 |
+
const Card = React.forwardRef(({ className, ...props }, ref) => (
|
| 5 |
+
<div
|
| 6 |
+
ref={ref}
|
| 7 |
+
className={cn(
|
| 8 |
+
"rounded-lg border bg-card text-card-foreground shadow-sm",
|
| 9 |
+
className
|
| 10 |
+
)}
|
| 11 |
+
{...props}
|
| 12 |
+
/>
|
| 13 |
+
))
|
| 14 |
+
Card.displayName = "Card"
|
| 15 |
+
|
| 16 |
+
const CardHeader = React.forwardRef(({ className, ...props }, ref) => (
|
| 17 |
+
<div
|
| 18 |
+
ref={ref}
|
| 19 |
+
className={cn("flex flex-col space-y-1.5 p-6", className)}
|
| 20 |
+
{...props}
|
| 21 |
+
/>
|
| 22 |
+
))
|
| 23 |
+
CardHeader.displayName = "CardHeader"
|
| 24 |
+
|
| 25 |
+
const CardTitle = React.forwardRef(({ className, ...props }, ref) => (
|
| 26 |
+
<h3
|
| 27 |
+
ref={ref}
|
| 28 |
+
className={cn("text-2xl font-semibold leading-none tracking-tight", className)}
|
| 29 |
+
{...props}
|
| 30 |
+
/>
|
| 31 |
+
))
|
| 32 |
+
CardTitle.displayName = "CardTitle"
|
| 33 |
+
|
| 34 |
+
const CardDescription = React.forwardRef(({ className, ...props }, ref) => (
|
| 35 |
+
<p
|
| 36 |
+
ref={ref}
|
| 37 |
+
className={cn("text-sm text-muted-foreground", className)}
|
| 38 |
+
{...props}
|
| 39 |
+
/>
|
| 40 |
+
))
|
| 41 |
+
CardDescription.displayName = "CardDescription"
|
| 42 |
+
|
| 43 |
+
const CardContent = React.forwardRef(({ className, ...props }, ref) => (
|
| 44 |
+
<div ref={ref} className={cn("p-6 pt-0", className)} {...props} />
|
| 45 |
+
))
|
| 46 |
+
CardContent.displayName = "CardContent"
|
| 47 |
+
|
| 48 |
+
const CardFooter = React.forwardRef(({ className, ...props }, ref) => (
|
| 49 |
+
<div
|
| 50 |
+
ref={ref}
|
| 51 |
+
className={cn("flex items-center p-6 pt-0", className)}
|
| 52 |
+
{...props}
|
| 53 |
+
/>
|
| 54 |
+
))
|
| 55 |
+
CardFooter.displayName = "CardFooter"
|
| 56 |
+
|
| 57 |
+
export { Card, CardHeader, CardTitle, CardDescription, CardContent, CardFooter }
|