feat(configurator): tighten header spacing — remove row-span, smaller gaps

User reported too much vertical air between fields. Two changes:

1. Removed grid-row: span 2 from the PO block. The row-span pattern
   stretched each grid row to half the PO block's height (~125px each),
   leaving empty space below Customer Job # / Job Sorting on row 2 and
   below Material/Lead Time on row 3.

   New layout:
   - Row 1: Customer (1-2) + Delivery Address (3-4)
   - Row 2: PO Block (1-2, naturally tall) + Customer Job # + Job Sorting
   - Row 3: Material/Process + Lead Time + Payment Terms + Delivery Method
   - Row 4: Pricelist + Quote Validity + Blanket SO + Invoice Strategy
   - Row 5 (conditional): Deposit % or Progress % (when invoice strategy uses them)

   PO block forces row 2 to be tall but cols 3-4 just sit at top — that
   was the original mockup pattern, and it's denser overall because
   rows 3+ are all the standard short height.

2. Tightened spacing in SCSS:
   - Grid row gap 14px → 6px
   - Cell label margin 0 (was 2px)
   - Input padding 5px → 2px vertical, min-height 30px → 24px
   - PO block padding 10px → 6/12/8px
   - PO row gap 2px padding → 0 (min-height 28px keeps clickable target)
   - PO chase text 11px → 10px, tighter line-height
This commit is contained in:
gsinghpal
2026-05-27 00:34:46 -04:00
parent 2b8d99f69d
commit b7f280141f
2 changed files with 33 additions and 29 deletions

View File

@@ -87,11 +87,11 @@
</div>
<!-- ============================================================
PO Block spans rows 2-3, cols 1-2.
Customer Job # / Job Sorting / Material / Lead Time
flow into cols 3-4 across rows 2-3 (next to PO block).
PO Block in row 2 cols 1-2 (naturally tall).
Customer Job # / Job Sorting fill cols 3-4 of row 2;
remaining fields go into compact rows below.
============================================================ -->
<div class="o_fp_xpr_cell span-2 row-span-2 o_fp_xpr_po_block">
<div class="o_fp_xpr_cell span-2 o_fp_xpr_po_block">
<div class="o_fp_xpr_po_head">
<span>CUSTOMER PO</span>
<field name="po_status" widget="badge"
@@ -127,7 +127,7 @@
</div>
</div>
<!-- Right-of-PO row 2 cols 3-4 — Customer Job # + Job Sorting -->
<!-- Row 2 right side: Customer Job # + Job Sorting -->
<div class="o_fp_xpr_cell">
<label for="customer_job_number">Customer Job #</label>
<field name="customer_job_number" nolabel="1"/>
@@ -138,7 +138,8 @@
options="{'no_create_edit': False, 'no_open': True}"
placeholder="Type to create a new bucket..."/>
</div>
<!-- Right-of-PO row 3 cols 3-4 — Material/Process Tag + Lead Time -->
<!-- Row 3 — Material/Process + Lead Time + Payment + Delivery -->
<div class="o_fp_xpr_cell">
<label for="material_process">Material / Process</label>
<field name="material_process" nolabel="1"
@@ -155,8 +156,6 @@
class="o_fp_xpr_range_input"/>
</div>
</div>
<!-- Row 4 (after PO ends) — Payment / Delivery / Pricelist / Quote Valid -->
<div class="o_fp_xpr_cell">
<label for="payment_term_id">Payment Terms</label>
<field name="payment_term_id" nolabel="1"
@@ -166,6 +165,8 @@
<label for="delivery_method">Delivery Method</label>
<field name="delivery_method" nolabel="1"/>
</div>
<!-- Row 4 — Pricelist + Quote Validity + Blanket + Invoice Strategy -->
<div class="o_fp_xpr_cell">
<label for="pricelist_id">Currency / Pricelist</label>
<field name="pricelist_id" nolabel="1"
@@ -176,8 +177,6 @@
<label for="validity_date">Quote Validity</label>
<field name="validity_date" nolabel="1"/>
</div>
<!-- Row 5 — Blanket SO (with inline Block Partial) + Invoice Strategy + Sales Rep + Tooling Charge -->
<div class="o_fp_xpr_cell">
<label for="is_blanket_order">Blanket Sales Order</label>
<div class="o_fp_xpr_inline_pair">
@@ -185,13 +184,15 @@
<field name="block_partial_shipments" nolabel="1"
invisible="not is_blanket_order"/>
<span class="o_fp_xpr_inline_help"
invisible="not is_blanket_order">Block partial shipments</span>
invisible="not is_blanket_order">Block partial</span>
</div>
</div>
<div class="o_fp_xpr_cell">
<label for="invoice_strategy">Invoice Strategy</label>
<field name="invoice_strategy" nolabel="1"/>
</div>
<!-- Conditional row 5 — only renders when deposit/progress invoice strategy -->
<div class="o_fp_xpr_cell" invisible="invoice_strategy != 'deposit'">
<label for="deposit_percent">Deposit %</label>
<field name="deposit_percent" nolabel="1"/>