Lucas Rayan GuerraandClaude Sonnet 5.5
bc9ae5c036
* feat(design): redesign das páginas internas no novo design system Padroniza todas as páginas e componentes internos nos tokens e primitivos de app/globals.css, com contraste AAA (7:1) nos dois temas e alvos de toque de 44px. - Páginas reescritas: glossário, séries, série, seletor, comparador, diagnóstico, catálogo, component registry, frameworks, framework, sobre e a nova 404. - Componentes: PageHero e SectionHead novos; BoardCard, CodeExample, PinRestrictions, SeriesTabMenu e ConnectionsDiagram refeitos, com abas e diálogo acessíveis. - Remove emojis, cores avulsas por série, caixa alta com tracking, texto menor que 12px e os pares slate-*/dark:*. - Comparador: "mostrar só as diferenças" e leitura de ?chips=. - Corrige overflow em 320/390px e ajusta accent/copper do tema claro para fechar 7:1. - scripts/auditar-temas.mjs passa a travar paleta crua, dark:, texto pequeno, emoji e contraste dos tokens. Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_016W1xmizFcmXLrmabSvfSuc * ci: roda lint, auditorias de design e build em cada PR Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_016W1xmizFcmXLrmabSvfSuc --------- Co-authored-by: Claude Sonnet 5.5 <noreply@anthropic.com>
16 lines
608 B
React
16 lines
608 B
React
/** Título de seção: rótulo curto + título + frase de apoio, alinhado à esquerda. */
|
|
export default function SectionHead({ id, eyebrow, title, lede, children }) {
|
|
return (
|
|
<div className="flex flex-col gap-5 sm:flex-row sm:items-end sm:justify-between">
|
|
<div className="max-w-2xl">
|
|
{eyebrow && <p className="eyebrow">{eyebrow}</p>}
|
|
<h2 id={id} className={`section-title ${eyebrow ? "mt-3" : ""}`}>
|
|
{title}
|
|
</h2>
|
|
{lede && <p className="mt-3 text-base leading-relaxed text-muted">{lede}</p>}
|
|
</div>
|
|
{children && <div className="shrink-0">{children}</div>}
|
|
</div>
|
|
);
|
|
}
|