25 lines
742 B
Markdown
25 lines
742 B
Markdown
---
|
|
category: Layout
|
|
---
|
|
|
|
# Section
|
|
|
|
One horizontal band of the page. It carries the vertical air above and below its content,
|
|
which is the single biggest reason the site reads as composed rather than busy. Put a
|
|
Container inside it; never put page margins on the Section itself.
|
|
|
|
`spacing="tight"` for a subordinate band, `spacing="intro"` for a page head, where the air
|
|
above is full and the air below is reduced so the content follows the title.
|
|
|
|
`tone="night"` makes this band a night surface and flips the ink tokens inside it.
|
|
|
|
```jsx
|
|
<Section tone="night" spacing="tight">
|
|
<Container>
|
|
<Heading>Verifiable, not asserted.</Heading>
|
|
</Container>
|
|
</Section>
|
|
```
|
|
|
|
Astro equivalent: `<section class="section section--tight night">`.
|