Jeppe BandJeppe Bundgaard 3de5215b5e Fix Superuser invoicing registration field layout (#236) ...

## Summary
- Fixes Superuser invoicing period object-tree registration rows so
`reg_1`, `reg_2`, and `reg_3` labels/values no longer overlap in compact
rows.
- Lets composite registration fields auto-size, wraps long plate values
safely, and spans the full compact grid width on small containers.
- Adds a focused source-level regression contract and committed visual
before/after previews.

## Tests
- `npm run test:unit:single --
tests/unit/superuser-invoices-view.spec.js`
- `npm run build`

## Visual change previews

### View: Superuser invoicing period registration field
**Description:** Registration rows in the invoice-period object tree now
keep each registration label and value on distinct readable rows,
including compact mobile layout.

#### Mobile (390x844)
**Before:**
![Before mobile registration
overlap](https://raw.githubusercontent.com/copenhagentruckwash/pleno-vue/6a733a0023430929a3c130191c8015694f951a86/visual-previews/workboard-4505b9ab-registration-overlap/mobile-before.png)

**After:**
![After mobile registration
layout](https://raw.githubusercontent.com/copenhagentruckwash/pleno-vue/6a733a0023430929a3c130191c8015694f951a86/visual-previews/workboard-4505b9ab-registration-overlap/mobile-after.png)

#### Tablet (768x1024)
**Before:**
![Before tablet registration
overlap](https://raw.githubusercontent.com/copenhagentruckwash/pleno-vue/6a733a0023430929a3c130191c8015694f951a86/visual-previews/workboard-4505b9ab-registration-overlap/tablet-before.png)

**After:**
![After tablet registration
layout](https://raw.githubusercontent.com/copenhagentruckwash/pleno-vue/6a733a0023430929a3c130191c8015694f951a86/visual-previews/workboard-4505b9ab-registration-overlap/tablet-after.png)

#### Desktop (1440x900)
**Before:**
![Before desktop registration
overlap](https://raw.githubusercontent.com/copenhagentruckwash/pleno-vue/6a733a0023430929a3c130191c8015694f951a86/visual-previews/workboard-4505b9ab-registration-overlap/desktop-before.png)

**After:**
![After desktop registration
layout](https://raw.githubusercontent.com/copenhagentruckwash/pleno-vue/6a733a0023430929a3c130191c8015694f951a86/visual-previews/workboard-4505b9ab-registration-overlap/desktop-after.png)

Co-authored-by: Jeppe Bundgaard <jb@truckwash.dk>

2026-07-29 14:26:04 +02:00

22 KiB

390x844px

Raw History