五つのカラム

画面よりも広い五つの領域が横に並んでおり、横にスクロールして読むことができます。左側のナビゲーションはその一部ではなく、ページの領域であり、その位置は変わりません。

行はスクロールし、ページはスクロールしない

`zone--split--scroll`は行にオーバーフローを追加します：カラムはそれぞれ指定した幅を保ち、分割部分はその下でスクロールします。それぞれのカラムは自分自身の垂直オーバーフローを持っているため、長いカラムはその場所でスクロールします。

各カラムは自分の幅を指定する

ここには余裕がないため、残りを取るものはありません：行は意図的にページよりも長くなっています。サイズを指定しない領域は、何かを保持するのに十分な幅のカラムに戻り、これらはそれぞれの幅を指定します — 各24rem、合計五つです。

領域を折りたたむ

ここにあるすべてのカラムは`zone-collapsible`です。折りたたまれた状態でも消えず、行の中でその位置と基盤を保ち、バーは横に回転します — そのため、折りたたむボタンが開くボタンとなり、外部はそれが存在することを知る必要はありません。

名前が付けられた領域は記憶されます：状態はその名前の下にUI状態に書き込まれ、ページが提供されるときに再び読み取られ、目の前で折りたたまれるのではなく折りたたまれた状態で届きます。第三のカラムは折りたたまれた状態で開き、最後のカラムはVueによって描画されます — 同じコンポーネント、同じクラス、同じキーです。