diff --git a/packages/fieldlens-core/src/features/codes/CodeLab.css b/packages/fieldlens-core/src/features/codes/CodeLab.css index c12f5ac..c65faa5 100644 --- a/packages/fieldlens-core/src/features/codes/CodeLab.css +++ b/packages/fieldlens-core/src/features/codes/CodeLab.css @@ -179,32 +179,52 @@ @media print { @page { - margin: 12mm; + size: auto; + margin: 8mm; } - body * { - visibility: hidden !important; + html, + body { + width: 100%; + min-height: 0 !important; + margin: 0 !important; + padding: 0 !important; + background: #fff !important; } - .barcode-print-sheet, - .barcode-print-sheet * { - visibility: visible !important; + #root { + display: none !important; } .barcode-print-sheet { - position: fixed; - inset: 0; + position: static; display: grid !important; + width: 100%; + height: auto; + min-height: 0; place-items: center; + margin: 0; padding: 0; + overflow: visible; + break-after: avoid-page; + break-before: avoid-page; + break-inside: avoid-page; + page-break-after: avoid; + page-break-before: avoid; + page-break-inside: avoid; background: #fff; } .barcode-print-label { display: grid; width: min(170mm, 100%); + max-height: calc(100vh - 16mm); place-items: center; - gap: 8mm; + gap: 6mm; + margin: 0; + padding: 0; + break-inside: avoid-page; + page-break-inside: avoid; color: #000; background: #fff; text-align: center; @@ -217,6 +237,8 @@ .barcode-print-label canvas { display: block; max-width: 100%; + max-height: 65vh; + width: auto; height: auto; } diff --git a/packages/fieldlens-core/src/features/codes/CodeLab.tsx b/packages/fieldlens-core/src/features/codes/CodeLab.tsx index 4f48d28..d16aa3e 100644 --- a/packages/fieldlens-core/src/features/codes/CodeLab.tsx +++ b/packages/fieldlens-core/src/features/codes/CodeLab.tsx @@ -1,6 +1,7 @@ import bwipjs from 'bwip-js' import { Printer, RefreshCw } from 'lucide-react' import { useEffect, useRef, useState } from 'react' +import { createPortal } from 'react-dom' import { appendGtinCheckDigit, randomDigits } from '../../lib/barcodes' import './CodeLab.css' @@ -215,7 +216,7 @@ export function CodeLab() { ) : (