hotel-manage-stack/reports
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Fix print layout for weekly actuals report

Browse source 
- Override overflow:hidden on .page-content and .app-shell so the full
  report flows to paper instead of clipping at screen height
- break-inside:avoid on each section so they land whole on a page
- Charts stack vertically on print (full width each) rather than 2-col grid
- Hide sidebar, toolbar; reset backgrounds and shadows for clean output

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
jtricerolph 2026-07-20 13:53:09 +00:00
parent 6a2990b34e
commit 7f0d1057c1
1 changed files with 37 additions and 6 deletions
Download patch file Download diff file Expand all files Collapse all files

43
frontend/src/index.css
View file

@ -709,13 +709,44 @@ html, body, #root {
font-size: 13px; font-size: 13px;
} }
@media print {
.wa-toolbar { display: none !important; }
.wa-page { overflow: visible; }
.wa-charts-row { break-inside: avoid; }
}
@media (max-width: 900px) { @media (max-width: 900px) {
.wa-charts-row { grid-template-columns: 1fr; } .wa-charts-row { grid-template-columns: 1fr; }
.wa-table { font-size: 11px; } .wa-table { font-size: 11px; }
} }
@media print {
/* Un-clip the shell so full content flows to paper */
.app-shell { display: block !important; height: auto !important; overflow: visible !important; }
.sidebar, .top-bar { display: none !important; }
.page-content { overflow: visible !important; height: auto !important; flex: none !important; }
/* Weekly actuals page resets */
.wa-toolbar { display: none !important; }
.wa-page { height: auto !important; overflow: visible !important; background: #fff; }
.wa-content { padding: 12px; gap: 16px; max-width: none; }
/* Each section stays whole — browser puts it on a new page if needed */
.wa-section {
break-inside: avoid;
page-break-inside: avoid;
box-shadow: none !important;
border: 1px solid #ccc !important;
margin-bottom: 14px;
padding: 14px;
}
/* Individual cards and tables don't split mid-element */
.wa-chart-card { break-inside: avoid; page-break-inside: avoid; background: #fff; border-color: #ddd; }
.wa-table-wrap { break-inside: avoid; page-break-inside: avoid; }
/* Side-by-side charts stack vertically so each gets full width on paper */
.wa-charts-row { display: block !important; }
.wa-charts-row .wa-chart-card { margin-bottom: 12px; }
/* Tables */
.wa-table { font-size: 11px; }
.wa-table th, .wa-table td { padding: 5px 8px; }
/* Section titles */
.wa-section-title { font-size: 11px; padding-bottom: 6px; margin-bottom: 10px; }
}