Design system/Foundations
Printing
Reports and pages are printable: the header, dock, toasts, dialogs, and anything with the .no-print class are hidden in print, the background turns white, and the page column takes the full width of the paper.
In codeapp/globals.css (@media print)components/page-header.tsx (actionsClassName)
Rules
- Buttons and controls mean nothing in print: give them no-print.
- In PageHeader, pass no-print to actionsClassName, not className, or the title gets removed from print too.
- Folio export builds its own print HTML and saves it to the Library; that path is for official documents.
- Color isn't enough to carry meaning in print; status always has text too.
<PageHeader title={…} actions={…} actionsClassName="no-print" />
<div className="no-print">…</div>Related pages