Top Navigation

Navegación horizontal en lugar de barra lateral, para apps con pocas secciones.

A Acme

Overview

The panels below are the part you replace.

Wide panel

Spans two columns, because the thing it holds is worth twice the space of the one beside it. Unequal panels are how a grid says what matters.

Narrow panel

A list, a summary, a set of shortcuts — whatever fits in a third.

Third

Three equal panels underneath, for content with no hierarchy between it.

Fourth

Same weight as the one before it.

Fifth

And the one after.

La disposición

Una cabecera a todo el ancho con la marca, la navegación principal y el menú de cuenta, sobre una columna de contenido centrada. La forma a la que recurrir cuando las secciones caben en una línea.

Código del layout

TypeScript
Cargando el editor…

La disposición, con los datos de ejemplo en arrays planos al final. Cámbialos por los tuyos y la plantilla deja de ser un ejemplo.

Los layouts se quedan sin marca a propósito: sin degradados, sin logotipos, sin fotos de stock y sin nada traído de terceros. Si buscas una sección terminada en vez de una forma que rellenar, la galería de bloques es la otra pestaña.