style(report): swap date picker columns to 'From (optional) | Until'

Konrad's clarification on the Checkpoint-1 UX revision: the visual order
should follow English reading — "from X until Y" reads left-to-right, so
"From" belongs on the left and "Until" on the right. Previous commit
71f8558 placed Until on the left because it's the always-filled anchor,
but that fights the natural sentence order and was confusing.

Optionality is unchanged:
  - Until (right, always filled) = anchor month
  - From (left, optional) = blank means single-month report

No JS change needed — input IDs (popoverFromMonth / popoverToMonth) stay
the same; only column positions in the <div class="row"> were swapped.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
Konrad du Plessis 2026-04-23 13:07:39 +02:00
parent 71f8558ff5
commit 3fa3cdcf35

View File

@ -62,15 +62,12 @@
</label>
</div>
{# --- Month-mode pickers --- #}
{# "Until" is the anchor: always filled (URL to_month or current #}
{# month). "From" is optional: blank means single-month report #}
{# (JS submits from_month = to_month). Reduces the common "this #}
{# month" and "up to now, going back N months" flows. #}
{# Visual order follows English reading: "From (optional) ... Until". #}
{# "Until" is the anchor — always filled, defaults to the URL's #}
{# to_month or the current YYYY-MM when there's no filter. #}
{# "From" is optional — blank means a single-month report and the #}
{# JS submits from_month = to_month. #}
<div class="row g-2" id="popoverMonthFields">
<div class="col-6">
<label class="form-label small">Until</label>
<input type="month" id="popoverToMonth" class="form-control form-control-sm">
</div>
<div class="col-6">
<label class="form-label small">
From <span class="text-muted">(optional)</span>
@ -80,6 +77,10 @@
Leave blank for a single month
</div>
</div>
<div class="col-6">
<label class="form-label small">Until</label>
<input type="month" id="popoverToMonth" class="form-control form-control-sm">
</div>
</div>
<div class="row g-2 d-none" id="popoverCustomFields">
<div class="col-6">