Auth
MarkCell
The brand mark on its own brand-coloured square (Figma "Mark Cell" 184:537): the hollow white ring that opens every Tile Wall.
It fills its grid cell. Desktop rings are 52 px with a 10 px stroke, phone 34 px with 7. Not a link: on the phone wall it replaces the header, and a signed-out visitor has nowhere to go from there.
<MarkCell layout="phone" className="size-23" />Playground
Um preset por valor do primeiro eixo do Figma. Mude as props; dsState força hover, foco ou pressionado, como na matriz.
Mark Cell
Variantes, tamanhos e estados
Cada célula é o componente real, marcada com a variante do Figma que reproduz (passe o mouse pra ver o node).
Layout · Desktop
| Mark Cell |
|---|
Layout · Phone
| Mark Cell |
|---|
Props
As props que o arquivo do DS declara. O componente também repassa as do primitivo (base-ui), quando ele tem um.
| Prop | Tipo | Padrão | Descrição |
|---|---|---|---|
| layout? | "desktop" | "phone" | null | "desktop" | |
| label? | string | — | Accessible name when the mark stands for the brand on its own ("Superdinda"). Leave it out on the tile wall, where it is decoration. |
| className? | string | — |