import * as React from "react";
import {
Card,
CardContent,
CardDescription,
CardFooter,
CardHeader,
CardTitle,
} from "@/components/ui/ai-dimensie-card";
const settings = {
title: "Project Aurora",
description: "A short description of the project goes here.",
body: "Cards group related content into a single surface. Use them for dashboards, settings panels and previews.",
footer: "Last updated today",
};
export default function Demo({
title = settings.title,
description = settings.description,
body = settings.body,
footer = settings.footer,
}: Partial<typeof settings>) {
return (
<div className="flex min-h-[300px] items-center justify-center bg-background p-8">
<Card className="w-[380px]">
<CardHeader>
<CardTitle>{title}</CardTitle>
<CardDescription>{description}</CardDescription>
</CardHeader>
<CardContent>
<p className="text-sm text-muted-foreground">{body}</p>
</CardContent>
<CardFooter className="flex justify-end">
<span className="text-xs text-muted-foreground">{footer}</span>
</CardFooter>
</Card>
</div>
);
}
