```meta
title: :::rows — linhas de ajustes, com controles
description: Uma lista de ajustes ou de fatos, uma linha por item, com o valor, um interruptor, um menu ou uma etiqueta na ponta.
```

_flows.md · documentação · [Blocos](/@docs/blocks)_

# :::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`
:::

~~~text
:::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%`
:::

~~~text
:::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](/@docs/blocks/shell) ao redor, vira uma tela de aplicativo inteira.