fix: Invoice print layout - hide app shell, fix padding

Print CSS:
- Hide WooNooW app nav, header, submenu, bottom nav
- Set print-a4 to absolute positioning for clean print
- Added 15mm padding for print
- Hidden min-height for screen container

Invoice Component:
- Removed inline minHeight to prevent empty second page
- Added max-w-3xl and p-8 for screen display
- Added print:max-w-none print:p-0 for print mode
This commit is contained in:
Dwindi Ramadhana
2026-01-06 21:06:28 +07:00
parent 1cef11a1d2
commit 2b94f26cae
2 changed files with 60 additions and 19 deletions

View File

@@ -87,16 +87,8 @@ export default function Invoice() {
</div>
{/* Invoice content */}
<div className="py-8 print:py-0">
<div
className="print-a4 bg-white shadow-lg print:shadow-none mx-auto"
style={{
width: '210mm',
minHeight: '297mm',
padding: '20mm',
boxSizing: 'border-box'
}}
>
<div className="py-8 print:py-0 print:bg-white">
<div className="print-a4 bg-white shadow-lg print:shadow-none mx-auto max-w-3xl p-8 print:max-w-none print:p-0">
{/* Invoice Header */}
<div className="flex items-start justify-between mb-8 pb-6 border-b-2 border-gray-200">
<div>
@@ -214,6 +206,6 @@ export default function Invoice() {
</div>
</div>
</div>
</div>
</div >
);
}