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

polish(adjustments): rotate chevron on collapse + lock in magnitude ordering

Browse Source 
Code-review follow-ups on Task 5:

1. Chevron rotation — Bootstrap 5 collapse sets aria-expanded="false" on
   the toggle when collapsed; two CSS rules off that attribute rotate
   the chevron -90deg with a 150ms transition. No JS needed.

2. test_group_by_type now asserts groups[0]['label'] == 'Bonus', locking
   in the descending-|net_sum| ordering promise (|800| > |100|).

60/60 tests still pass.
This commit is contained in:
Konrad du Plessis 2026-04-23 18:42:19 +02:00
parent 0862805623
commit e5d06f91e5
2 changed files with 10 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
core/tests.py
View File

@ -1082,6 +1082,9 @@ class AdjustmentsTabTests(TestCase):
self.assertEqual(bonus_group['net_sum'], Decimal('800.00')) # +R 500 + +R 300
deduction_group = next(g for g in groups if g['label'] == 'Deduction')
self.assertEqual(deduction_group['net_sum'], Decimal('-100.00'))
# Groups must be ordered by descending |net_sum| — biggest impact
# first. |800| > |100| so Bonus must come before Deduction.
self.assertEqual(groups[0]['label'], 'Bonus')
def test_group_by_worker(self):
self._login_admin()

7
static/css/custom.css
View File

@ -1986,6 +1986,13 @@ body, .card, .modal-content, .form-control, .form-select,
.adj-group-header[data-type="Advance Payment"] { border-left: 4px solid var(--badge-advance-bg); }
.adj-group-header[data-type="Advance Repayment"] { border-left: 4px solid var(--badge-advance-rep-bg); }
/* --- Chevron rotates to indicate collapsed / expanded state.
Bootstrap sets aria-expanded="false" on the toggle when collapsed;
we rotate the chevron 90deg counter-clockwise so it points right,
a familiar "this is collapsed" signal. --- */
.adj-group-header .fa-chevron-down { transition: transform 150ms ease; }
.adj-group-header[aria-expanded="false"] .fa-chevron-down { transform: rotate(-90deg); }
/* --- Floating bulk action bar (appears when >=1 row selected) --- */
.adj-bulk-bar {
position: fixed;