44 lines
1.4 KiB
HTML
44 lines
1.4 KiB
HTML
{% comment %}
|
|
Render a navigation menu for dates
|
|
|
|
Context:
|
|
- url_name: url name
|
|
- date: current date
|
|
- input_type: date input type
|
|
- dates: dates to display as a list of `(date|None, title|None)`.
|
|
|
|
An empty date results to a title or a separator
|
|
{% endcomment %}
|
|
{% load i18n %}
|
|
|
|
<a-switch class="button burger"
|
|
el=".nav-dates" icon="far fa-calendar" group="nav"
|
|
aria-label="{% translate "Dates" %}">
|
|
</a-switch>
|
|
|
|
<div class="nav-menu nav-dates">
|
|
{% for day in dates %}
|
|
<a href="{% url url_name date=day %}" class="nav-item {% if day == date %}active{% endif %}">
|
|
{{ day|date:"l d" }}
|
|
</a>
|
|
{% endfor %}
|
|
|
|
<a-dropdown class="nav-item align-right flex-grow-0 dropdown is-right"
|
|
content-class="dropdown-menu"
|
|
button-tag="span" button-class="dropdown-trigger"
|
|
button-icon-open="fa-solid fa-plus" button-icon-close="fa-solid fa-minus">
|
|
<template #default>
|
|
<div class="dropdown-content">
|
|
<div class="dropdown-item">
|
|
<h4>{% translate "Pick a date" %}</h4>
|
|
<v-calendar mode="date" borderless
|
|
:initial-page="{month: {{date.month}}, year: {{date.year}}}"
|
|
@dayclick="(event) => window.aircox.pickDate({% url url_name %}, event)"
|
|
color="yellow"
|
|
/>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
</a-dropdown>
|
|
</div>
|