KKS-22 — Backend layouts with sidebars
One child page per multi-column backend layout. Each page puts a text element in every column that layout defines, and each element states the width its column must measure at a 1280px viewport.
All of them derive from the same grid: the content row is 1080px with a 60px gutter, read off Figma node 258-4460 (row 1080, gap 59, main 766, sidebar 255). A 9/3 split on that grid computes to 765/255 — so the column spans were already correct and only the gutter feeding them was wrong. The section grid was still using the old 30px $grid-gutter-width instead of the 60px gutter KKS-25 established.
| Layout | Split | Columns at 1280 |
|---|---|---|
2_columns | 9 / 3 | 765 + 255 |
2_columns_25_75 | 3 / 9 | 255 + 765, sidebar first |
2_columns_50_50 | 6 / 6 | 510 + 510 |
2_columns_offset_right | 8 / 3 | 680 + 255, 145px gutter |
3_columns | 6 / 3 / 3 | 480 + 240 + 240 |
subnavigation_left | 3 / 9 | 255 + 765 |
subnavigation_right | 9 / 3 | 765 + 255 |
subnavigation_left_2_columns | 3 / 6 / 3 | 240 + 480 + 240 |
subnavigation_right_2_columns | 6 / 3 / 3 | 480 + 240 + 240 |
Below lg every layout stacks. Two things were wrong there and are fixed: a stacked column kept subtracting a gutter it had no neighbour for, so it rendered 30px narrower than its row and left dead space on the right; and the stacked columns had no vertical separation at all. They now fill the row and sit 40px apart.
Also removed: grey debug tints that were rendering live on .maincontent-wrap and .subnav-wrap, and a hardcoded 15px left/right padding that inset content in the main and secondary columns only.