Case com mídia ao lado do título e play acessível; problema de cada cliente reescrito com base nos dados; serviços relacionados em 2 cards; FAQ antes do próximo passo e bloco 'Onde já apliquei isso'; Apolo citada em IoT e arquitetura. metaTitle até 43 caracteres e descrições até 155 com teste; JSON-LD CreativeWork; imagens de compartilhamento abaixo de 100 KB; 404 e robots corrigidos; server-only nos módulos com node:.
31 lines
919 B
TypeScript
31 lines
919 B
TypeScript
import Link from "next/link";
|
|
|
|
/** Trilha de navegação sobre fundo escuro, no topo das páginas internas. O último item é a página atual. */
|
|
export function Breadcrumb({
|
|
items,
|
|
}: {
|
|
items: readonly { label: string; href: string }[];
|
|
}) {
|
|
return (
|
|
<nav aria-label="Trilha de navegação" className="mb-sp-6">
|
|
<ol className="flex flex-wrap items-center gap-sp-2 text-[15px]">
|
|
{items.map(({ label, href }, index) => (
|
|
<li
|
|
key={href}
|
|
className={index > 0 ? "flex items-center gap-sp-2" : undefined}
|
|
>
|
|
{index > 0 ? <span aria-hidden="true">/</span> : null}
|
|
<Link
|
|
aria-current={index === items.length - 1 ? "page" : undefined}
|
|
className="ds-link ds-link-text"
|
|
href={href}
|
|
>
|
|
{label}
|
|
</Link>
|
|
</li>
|
|
))}
|
|
</ol>
|
|
</nav>
|
|
);
|
|
}
|