Add a working event-kind filter to Calendar; merge per-screen headers into the shared navy bar
Calendar gains a real "All/Games/Practices" filter (?kind=), a working version of the design mock's own "Games only" pill -- its List/Month toggle isn't reproduced, that's a whole second view mode, not a filter. base.html gains a header_extra block so a screen can add its own title into the *same* navy app-header instead of stacking a second, differently-coloured block underneath it. Me's avatar/name/subtitle row moved there from its own bg-ink block (a visible colour seam that didn't match the design canvas's own M5 markup, which keeps it all in one navy area), and Calendar now shows a "Calendar" title the same way. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01ECGMEwrc2k4D8VQuwjstj9
This commit is contained in:
@@ -70,6 +70,7 @@
|
||||
{% if unread_notification_count %}<span class="absolute top-1.5 right-1.5 h-2 w-2 rounded-full bg-club" style="border: 2px solid var(--color-navy)"></span>{% endif %}
|
||||
</a>
|
||||
</div>
|
||||
{% block header_extra %}{% endblock header_extra %}
|
||||
</header>
|
||||
|
||||
<main class="flex-1 overflow-y-auto">
|
||||
|
||||
@@ -7,13 +7,33 @@
|
||||
CalendarView's own docstring for the browsing-window judgment call --
|
||||
current + next calendar week, no further paging). No person switcher and
|
||||
no club-wide toggle here -- always every event self.managed_people is
|
||||
invited to, full stop. -mx-4 breaks the rows out of base.html's shared
|
||||
page padding so they run edge-to-edge, matching the design canvas's own
|
||||
M3 markup (the desktop List/Month/"Games only" controls in that mock
|
||||
aren't reproduced here -- no real functionality behind them yet).
|
||||
invited to, full stop. A real, working ?kind= filter (All/Games/
|
||||
Practices) stands in for the design mock's "Games only" pill; its List/
|
||||
Month toggle isn't reproduced -- that's a second view mode, not a filter.
|
||||
-mx-4 (on the row groups only, not this filter row) breaks the rows out
|
||||
of base.html's shared page padding so they run edge-to-edge, matching
|
||||
the design canvas's own M3 markup.
|
||||
{% endcomment %}
|
||||
|
||||
{% block header_extra %}
|
||||
<div class="mt-3">
|
||||
<span class="font-display text-2xl font-extrabold text-white uppercase">{% trans "Calendar" %}</span>
|
||||
</div>
|
||||
{% endblock header_extra %}
|
||||
|
||||
{% block content %}
|
||||
<div class="flex gap-2">
|
||||
<a class="flex h-9 flex-1 items-center justify-center rounded-full font-display text-xs font-extrabold tracking-wide uppercase {% if not kind_filter %}bg-ink text-white{% else %}border border-line bg-white text-muted{% endif %}" href="{% url "mobile:calendar" %}">
|
||||
{% trans "All" %}
|
||||
</a>
|
||||
<a class="flex h-9 flex-1 items-center justify-center rounded-full font-display text-xs font-extrabold tracking-wide uppercase {% if kind_filter == "game" %}bg-ink text-white{% else %}border border-line bg-white text-muted{% endif %}" href="?kind=game">
|
||||
{% trans "Games" %}
|
||||
</a>
|
||||
<a class="flex h-9 flex-1 items-center justify-center rounded-full font-display text-xs font-extrabold tracking-wide uppercase {% if kind_filter == "training" %}bg-ink text-white{% else %}border border-line bg-white text-muted{% endif %}" href="?kind=training">
|
||||
{% trans "Practices" %}
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="-mx-4">
|
||||
{% if not managed_people %}
|
||||
<div class="mx-4">
|
||||
@@ -25,7 +45,13 @@
|
||||
{% elif not this_week and not next_week %}
|
||||
<div class="mx-4">
|
||||
<div class="m-card p-6 text-center">
|
||||
<p class="text-sm text-muted">{% trans "Nothing scheduled in the next two weeks." %}</p>
|
||||
{% if kind_filter == "game" %}
|
||||
<p class="text-sm text-muted">{% trans "No games in the next two weeks." %}</p>
|
||||
{% elif kind_filter == "training" %}
|
||||
<p class="text-sm text-muted">{% trans "No practices in the next two weeks." %}</p>
|
||||
{% else %}
|
||||
<p class="text-sm text-muted">{% trans "Nothing scheduled in the next two weeks." %}</p>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
{% else %}
|
||||
|
||||
@@ -9,19 +9,17 @@
|
||||
"Payments & dues" have no screen to lead to and are omitted, same for the
|
||||
mockup's "Coach mode" promo (base.html's own precedent -- no Coach mode
|
||||
screens exist yet, so it's never rendered, not even as a dead/inert link).
|
||||
The avatar/name/subtitle row lives in header_extra -- merged into the
|
||||
shared navy app-header (base.html) rather than a separately-coloured
|
||||
block of its own, matching the design canvas's own M5 markup.
|
||||
{% endcomment %}
|
||||
|
||||
{% block content %}
|
||||
{% if not managed_people %}
|
||||
<div class="m-card p-6 text-center">
|
||||
<p class="font-display text-lg font-extrabold text-ink uppercase">{% trans "No one to show yet" %}</p>
|
||||
<p class="mt-1 text-sm text-muted">{% trans "Once you're linked to a member record, your profile will show up here." %}</p>
|
||||
</div>
|
||||
{% else %}
|
||||
<div class="-mx-4 -mt-4 flex items-center gap-3 bg-ink px-4 pt-4 pb-5 text-white">
|
||||
{% block header_extra %}
|
||||
{% if managed_people %}
|
||||
<div class="mt-3 flex items-center gap-3">
|
||||
{% include "mobile/_avatar.html" with person=me size_class="h-14 w-14" text_class="text-xl" bg_class="bg-club" %}
|
||||
<div class="min-w-0 flex-1">
|
||||
<div class="font-display text-xl leading-none font-extrabold uppercase">{{ me.get_full_name }}</div>
|
||||
<div class="font-display text-xl leading-none font-extrabold text-white uppercase">{{ me.get_full_name }}</div>
|
||||
{% if member_since or team_manager_label %}
|
||||
<div class="mt-1.5 text-[13px] text-on-dark-dim">
|
||||
{% if member_since %}{% blocktrans with year=member_since|date:"Y" %}Member since {{ year }}{% endblocktrans %}{% endif %}
|
||||
@@ -31,7 +29,16 @@
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
{% endblock header_extra %}
|
||||
|
||||
{% block content %}
|
||||
{% if not managed_people %}
|
||||
<div class="m-card p-6 text-center">
|
||||
<p class="font-display text-lg font-extrabold text-ink uppercase">{% trans "No one to show yet" %}</p>
|
||||
<p class="mt-1 text-sm text-muted">{% trans "Once you're linked to a member record, your profile will show up here." %}</p>
|
||||
</div>
|
||||
{% else %}
|
||||
<div>
|
||||
<div class="mb-2 font-display text-xs font-extrabold tracking-wide text-muted uppercase">{% trans "People I manage" %}</div>
|
||||
<div class="m-card overflow-hidden">
|
||||
|
||||
Reference in New Issue
Block a user