writing / 07 of 13
Grids and master layouts
Split a slide into rows and columns with grid tags. Then reuse a layout across slides with master layouts, filling their holes with slots.
Rows and columns
Three tags lay a slide out: [grid], [row] and [col], each closed with its slash form. [column] is the same as [col].
[row gap=2]
[col span=2 border=rounded pad=1]
## Left
Two thirds of what's left after the right column.
[/col]
[col width=30% border=rounded pad=1]
## Right
A fixed 30% of the row.
[/col]
[/row]An opening tag has to start its line. Leading spaces are fine, and so is following another tag directly, as in [grid][col]. A closing tag can end a line of content, which keeps a short column on one line: [col]Left[/col].
Tags inside code blocks are left alone, and a slide can show grid markup in one.
Implicit rows and columns
You don’t have to spell out every level:
- Inside a
[grid], a run of columns shares one row, and content outside any column gets a full-width row of its own. - Inside a
[row], content outside any column gets a column of its own. - A closing tag for an outer container also closes whatever is open inside it.
Grids nest: a column can hold another [grid]. If the slide ends with a tag still open, the slide shows a red ⚠ unclosed [col] line where the trouble is.
Attributes
Attributes go inside the opening tag as name=value. Quote values that contain spaces: pad="1 2".
| attribute | on | values | what it does |
|---|---|---|---|
width |
col | 20 cells, 30%, 2fr |
The column’s width. |
height |
row, grid | 8 lines, 50%, 1fr, auto |
The row’s or grid’s height. |
span |
col, row | a number above 0 | A share of the free space, like fr. Ignored when width or height is set. |
gap |
grid, row | whole cells, 0 or more | Space between rows (on a grid) or columns (on a row). A row without its own gap uses its grid’s. |
pad |
any | 1, or "1 2" for vertical then horizontal |
Padding inside the box. |
align |
any | left center right |
Horizontal alignment of the content. |
valign |
any | top middle bottom |
Vertical alignment. |
border |
any | any border name, or none |
Draws a frame around the box. |
border_color |
any | a colour | The frame’s colour. |
How space is shared
A column with no size counts as 1fr. Plain columns share the row evenly. Gaps and fixed sizes, cells and percentages, come off first, and the fr and span columns split what’s left in proportion. If the fixed sizes don’t fit, every column shrinks by the same factor.
Rows work the same way down the slide, but a row with no height is as tall as its content.
Master layouts
A master layout is a slide-shaped template with holes in it. Define it once in kyma.yaml, and any slide can fill it with master:.
masters:
two-col: |
[row gap=2]
[col span=2]
[slot content]
[/col]
[col]
[slot side]
[/col]
[/row]---
master: two-col
---
# Headline
The body of the slide.
[slot side]
- a note
- another
[/slot]master: names an entry under masters:, or a layout file. master: layouts/two-col reads layouts/two-col.md, and the file holds the same markup as a masters: entry.
Slots
A slot is a named hole: [slot side] in the layout, filled by a [slot side] … [/slot] block in the slide. A bare [slot] is the slot called content, and anything the slide writes outside a slot block goes there.
- A block in the layout,
[slot side]Nothing yet[/slot], is the slot’s default, kept when the slide doesn’t fill it. - Filling a slot twice joins the two with a blank line.
- A slot the layout doesn’t have is dropped.
- Put the closing
[/slot]at the end of a line.
On a slide without a master, slot tags are removed and their content kept in place, so a deck still reads sensibly if a layout goes missing.