Card
Komponen card dengan slot header, konten, dan footer.
bun x bosia@latest add cardCard dengan sub-komponen komposabel: Card, CardHeader, CardTitle, CardDescription, CardContent, dan CardFooter.
Preview
Welcome
Get started with Bosia components
This is an interactive card preview. Click the button below.
Props
| Prop | Type | Default |
|---|---|---|
class |
string |
"" |
Semua sub-komponen (CardHeader, CardTitle, CardDescription, CardContent, CardFooter) menerima class dan bersifat opsional.
Penggunaan
<script lang="ts">
import {
Card,
CardHeader,
CardTitle,
CardDescription,
CardContent,
CardFooter,
} from "$lib/components/ui/card";
import { Button } from "$lib/components/ui/button";
</script>
<Card>
<CardHeader>
<CardTitle>Welcome</CardTitle>
<CardDescription>Get started with Bosia</CardDescription>
</CardHeader>
<CardContent>
<p>Your content here.</p>
</CardContent>
<CardFooter>
<Button>Continue</Button>
</CardFooter>
</Card>Card Minimal
Semua sub-komponen bersifat opsional:
<Card class="p-6">
<p>Simple content card.</p>
</Card>