rows — Lattice component

rows

LayoutSplitMixed

Two components stacked on one slide, one above the other.

Open in Playground
Variant

Use when two wide components make one point together: progress over the table behind it, a line of context over a chart.

overviewsummarydashboardstatus

When to use

  • Two wide components. A table, a timeline or a progress list reads across the slide. Stack two of them rather than squeezing each into half the width.
  • Context over evidence. A short content pane on top says what happened; the chart or table below shows it. Give the evidence the larger share: rows ratio-35-65.

When not to use

  • Two unrelated points. Two panes are one argument. If the halves say different things, make two slides.
  • A tall component. A component that needs height (a quote, a kpi row, radar) does not read in a band; the engine re-orients or splits the slide, and lint:deck says so (pane-arrange).
  • Three or more things. A pane layout holds two panes. Three parallel items are cards-stack or list.

Common mistakes

  • A ## inside a pane. A ## starts a new slide. Use ### for a pane's title and #### for a heading inside a pane.
  • Naming a component in the layout's _class (_class: columns bar). Each pane names its own component: <!-- _pane: bar --> above the pane's ###.

Authoring

<!-- _class: rows -->

## The slide's point, in one line.

### Top pane

- A point
- Another point

### Bottom pane

- A point
- Another point

Slots

SlotSelectorRequiredDescription
headingh2yesThe slide's title, above both panes. It makes the point; the panes support it.
panelat-paneyesTwo panes, top then bottom. Each opens with <!-- _pane: component --> (optional; default content) and an optional ### title, a short label naming what the pane holds.

Variants

no-rule — no rule

Drops the rule between the panes.

<!-- _class: rows ratio-35-65 no-rule -->

## Three regions carried the quarter.

### What happened

Two renewals and a price rise lifted EMEA and APAC; North America held.

<!-- _pane: bar -->
### Revenue by region
`$M, Q3`

- North America `4.2`
- EMEA `3.1`
- APAC `1.8`

Related

  • columnsthe two components read better side by side
  • cards-stackthree or more parallel items, stacked
  • split-panelone featured element beside supporting points