style(frontend): print styles for detail drawers (Cmd-P paper records)

This commit is contained in:
Tyler
2026-06-20 17:09:04 -06:00
parent 4cd52c3084
commit 8523772792
+82
View File
@@ -277,3 +277,85 @@
text-wrap: balance;
}
}
/* ----------------------------------------------------------------------
Print styles — a clean paper-record rendering of detail drawers.
When an operator hits Cmd-P / Ctrl-P with the ClaimDrawer (or the
future RemitDrawer) open, we strip the app chrome (sidebar, header,
close button, skeletons, animations, dark theme), collapse the
dialog to a static full-width block, and let its section headers +
tables flow onto the page without internal scrolling or backdrop
bleed. Result: a readable, ink-friendly paper trail of the claim.
---------------------------------------------------------------------- */
@media print {
/* Hide the app chrome — only the drawer content matters on paper */
aside, /* sidebar */
header, /* app header within Layout */
[data-print="hide"],
button[aria-label^="Close"] {
display: none !important;
}
/* Reset the dark theme for ink savings and readability */
:root {
--background: #ffffff;
--foreground: #000000;
--card: #ffffff;
--card-foreground: #000000;
--muted: #f5f5f5;
--muted-foreground: #444444;
--border: #cccccc;
--accent: #1a1a1a;
}
/* Reset the page surface */
body {
background: #ffffff !important;
color: #000000 !important;
}
/* Drawer becomes a static block at full width */
[role="dialog"] {
position: static !important;
inset: auto !important;
width: 100% !important;
max-width: 100% !important;
height: auto !important;
transform: none !important;
background: #ffffff !important;
box-shadow: none !important;
border: none !important;
}
/* Strip backdrop + animations */
[data-state="open"][data-radix-dialog-overlay],
.animate-fade-in,
.animate-shimmer,
.animate-scan {
animation: none !important;
transition: none !important;
}
/* Show the panel contents without internal scrolling */
[role="dialog"] * {
overflow: visible !important;
}
/* Tables break gracefully */
table {
page-break-inside: avoid;
}
/* Avoid splitting a section header from its content */
section,
h1, h2, h3 {
page-break-after: avoid;
}
/* Honor reduced motion (also applies to print preview) */
*,
*::before,
*::after {
animation-duration: 0s !important;
}
}