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>
26 lines
967 B
React
26 lines
967 B
React
export default function CodeSample({ label, language, code, note }) {
|
|
const lines = code.replace(/\n$/, "").split("\n");
|
|
|
|
return (
|
|
<figure className="min-w-0">
|
|
<figcaption className="mb-2.5 flex flex-wrap items-center justify-between gap-2 px-1">
|
|
<span className="text-xs font-semibold text-ink">{label}</span>
|
|
<span className="font-mono text-[0.6875rem] text-muted">{language}</span>
|
|
</figcaption>
|
|
<div className="code-panel rounded-2xl shadow-[0_18px_40px_-24px_rgba(0,0,0,0.5)]">
|
|
<pre>
|
|
<code>
|
|
{lines.map((line, index) => (
|
|
<span key={`${index}-${line}`} className="flex">
|
|
<span className="mr-4 w-6 shrink-0 select-none text-right text-[#7d8794]">{index + 1}</span>
|
|
<span className="min-w-0 whitespace-pre text-[#e9eef4]">{line || " "}</span>
|
|
</span>
|
|
))}
|
|
</code>
|
|
</pre>
|
|
</div>
|
|
{note && <p className="mt-2.5 px-1 text-xs leading-relaxed text-muted">{note}</p>}
|
|
</figure>
|
|
);
|
|
}
|