@page { size: A4 landscape; margin: 10mm; } body { background: #fff; color: #000; height: auto; display: block; } body > *:not(#print-root) { display: none !important; } #print-root { display: block !important; font: 10pt/1.35 system-ui, sans-serif; } #print-root h1 { font-size: 16pt; margin: 0; } #print-root figure { margin: 4mm 0; } #print-root figcaption { font-weight: 600; font-size: 9pt; } #print-root svg { width: 100%; height: auto; max-height: 55mm; print-color-adjust: exact; -webkit-print-color-adjust: exact; } #print-root svg .truck { fill: #fff; stroke: #000; } #print-root svg .grid line { stroke: #ccc; } #print-root svg .tick { fill: #444; } #print-root .p-issues { border: 1px solid #c00; padding: 2mm; color: #c00; } #print-root .p-noweight { margin: 0; font-size: 9pt; color: #555; } #print-root .p-open { margin: 0; font-size: 9pt; } #print-root table { width: 100%; border-collapse: collapse; margin-top: 4mm; } #print-root th, #print-root td { border-bottom: 1px solid #bbb; padding: 1mm 2mm; text-align: left; vertical-align: top; } #print-root tr { break-inside: avoid; } #print-root .swatch { print-color-adjust: exact; -webkit-print-color-adjust: exact; } /* Abhakliste (Task 3): zweispaltig, damit ein normaler Load auf ein Blatt passt. Eigene Klasse am #print-root, damit der normale Plan-Ausdruck (ohne .doc-checklist) davon nichts abbekommt. */ #print-root.doc-checklist { column-count: 2; column-gap: 8mm; } #print-root.doc-checklist .checklist { list-style: none; margin: 4mm 0 0; padding: 0; } #print-root.doc-checklist .checklist li { display: flex; align-items: center; gap: 2mm; padding: 1.5mm 0; break-inside: avoid; } #print-root.doc-checklist .checklist .num { flex: 0 0 auto; width: 7mm; font-weight: 600; } #print-root.doc-checklist .checklist .swatch { width: 5mm; height: 5mm; border-radius: 1mm; flex: 0 0 auto; } #print-root.doc-checklist .checklist .label { flex: 1 1 auto; overflow: hidden; } #print-root.doc-checklist .checklist .label small { color: #555; } #print-root.doc-checklist .checklist .layer { flex: 0 0 auto; font-size: 9pt; color: #555; white-space: nowrap; } #print-root.doc-checklist .checklist .tick { flex: 0 0 auto; width: 5mm; height: 5mm; border: 0.4mm solid #000; margin-left: 2mm; } /* Die Unterschriftszeile läuft bewusst IM Spaltenfluss mit (kein `column-span: all`): aufgespannt über beide Spalten schob Chrome sie auf eine zweite, sonst leere Seite, sobald die Liste die erste Seite füllte – 42 Cases passen nebeneinander auf ein Blatt, die Unterschrift landete trotzdem auf Seite 2. So steht sie am Ende der letzten Spalte und das Blatt bleibt eines. */ #print-root.doc-checklist .signoff { display: flex; gap: 12mm; margin-top: 8mm; break-inside: avoid; } #print-root.doc-checklist .signoff .line { display: inline-block; width: 40mm; border-bottom: 0.3mm solid #000; margin-left: 2mm; } /* Etiketten: Avery-Zweckform-Bögen, A4 HOCH und randlos (die @page-Regel dafür hängt js/app.js nur für diese Druckart ein, siehe pageRuleFor in js/ui/print.js). - groß Avery Zweckform 3425, 105×57 mm → 2 Spalten × 5 Zeilen = 10 je Bogen - klein Avery Zweckform 3474, 70×37 mm → 3 Spalten × 8 Zeilen = 24 je Bogen Beide Raster sind 210 mm breit (2×105 und 3×70) = genau A4-Breite, der Seitenrand links und rechts ist damit zwangsläufig 0. Senkrecht bleibt Spiel (297 − 5×57 = 12 mm bzw. 297 − 8×37 = 1 mm). WIE VIEL davon oben liegt, ist NICHT belegt – die öffentlich auffindbaren Quellen nennen den oberen Rand nicht, und die eine mit Zahlen widerspricht sich selbst. Das Raster wird deshalb zentriert (die neutrale Wahl), statt eine Herstellerangabe zu behaupten, die wir nicht haben; ein Testbogen zeigt sofort, ob das stimmt, und zu ändern ist dann align-content. Kein Schnittrahmen: auf Haftpapier würde er mitgedruckt. Zur Reichweite der Zentrierung: `align-content` wirkt nur, solange das Raster in die `min-height` passt — also auf einem einseitigen Bogen. Bei mehreren Seiten läuft es über, und die letzte, nicht volle Seite beginnt oben statt mittig. Für Haftpapier ist das richtig so: dort zählt, dass jede VOLLE Seite deckungsgleich sitzt, und die letzte wird ohnehin angebrochen. */ #print-root.doc-labels .labels { display: grid; gap: 0; justify-content: center; align-content: center; min-height: 297mm; } #print-root.doc-labels.size-large .labels { grid-template-columns: repeat(2, 105mm); grid-auto-rows: 57mm; } #print-root.doc-labels.size-small .labels { grid-template-columns: repeat(3, 70mm); grid-auto-rows: 37mm; } #print-root.doc-labels .tl-label { box-sizing: border-box; display: flex; flex-direction: column; justify-content: space-between; padding: 3mm; overflow: hidden; break-inside: avoid; } #print-root.doc-labels .seq { font-size: 28pt; font-weight: 700; line-height: 1; } #print-root.doc-labels .name { font-size: 11pt; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } #print-root.doc-labels .bar { display: block; height: 4mm; margin: 2mm 0; print-color-adjust: exact; -webkit-print-color-adjust: exact; } /* Gekürzt wird nur der Ladename. „n von m“ steht in einem eigenen Element, das nicht schrumpft – sonst schnitt ein langer Ladename genau die Angabe weg, die das Etikett zeigen soll. */ #print-root.doc-labels .meta { font-size: 8pt; color: #555; display: flex; gap: 2mm; overflow: hidden; } #print-root.doc-labels .meta .load { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } #print-root.doc-labels .meta-lkw { flex-wrap: wrap; row-gap: 0; } #print-root.doc-labels .meta .lkw { flex: 0 0 100%; font-weight: 600; color: #000; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } #print-root.doc-labels .meta .count { flex: 0 0 auto; margin-left: auto; white-space: nowrap; } #print-root.doc-labels.size-small .seq { font-size: 20pt; } #print-root.doc-labels.size-small .name { font-size: 9pt; } #print-root.doc-labels.size-small .meta { font-size: 7pt; } /* Mehrere LKW, „alle LKW“: je LKW ein Abschnitt; ab dem zweiten beginnt eine neue Seite. Die Abhakliste teilt ihre Spalten dann je Liste statt am ganzen Dokument, sonst zöge ein Seitenumbruch mitten durch die Spalten. */ #print-root .p-break { break-before: page; page-break-before: always; } #print-root.doc-checklist.doc-all { column-count: auto; } #print-root.doc-checklist.doc-all .checklist { column-count: 2; column-gap: 8mm; } #print-root.doc-all .checklist { list-style: none; margin: 4mm 0 0; padding: 0; } #print-root.doc-all .checklist li { display: flex; align-items: center; gap: 2mm; padding: 1.5mm 0; break-inside: avoid; } #print-root.doc-all .checklist .num { flex: 0 0 auto; width: 7mm; font-weight: 600; } #print-root.doc-all .checklist .swatch { width: 5mm; height: 5mm; border-radius: 1mm; flex: 0 0 auto; } #print-root.doc-all .checklist .label { flex: 1 1 auto; overflow: hidden; } #print-root.doc-all .checklist .label small, #print-root.doc-all .checklist .layer { color: #555; } #print-root.doc-all .checklist .layer { flex: 0 0 auto; font-size: 9pt; white-space: nowrap; } #print-root.doc-all .checklist .tick { flex: 0 0 auto; width: 5mm; height: 5mm; border: 0.4mm solid #000; margin-left: 2mm; }