Mehdi commited on
Commit
226e95e
·
verified ·
1 Parent(s): 326fa44

Upload components/ui/card.tsx with huggingface_hub

Browse files
Files changed (1) hide show
  1. components/ui/card.tsx +70 -0
components/ui/card.tsx ADDED
@@ -0,0 +1,70 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ import * as React from "react";
2
+ import { cn } from "@/lib/utils";
3
+
4
+ const Card = React.forwardRef<
5
+ HTMLDivElement,
6
+ React.HTMLAttributes<HTMLDivElement>
7
+ >(({ className, ...props }, ref) => (
8
+ <div
9
+ ref={ref}
10
+ className={cn(
11
+ "rounded-lg border bg-card text-card-foreground shadow-sm",
12
+ className
13
+ )}
14
+ {...props}
15
+ />
16
+ ));
17
+ Card.displayName = "Card";
18
+
19
+ const CardHeader = React.forwardRef<
20
+ HTMLDivElement,
21
+ React.HTMLAttributes<HTMLDivElement>
22
+ >(({ className, ...props }, ref) => (
23
+ <div ref={ref} className={cn("flex flex-col space-y-1.5 p-6", className)} {...props} />
24
+ ));
25
+ CardHeader.displayName = "CardHeader";
26
+
27
+ const CardTitle = React.forwardRef<
28
+ HTMLParagraphElement,
29
+ React.HTMLAttributes<HTMLHeadingElement>
30
+ >(({ className, ...props }, ref) => (
31
+ <h3
32
+ ref={ref}
33
+ className={cn(
34
+ "text-2xl font-semibold leading-none tracking-tight",
35
+ className
36
+ )}
37
+ {...props}
38
+ />
39
+ ));
40
+ CardTitle.displayName = "CardTitle";
41
+
42
+ const CardDescription = React.forwardRef<
43
+ HTMLParagraphElement,
44
+ React.HTMLAttributes<HTMLParagraphElement>
45
+ >(({ className, ...props }, ref) => (
46
+ <p
47
+ ref={ref}
48
+ className={cn("text-sm text-muted-foreground", className)}
49
+ {...props}
50
+ />
51
+ ));
52
+ CardDescription.displayName = "CardDescription";
53
+
54
+ const CardContent = React.forwardRef<
55
+ HTMLDivElement,
56
+ React.HTMLAttributes<HTMLDivElement>
57
+ >(({ className, ...props }, ref) => (
58
+ <div ref={ref} className={cn("p-6 pt-0", className)} {...props} />
59
+ ));
60
+ CardContent.displayName = "CardContent";
61
+
62
+ const CardFooter = React.forwardRef<
63
+ HTMLDivElement,
64
+ React.HTMLAttributes<HTMLDivElement>
65
+ >(({ className, ...props }, ref) => (
66
+ <div ref={ref} className={cn("flex items-center p-6 pt-0", className)} {...props} />
67
+ ));
68
+ CardFooter.displayName = "CardFooter";
69
+
70
+ export { Card, CardHeader, CardFooter, CardTitle, CardDescription, CardContent };