Five columns

Five regions in a row wider than the screen, read by scrolling sideways. The navigation on the left is not one of them — it is a region of the page, and it stays where it is.

The row scrolls, the page does not

`zone--split--scroll` puts the overflow on the row: the columns keep the width they name and the split scrolls under them. Each one still holds its own vertical overflow, so a long column scrolls where it stands.

Every column names its width

Nothing takes what is left here, since there is none: the row is longer than the page on purpose. A region that names no size falls back to a column wide enough to hold something, and these name theirs — 24rem each, five of them.

Folding a region

Every column here is a `zone-collapsible`. Folded, it does not go away: it keeps its place in the row and its ground, and its bar turns on its side — so the button that folded it is the button that opens it, and nothing outside has to know it exists.

Named, a region is remembered: the state is written to the ui state under its name and read back when the page is served, so it arrives folded rather than folding under your eyes. The third column opens folded, and the last one is rendered by a vue — same component, same classes, same key.