admin/38686-vm
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style(report): shrink '(optional)' hint and tooltip 'Single month select' on Until

Browse Source 
Checkpoint-1 polish (Konrad):
  - 'From (optional)' — the parenthetical is now ~50% smaller (0.6rem)
    so the label's primary text dominates, matching his intent of a
    subordinate hint rather than a competing word.
  - 'Until' — adds a small info-circle icon with a Bootstrap tooltip
    reading 'Single month select'. Inline small-font text was my first
    attempt but wrapped to two lines inside the narrow column; the icon
    tooltip keeps the label tidy while the hint is one hover away.
    Bootstrap tooltip auto-init (base.html) handles the binding —
    matches CLAUDE.md's global tooltip pattern.

No functional change. 47/47 tests still green (no view code touched).

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
Konrad du Plessis 2026-04-23 13:12:45 +02:00
parent 3fa3cdcf35
commit c1937cd89d
1 changed files with 13 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
core/templates/core/report.html
View File

@ -70,7 +70,8 @@
<div class="row g-2" id="popoverMonthFields">
<div class="col-6">
<label class="form-label small">
From <span class="text-muted">(optional)</span>
From
<span class="text-muted" style="font-size: 0.6rem; letter-spacing: 0;">(optional)</span>
</label>
<input type="month" id="popoverFromMonth" class="form-control form-control-sm">
<div class="form-text small" style="font-size: 0.72rem; opacity: 0.75;">
@ -78,7 +79,17 @@
</div>
</div>
<div class="col-6">
<label class="form-label small">Until</label>
{# Tooltip on the info icon avoids the inline hint #}
{# wrapping to two lines inside a narrow column. #}
{# Global Bootstrap tooltip initialiser (base.html) #}
{# picks up data-bs-toggle="tooltip" automatically. #}
<label class="form-label small">
Until
<i class="fas fa-info-circle ms-1"
data-bs-toggle="tooltip"
title="Single month select"
style="color: var(--text-tertiary); font-size: 0.85em; cursor: help;"></i>
</label>
<input type="month" id="popoverToMonth" class="form-control form-control-sm">
</div>
</div>