flows.md · documentação · Blocos

:::rows#

Uma lista de ajustes ou de fatos, uma linha por item: o título, uma dica embaixo, e na ponta o que a última linha do item tiver — um valor, um botão, um interruptor, um menu, uma etiqueta. É a tela de ajustes de um aplicativo, escrita em markdown.

Ao vivo#

:::rows
**Notas dos leitores**

Quem lê pode marcar um trecho e deixar uma nota ao lado.

`switch:on`
---
**Resumo semanal por e-mail**

Toda segunda, o que mudou nas suas páginas.

`switch:off`
---
**Idioma**

`dropdown:Português`
---
**Plano**

`pill:accent:Pro`
---
[**Endereço e domínio**](/@docs/site)

`pill:warn:Esperando o DNS`
:::

Os itens se separam por ---. Uma linha cujo título é um link abre de qualquer ponto dela, com uma seta na ponta. Os controles são desenhados, não ligados a nada: mostram um estado, como numa captura de tela que se pode editar.

Os controles#

Cada um é um código curto entre crases, e serve em qualquer lugar da página:

:::rows inset:card
**Interruptor**

`switch:on`
---
**Menu**

`dropdown:Sistema`
---
**Etiqueta**

`pill:ok:Ativo`
---
**Avatar**

`avatar:ME`
---
**Teclas**

`kbd:⌘ K`
---
**Antes e depois**

`delta:down:88%→45%`
:::

As etiquetas têm os tons ok, warn, info, danger e accent.

Argumentos#

• inset — none (o padrão) traça linhas finas entre os itens na própria página; card põe as linhas num painel arredondado, como os ajustes de um celular.
• space — 1, 2 (o padrão) ou 3: o espaço acima e abaixo de cada linha.
• end — last (o padrão) põe a última linha na ponta; none deixa tudo embaixo do título.

Com um :::shell ao redor, vira uma tela de aplicativo inteira.