` to keep it together when it fits and naturally wrap to a fresh page when it doesn't. | `fusion_plating_reports/report/report_coc.xml` |
| **`opacity` + `italic` muted text renders jagged on entech wkhtmltopdf** | The obvious pattern for a subtle footnote — `font-style: italic; opacity: 0.7;` (used by `.fp-coc .small-label`) — produces washed-out, jagged characters that look "broken" or "messed up" on the printed PDF. Visually it reads as garbled text even though the source is clean. **Use solid grey (`color: #555`) at normal weight instead** for muted secondary text. Same workaround applies to any `opacity`-driven greyed-out element bound for wkhtmltopdf. The existing `.small-label` class still exists for legacy callers but new code should prefer an explicit `color:` style. | `fusion_plating_reports` |
-| **wkhtmltopdf header overlap — paperformat.margin_top, NOT body padding-top** | The wkhtmltopdf header zone is sized by `report.paperformat.margin_top` (and `header_spacing`). If the `web.external_layout` header (logo + address etc.) renders ~28mm tall but paperformat reserves only 8mm, page 2+ has the header bleeding over body content (the overlap shows up as the company logo printed *on top of* the signature, readings table, etc.). The anti-pattern is "fix" it by adding `padding-top: 50mm` to the body wrapper — this only pads page 1 (single one-shot padding) and does nothing for subsequent pages, while also wasting 50mm of usable space on page 1. **Right fix:** size `paperformat.margin_top` to the actual rendered header height, then drop body `padding-top` to a tiny visual gap (~5mm). Each report can have its own paperformat — `report_coc_en` / `report_coc_fr` use "Fusion Plating CoC" (id 13); the legacy `report_coc` uses "A4 Landscape (Fusion Plating)" (id 12). Update the right one and don't bleed changes across reports. **Corollary — don't use negative `margin-top` to "tighten" the gap** (e.g. `.my-page { margin-top: -10px; }` to pull the H1 up under the header). The body wrapper sits at the bottom edge of the reserved margin_top zone; any negative margin pushes content INTO the header band, where wkhtmltopdf clips the top of glyphs (looks like the title is half-eaten). If the gap really feels too big, shrink the title font instead, or reduce `paperformat.margin_top` so the entire header zone is shorter. **For customer-facing portrait reports** (SO confirmation, quote, invoice, packing slip, BoL) the canonical compact paperformat is `fusion_plating_reports.paperformat_fp_a4_portrait` (margin_top=22mm, header_spacing=3mm, keeps the standard header band). Bind it via `
` rather than creating yet-another-one. **Two compounding-padding traps to be aware of:** (1) Odoo's `.page` class has `padding: 1cm` baked in (Bootstrap-derived). If you wrap your body in `
` AND add a body `padding-top: 15mm`, you get the paperformat margin_top + 10mm Odoo + 15mm yours = ~65mm of dead space above the title. To remove the .page contribution without losing its left/right padding, override only the top: `.fp-report.fp-sale .page { padding-top: 0 !important; }`. CoC sidesteps this by NOT using an inner `.page` div — it wraps directly in `
` and puts padding on that. (2) The base `.fp-report table.bordered th, .fp-report table.bordered td` rule applies borders explicitly, BUT a separate cascade still bleeds borders onto NESTED `
` elements even when the inner table has no `.bordered` class — `border: 0 !important` on the cells does NOT reliably override it (some wkhtmltopdf rendering paths still draw the lines). **Don't use a `` for non-bordered layouts** like a title/barcode strip; use `` + `float: right` / flexbox instead. Saves an hour of CSS specificity arguments with wkhtmltopdf. (3) **CSS comments inside QWeb `
-
+
-
+
+
+
+ ,
+
+
+
+
@@ -72,7 +88,7 @@
-
+
diff --git a/fusion_plating/fusion_plating_reports/report/report_fp_sale.xml b/fusion_plating/fusion_plating_reports/report/report_fp_sale.xml
index cb2be321..c7f8f537 100644
--- a/fusion_plating/fusion_plating_reports/report/report_fp_sale.xml
+++ b/fusion_plating/fusion_plating_reports/report/report_fp_sale.xml
@@ -38,22 +38,34 @@
below in italic-grey. */
.fp-bl-en-stk { display: block; font-weight: bold; }
.fp-bl-fr-stk { display: block; font-weight: normal; font-style: italic; color: #555; font-size: 80%; margin-top: 1px; }
- /* Kill the extra top padding Odoo's `.page` class adds
- (1cm by default). The paperformat already reserves
- header room — `.page` padding compounds on top of it
- and was the source of the giant gap. Keep left/right/
- bottom at 1cm so the content isn't flush to the edges. */
- .fp-report.fp-sale .page { padding-top: 0 !important; }
+ /* Match the CoC pattern exactly: tiny paperformat margin_top
+ (8mm) lets the header HTML overflow into the body area,
+ and this 20mm padding-top on the wrapper clears it. See
+ CLAUDE.md "wkhtmltopdf header overlap" — the alternative
+ "size margin_top to the header height" approach has zero
+ slack and breaks any time the header HTML grows. */
+ .fp-report.fp-sale { padding-top: 20mm; }
/* Title bar uses float-based div layout, NOT an HTML table —
the global ".fp-report table" rule was applying borders
to every nested table even with "border: 0 !important",
so the only reliable fix is to avoid the table element. */
- .fp-sale-titlebar { margin: 0 0 8px 0; padding: 0; overflow: hidden; }
- .fp-sale-title { font-size: 14pt; line-height: 1.2; color: #2e2e2e; font-weight: bold; }
- .fp-sale-title .fp-bl-fr { font-size: 10pt; }
- .fp-sale-barcode { float: right; text-align: right; margin-left: 12px; }
- .fp-sale-barcode img { height: 34px; max-width: 220px; }
- .fp-sale-barcode .fp-bc-label { font-size: 8pt; color: #555; margin-top: 2px; }
+ .fp-sale-titlebar { margin: 0 0 10px 0; padding: 0; overflow: hidden; }
+ /* Stacked title: English bold/large on top, French italic/
+ grey below. Sizes picked so the French line is roughly
+ the same horizontal width as the English line (English
+ is shorter character-wise but rendered larger). */
+ .fp-sale-title-en { font-size: 18pt; font-weight: bold; color: #2e2e2e; line-height: 1.1; display: block; }
+ .fp-sale-title-fr { font-size: 13pt; font-style: italic; color: #555; line-height: 1.1; display: block; margin-top: 2px; }
+ .fp-sale-title-num { font-weight: bold; margin-left: 6px; }
+ /* Barcode: bigger so it scans reliably. Wrap the img + label
+ in an inline-block so the label centers under the barcode
+ (not under the full floated column). Explicit no-border on
+ the img (wkhtmltopdf adds a 1px frame to inline-data img
+ elements by default on entech). */
+ .fp-sale-barcode { float: right; margin-left: 12px; }
+ .fp-bc-wrap { display: inline-block; text-align: center; }
+ .fp-bc-wrap img { height: 48px; max-width: 240px; border: 0 !important; padding: 0; display: block; }
+ .fp-bc-wrap .fp-bc-label { font-size: 10pt; color: #333; margin-top: 6px; letter-spacing: 0.5px; }
@@ -76,22 +88,24 @@
-
+
-
![Order Barcode]()
-
+
+
![Order Barcode]()
+
+
-
- /
- #
-
+
+ #
+
+