Card

Superfície de conteúdo com borda e fundo para agrupar informações relacionadas.

Uso

<script setup lang="ts">
import { Card } from '@halfbyte/maka'
</script>

<template>
  <Card>
    <h3>Título do card</h3>
    <p>Conteúdo do card.</p>
  </Card>
</template>

Variantes

<Card variant="default">…</Card>
<Card variant="ghost">…</Card>

Sem padding

<Card :no-padding="true">
  <img src="…" />
  <div style="padding: 12px">Texto</div>
</Card>

Props

Prop	Tipo	Padrão
variant	"default" | "ghost"	"default"
noPadding	boolean	false

Slots

Slot	Descrição
default	Conteúdo do card