edge — ux-catalog

o style guide vivo (FRONTEND.md / docs/frontend.md): os design tokens, a paleta dark preservada sobre o Tabler, e os componentes/macros Jinja compartilhados. Antes de criar um componente, cheque aqui — pode já existir. Ao adicionar uma variante, registre-a.

design tokens (:root)

a fonte da verdade da identidade. O Tabler dá o vocabulário de componentes; estes tokens carregam a paleta dark aprovada (carregados depois do Tabler, então vencem a cascata).

navegação — .site-nav

uma navegação ligando toda superfície (one app, not a pile of pages).

composer + botão — .composer

o composer compartilhado (Voz: comentário, chat, resposta, correção de nó).

vote pills — .votes / .vote

toggle capped at 1; o ativo ganha o glow accent.

artifact chips — .artifacts

thread + reply — .thread / .comment / .replies

steer cards — .steer (Direction)

set — curados (Voz)

  • priority

    um steer curado, a maior autoridade

proposed — candidatos

  • thread

    um candidato aguardando o grill — mais apagado

health metrics — .health-strip / .metric

read-model health

log cursor128 graphreachable Voz backlog3

doc/cluster list — .doc-list / .wiki-clusters

ADR

cortex inspect panel — .cortex-inspect (inspect_panel)

o painel lateral enriquecido do Cortex (Slice 3): desliza ao selecionar um nó — termo + definição, FULL DEFINITION + READ MORE, SEEN IN THE WILD (a procedência real do nó), o compositor de correção do nó Earmarked, e o fechar. O island preenche as regiões por DOM API + esc() (a defesa de breakout). Mostrado aqui como a casca vazia (não dispensada).

cortex connects-to pills — .connects-pill (connects_to_pill)

os vizinhos clicáveis (CONNECTS TO, Slice 4) na região connects do painel: clicar voa a câmera até o nó, re-renderiza o painel e escreve ?node=. O island constrói cada pill por DOM API + .textContent (a defesa de breakout — o label deriva do conteúdo do grafo). Mostrados aqui como instâncias de referência da vocabulário compartilhado.

macros Jinja — templates/components/ui.html

os macros reutilizáveis registrados. Importe com {% from "components/ui.html" import … %}.

templates

o scaffold: base.html (chrome) · partials/ (head, nav) · components/ (macros) · pages/ (cada superfície estende o base).