Every icon in mobile/templates/mobile/ was a hand-rolled inline <svg> with
raw path data -- management and controlpanel have used django-lucide
throughout instead (confirmed already 100% consistent there, audited as
part of this change). django-lucide is a pure server-side Python tag with
no JS/CDN runtime dependency, so this is a drop-in swap producing the same
kind of literal <svg><path .../></svg> markup mobile already wrote by hand,
just pulled from the shared vendored icon set instead of duplicated per
call site. Mapped each shape to its nearest Lucide name: bell, house
("home" doesn't exist as a lucide name -- confirmed by hand), calendar,
newspaper, user, users, chevron-left, chevron-right, check, x. Hardcoded
hex strokes (#0b1220, #fff) became stroke="currentColor" + a text-ink/
text-white class, matching how every other icon in this app already gets
its color.
Also caught and fixed a hx-boost gap while touching coach/base.html: the
coach tab bar's own "Me" link (-> mobile:me, a Member-shell view) was
missing the hx-boost="false" every other cross-shell link already got.
Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01ECGMEwrc2k4D8VQuwjstj9
33 lines
1.5 KiB
HTML
33 lines
1.5 KiB
HTML
{% extends "mobile/base.html" %}
|
|
{% load i18n lucide %}
|
|
|
|
{% comment %}
|
|
M5's "Payments & dues" row -- every open season-dues balance across every
|
|
managed person, one card per open row via mobile/_dues_row.html (the same
|
|
partial Home's dues card uses, so the two never drift apart visually).
|
|
White sticky back-header, same pattern as calendar_feed_settings.html --
|
|
not a tab of its own, active_tab stays "me" (PaymentsView's own docstring).
|
|
{% endcomment %}
|
|
|
|
{% block content %}
|
|
<div class="-mx-4 -mt-4 flex items-center gap-1 border-b border-line bg-white px-4 py-3">
|
|
<a class="-ml-2.5 flex h-11 w-11 shrink-0 items-center justify-center" href="{% url "mobile:me" %}" aria-label="{% trans "Back" %}">
|
|
{% lucide "chevron-left" size=20 stroke_width=2.4 class="text-ink" %}
|
|
</a>
|
|
<span class="min-w-0 flex-1 truncate font-display text-xl leading-none font-extrabold text-ink uppercase">{% trans "Payments & dues" %}</span>
|
|
</div>
|
|
|
|
{% if dues_rows %}
|
|
<div class="flex flex-col gap-2.5">
|
|
{% for row in dues_rows %}
|
|
{% include "mobile/_dues_row.html" %}
|
|
{% endfor %}
|
|
</div>
|
|
{% else %}
|
|
<div class="m-card p-6 text-center">
|
|
<p class="font-display text-lg font-extrabold text-ink uppercase">{% trans "All settled up" %}</p>
|
|
<p class="mt-1 text-sm text-muted">{% trans "There's nothing open right now." %}</p>
|
|
</div>
|
|
{% endif %}
|
|
{% endblock content %}
|