Goldie Blocks

Two Columns — Glyphs Print, Edges Do Not

Why the card keeps one glyph column for everything that prints as words and adds an edge column for screen chrome — cards, buttons, chips, the composer — whose contents take their own inset, and how this amends the 2026-08-09 print ruling

Decision

A block card aligns on two columns, and one question decides which a surface takes: does it print? Owner ruling 2026-09-15.

  1. Anything that prints as words sits on the glyph column. Paragraph text, a field's name, question and answer, the editable name, an assistant reply. Their first letter lands on one x — the 40px gutter's edge plus --space-editable-box-text. This is the column the 2026-08-09 ruling established and it is unchanged: a form on paper has no input boxes, so text aligned on borders would print ragged.
  2. Screen chrome sits on the edge column. A card, a button, a chip, a count badge, the composer box, the About card. Its outer left edge lands on the glyph column's x, and its contents take the chrome's own inset, --space-chrome-inset, stated once as a token. Chrome never prints, so the print argument never applied to it; aligning its inner text to the outer column only made every box hang 9px into the gutter and left its contents 8px from their own border.
  3. Alignment is one level deep. A card's Label input is a printed name on screen, but it is inside chrome, so it takes the card's inset and does not reach back for the outer column. Nested alignment two levels deep is not something a reader can see.

In plain terms: the words on the page line up letter to letter, because that is how they will print. The boxes, buttons and cards around them line up frame to frame along the same ruler, and each box arranges its own insides with room to breathe.

Why

The owner's 2026-09-15 review of a block's About card found the contents cramped on the left and empty on the right. The left was not an accident: it was the glyph rule applied to a card, which put the card's border at the gutter and its text 8px in. Two reference screens (assistant-ui's message panel and its source chips) showed the alternative: a label and the border of the chip below it share an x, and the chip's text is indented by the chip's own padding. The owner: "we should be indenting things like buttons so that their left edge follows the left alignment of the text rather than trying to get the text to align … the card should align to the left edge of the text, which means that its contents would have their own alignment."

The 2026-08-09 ruling is not overturned, only bounded. It was about words on paper. It was being applied to chrome because nothing said where it stopped.

Amends

  • src/app/app.css, the comment on --space-editable-box-text (owner, 2026-08-09): still authoritative for words; no longer applies to chrome.

  • #/shared/lib/words-column-inset: wordsColumn was the glyph rule; boxedWordsColumn (a bordered surface stating 8px so its border supplies the ninth pixel) is retired, since a bordered surface is chrome and takes the edge column instead.

    wordsColumn itself is retired as a class, 2026-09-21 (GB-299), with the rule it stated intact. The Stack's rows were its only consumer, and the leading-region ruling of that date makes the gap before a card's words a grid track rather than a padding — so the words cell's own edge is the column. The reason is this page's own derivation read back: the ninth pixel is a bordered editable box's border, nothing inside a card draws one, and plain text taking 9px beside a data-own-box child taking none put a card's words on two columns (56px and 65px, measured on Widgets/DraftingEditor/Document stack). Glyph alignment for words that print is unchanged and still beats frame alignment; a surface that needs it states a track. chromeInset is untouched and still has four consumers.

  • The words-column ruler story (Shared/Molecules/WorkPanel/WordsColumn) gains a second ruler for edges and assigns each surface to one.

Consequences

  • One new token, --space-chrome-inset, for a card's or box's own contents. Its value is chosen once; the owner's steer is 12px.
  • The About card, the count badge and the composer move to the edge column and drop the outer-column inset on their contents. The About card's info icon moves into its header row so the content no longer reserves a right margin for it.
  • The Stack's rows (StackRow, StackHeaderRow) are unchanged: their plain-text children are words and stay on the glyph column; their data-own-box controls already state their own inset.

On this page