Layout & Espaçamento
Visão ao vivo
Seção intitulada “Visão ao vivo”Base: grid inspirado em Bootstrap (.container, .container-fluid, .row, .col-[n], breakpoints xs/sm/md/lg/xl/xxl), sem prefixo mds- (é fundação, não componente).
Densidade: média-alta — o produto prioriza mostrar mais dado por tela (tabelas, kanbans, cards compactos) mantendo respiro suficiente para uso prolongado.
Escala de espaçamento (--mds-spacing-*)
Seção intitulada “Escala de espaçamento (--mds-spacing-*)”| Token | px |
|---|---|
xs |
4 |
sm |
8 |
md |
16 |
lg |
24 |
xl |
32 |
xxl |
40 |
xxxl |
48 |
md (16px) é o padrão quando nenhum tamanho é especificado.
As classes utilitárias que aplicam esta escala (
.padding-{pos}--{tam},.margin-{pos}--{tam},.gap--{tam},.d-flexe o resto do grid/flexbox) são utilitário de fundação, não conceito de spacing — catálogo exato na skillmds-style(agent-skills/SKILL.md), seção “Utility Classes Cheat Sheet”.