35 lines
1021 B
TypeScript
35 lines
1021 B
TypeScript
import type { LucideIcon } from "lucide-react";
|
|
|
|
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card";
|
|
|
|
type DashboardCardProps = {
|
|
title: string;
|
|
value: string;
|
|
description: string;
|
|
icon: LucideIcon;
|
|
};
|
|
|
|
export function DashboardCard({
|
|
title,
|
|
value,
|
|
description,
|
|
icon: Icon,
|
|
}: DashboardCardProps) {
|
|
return (
|
|
<Card className="border-border/70 bg-card/95 shadow-sm">
|
|
<CardHeader className="flex flex-row items-start justify-between space-y-0 pb-3">
|
|
<div className="space-y-1">
|
|
<CardDescription>{title}</CardDescription>
|
|
<CardTitle className="text-3xl font-semibold tracking-tight">{value}</CardTitle>
|
|
</div>
|
|
<div className="rounded-nested border border-border bg-muted/60 p-2 text-muted-foreground">
|
|
<Icon className="h-4 w-4" />
|
|
</div>
|
|
</CardHeader>
|
|
<CardContent>
|
|
<p className="text-sm text-muted-foreground">{description}</p>
|
|
</CardContent>
|
|
</Card>
|
|
);
|
|
}
|