Cinco colunas

Cinco regiões em linha mais largas que a tela, lidas rolando para o lado. A navegação à esquerda não é uma delas — é uma região da página, e fica onde está.

A linha rola, a página não

`zone--split--scroll` coloca o transbordo na linha: as colunas mantêm a largura que nomeiam e o transbordo rola abaixo delas. Cada uma ainda mantém seu próprio transbordo vertical, então uma coluna longa rola onde está.

Cada coluna define sua largura

Nada ocupa o que sobrou aqui, já que não há: a linha é mais longa que a página de propósito. Uma região que não define um tamanho recua para uma coluna larga o suficiente para conter algo, e essas definem as suas — 24rem cada, cinco delas.

Dobrar uma região

Cada coluna aqui é um `zone-collapsible`. Dobrada, não desaparece: mantém seu lugar na linha e seu espaço, e sua barra se vira de lado — então o botão que a dobrou é o botão que a abre, e nada do lado de fora precisa saber que ela existe.

Nomeada, uma região é lembrada: o estado é escrito no estado da ui sob seu nome e lido de volta quando a página é servida, então ela chega dobrada em vez de dobrar aos seus olhos. A terceira coluna abre dobrada, e a última é renderizada por um vue — mesmo componente, mesmas classes, mesma chave.