Print

What the platform looks like on paper — which, until now, was a solid block of ink.

Where it stood

Mint prints invoices and Harvest prints a pipeline report, and each wrote its own @media print block. The other ten apps have none — so a page printed from any of them comes out as the dark theme: a full-bleed dark background on every sheet.

Apps with print rules

of twelve

Printing the dark theme

as solid ink

Rules in Azalea before

now in tokens.css

Tokens, not body

Harvest's approach is the one kept, and the difference matters: redefining the tokens means everything downstream follows, including a component written after this file. Mint forced #fff and #000 onto html and body, which leaves every card, border and badge still painted from the dark palette on a white page.

Both explicit data-theme states are covered, because the toggle writes one and a printed page must not depend on which way somebody left it.

The fill rule breaks on paper

This is the part worth knowing. Azalea reserves solid fills for “a person must act” — and browsers drop background colours when printing. So the one signal the whole system is built around is precisely the one that disappears.

A page of runs prints with every badge looking identical

The two that needed somebody are the two nobody can find. print-color-adjust: exact asks the browser to print the fills anyway — a request, not a guarantee — so the border is the fallback: a printer that ignores the fill still shows an outlined badge where a tinted one has none.QUEUEDRUNNINGSUCCESSFAILEDNEEDS APPROVALDEAD

Three classes

Everything an app needs to control, and nothing else. Use your browser's print preview on this page to see them work.

Deployment 4e3e84f

Service: ivy
Status: NEEDS APPROVAL
Requested by: budi@example.co.id

This line is no-print; the signature line above it is print-only and appears only on paper.

Nothing splits across a page

A deployment whose status is on page 2 and whose name is on page 1 is worse than a shorter page. Cards, table rows, list items and figures all get break-inside: avoid, and a heading never sits alone at the foot of a sheet.

Service	Status	Version
ivy	SUCCESS	v41
root	NEEDS APPROVAL	v12
echo	DEAD	v7

Guidance

Use it when

Nothing. It is in tokens.css, so an app that imports the tokens already prints correctly.
no-print on controls that cannot be used on paper.
print-only for something that only makes sense printed — a signature line, a reference footer.

Reach for something else when

Writing another @media print block in an app. That is what produced two that disagree.
Hiding aside, header by element. That also hides an aside or header inside the content being printed — an invoice's own header, for instance.
A separate print route. A page outside the shell is also a page outside the session check the shell's layout performs.

Why it lives in the token layer

The same reason the prefers-reduced-motion reset does: a system that leaves this to each app leaves it out of the next one. Ten apps are the evidence. tests/print.test.ts parses the real @media print block out of tokens.css and asserts each rule, including that the list of tones the fill rule reaches for is exactly the set of tones that are actually solid — so a third solid tone cannot be added without the print rule following it.