# Steps ledger

> A process set as a printed schedule: a ruled column-head row (No., Stage, What happens) and then five full-width rows, each one a display numeral, a title and a short description in three columns, hairlines in currentColor between them and a closing rule under the last. The numerals and the column heads make it read in order, which is what lets the same table serve as a conference agenda. States no colour and no font of its own.

Canonical: https://patternpaste.com/pattern/steps-ledger.html
Section: How it works
Access: Included in Pattern Paste access.
Needs: Requires a block theme on WordPress 7.0 to 7.1. Classic themes and page builders are outside our supported setup. Adaptive patterns use the block theme’s colour, spacing and typography presets; styled variations declare their own colours or type.
Blocks: column, columns, group, heading, paragraph
Keywords: steps, process, how it works, ledger, schedule, agenda, numbered

## Variations (3)

### Day schedule (the default)

Identical markup in every theme.

Five numbered stages as ruled rows on your base, with your contrast on top and every hairline in currentColor, so the rules follow your text wherever your theme puts it.

### Cobalt and chalk

This variation states its own colours and states its own type: identical in every theme.

States chalk paper, deep ink and cobalt numerals and rules, with Arial Narrow headings.

### Night schedule

Identical markup in every theme.

The colour axis, done the only way the contract guarantees: the whole table inverts to your contrast with your base on it, and the rules follow the type because they are currentColor. Every theme has both slugs, so this arrives everywhere.


---

## The signature moment: it reads as a printed schedule

**The signature is the column-head row.** Above the first stage sits a strip of
three tiny, widely-tracked uppercase labels: `No.`, `Stage`, `What happens`. It
costs almost nothing and it changes what the section is. Without it, five
numbered rows are a list. With it, the eye reads a document that has columns,
which means the rows are entries and the order is load-bearing.

That is also what gives the pattern its second job. **The same table is a
conference agenda.** Change `No.` to `Time`, put `09:30` where `01` is, and the
process becomes a running order without touching a single style. Nothing in the
markup knows which of the two it is: the numeral column is a paragraph, not an
ordered list, precisely so it can hold a time, a date or a week number instead
of a count.

It is deliberately not the other ledger in the catalogue. `faq-ledger` is a
two-column question and answer where the reader picks a row and skips the rest;
this one is read top to bottom, and the numeral column is the reason. It is also
not `steps-run`, which threads four steps across a single hairline.

## What it inherits from your theme

- **The typeface.** No font family is stated anywhere. Serif theme, geometric
  sans theme, either way the numerals and the labels are set in your face, and
  the tracking on the labels is what carries the schedule feeling rather than a
  chosen face.
- **Your colours.** The ground asks for `base`, the type asks for `contrast`,
  and both fall back to core's white and black, which no theme can remove. Every
  rule in the table is `currentColor`, so the hairlines are whatever colour your
  text is: they cannot resolve to nothing, and they cannot drift away from the
  type when you recolour the section.
- **Your spacing scale.** Section padding and row padding are spacing presets, so
  a theme with a generous scale gets an airier schedule and a tight one gets a
  denser one.

## What it decides for itself

- **Full bleed with its own measure.** The section spans the viewport and holds
  its content to 1240px, so the hairlines run as long rules rather than as short
  dashes in a body column.
- **Its own ground and its own vertical padding.** It states both, because it is
  built to sit between other sections on a page and cannot borrow air from a
  neighbour or assume what colour that neighbour is.
- **The three column widths**, 12/30/58. The numeral column is narrow enough that
  the numbers form a hard vertical edge down the left, and wide enough that a
  two-digit numeral or a time never wraps.
- **The reading measure inside the wide column.** The description sits in a
  nested constrained group at 34rem, so the copy runs at about 65 characters
  instead of the 700px the column would otherwise give it.
- **The display ramp.** The numerals are a `clamp()` running to 3.25rem at
  line-height 1, set against 13px labels with 0.2em tracking. The scale collision
  between those two is what stops the table looking like a spreadsheet.
- **The closing rule.** The last row carries a bottom border as well as a top
  one, so the table closes instead of trailing off.

Below 782px WordPress stacks the columns, and each stage becomes numeral, then
title, then description, still between its hairlines. The column-head row stacks
with them and reads as three small labels at the top of the table.

## What to change first

1. **The five stages.** Titles are one or two words on purpose; the description
   is one sentence that says what happens and what the reader ends up holding.
   Add or delete a row by duplicating a row group, and remember to move the
   bottom border onto whichever row is last.
2. **The numerals.** They are plain text. `01`-`05`, `Week 1`-`Week 5`, or
   `09:30`-`16:00` all fit the column as authored.
3. **The column heads.** `No. / Stage / What happens` is the schedule reading. If
   you want a quieter section, delete that one row group and the table becomes a
   plain ruled list.
4. **The heading and the lede.** The heading is built for six to nine words. The
   lede is held to 40rem so it breaks into two or three lines rather than running
   the full band.
5. **The footnote.** The tracked line under the table is optional. It exists to
   put one condition on the whole schedule; delete it and nothing shifts.
6. **The ground.** Ship the base on a light page and the `night-schedule`
   variation where the page needs a hard change of ground.

## The styled variation

**Cobalt and chalk** keeps the printed schedule on chalk paper, with cobalt numerals, rules and Arial Narrow headings.

## Notes

- Core blocks only: group, paragraph, heading, columns, column. No plugin, no
  script, nothing to keep updated.
- Every colour is a fallback chain ending on a colour WordPress itself
  guarantees, and every rule is `currentColor`, so nothing in the table can
  resolve to nothing.
- The numeral column is not a `core/list`. An ordered list would renumber itself
  and would refuse a time, and it would put the count inside the same block as
  the title, which is exactly the three-column separation this pattern is for.

## Display type

Off the theme's ladder on purpose, because the size is the composition:
- paragraph at clamp(2rem, 3.6vw, 3.25rem)
