Componentes Diversos

Componentes utilitários para construção de interfaces: cards, imagens, links, quotes e mais.

Imagem responsiva com estilo padrão:

```seed
@image src=https://placehold.co/600x400, alt=Descrição
```

Gera <img class="w-full h-auto object-cover" src="..." alt="...">. A imagem é responsiva por padrão.

Container de card para agrupar conteúdo:

```seed
@card
  Conteúdo do card

@card variant=primary
  Card com borda indigo

@card variant=secondary
  Card com borda cinza
```

Link inline com estilo:

```seed
@link href=/pagina
  Texto do link

@link href=/pagina, variant=primary
  Link primário

@link href=https://github.com, target=_blank
  GitHub
```

Citação com borda lateral:

```seed
@quote
  "O Seed torna a criação de páginas incrivelmente simples."
```

(variantes de tamanho)

```seed
@button variant=small
  Pequeno

@button variant=primary
  Normal

@button variant=large
  Grande

@button variant=xl
  Extra Grande
```

Componentes HTML nativos

Qualquer tag HTML pode ser usada como componente, mesmo que não esteja registrada. O Seed renderiza como <tagname class="tagname">:

```seed
@section
  Conteúdo da section

@header class=bg-white shadow
  Cabeçalho customizado

@footer class=bg-gray-900 text-white py-8
  Rodapé customizado
```

Cria um bloco nomeado — útil para regiões editáveis ou hooks de CSS/JS:

```seed
@block name=hero-content
  Conteúdo da região hero
```

Gera:

```html
<div class="block" data-block="hero-content">
  Conteúdo da região hero
</div>
```