mirror of
https://github.com/pretix/pretix.git
synced 2026-05-13 16:33:59 +00:00
Improve calendar-navigation on organizer and events page (Z#177488) (#2373)
* hide icons for calendar-types and improve layout-breakpoints in calendar top-nav * change month-selector to one dropdown "date"and redirect old URLs to new date-based URLs * change week calendar to one dropdown "date“ and redirect old URLs to new date-based URLs
This commit is contained in:
committed by
GitHub
parent
d16f6167f6
commit
aed64d16f6
@@ -3,41 +3,38 @@
|
||||
{% load urlreplace %}
|
||||
<nav aria-label="{% trans "calendar navigation" %}">
|
||||
<ul class="row calendar-nav">
|
||||
<li class="col-sm-4 hidden-xs text-left flip">
|
||||
<a href="?{% url_replace request "year" subevent_list.before.year "month" subevent_list.before.month %}"
|
||||
<li class="col-sm-4 col-xs-2 text-left flip">
|
||||
<a href="?{% url_replace request "date" subevent_list.before|date:"Y-m" %}"
|
||||
class="btn btn-default" aria-label="{% blocktrans with month=subevent_list.before|date:"F Y" %}Show previous month, {{ month }}{% endblocktrans %}">
|
||||
<span class="fa fa-arrow-left" aria-hidden="true"></span>
|
||||
{{ subevent_list.before|date:"F Y" }}
|
||||
<span class="hidden-xs">{{ subevent_list.before|date:"F Y" }}</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="col-sm-4 col-xs-12 text-center">
|
||||
<li class="col-sm-4 col-xs-8 text-center">
|
||||
<form class="form-inline" method="get" id="monthselform" action="{% eventurl event "presale:event.index" cart_namespace=cart_namespace %}">
|
||||
{% for f, v in request.GET.items %}
|
||||
{% if f != "month" and f != "year" %}
|
||||
{% if f != "date" %}
|
||||
<input type="hidden" name="{{ f }}" value="{{ v }}">
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
<div role="group" aria-label="{% trans "Select month and year to show" %}">
|
||||
<select name="month" class="form-control" aria-label="{% trans "Month" %}">
|
||||
{% for m in subevent_list.months %}
|
||||
<option value="{{ m|date:"m" }}" {% if m.month == subevent_list.date.month %}selected{% endif %}>{{ m|date:"F" }}</option>
|
||||
{% endfor %}
|
||||
</select>
|
||||
<select name="year" class="form-control" aria-label="{% trans "Year" %}">
|
||||
{% for y in subevent_list.years %}
|
||||
<option value="{{ y }}" {% if y == subevent_list.date.year %}selected{% endif %}>{{ y }}</option>
|
||||
{% endfor %}
|
||||
</select>
|
||||
</div>
|
||||
<select name="date" class="form-control" aria-label="{% trans "Select month to show" %}">
|
||||
{% for y in subevent_list.years %}
|
||||
<optgroup label="{{ y }}">
|
||||
{% for m in subevent_list.months %}
|
||||
<option value="{{ y }}-{{ m|date:"m" }}" {% if m.month == subevent_list.date.month and y == subevent_list.date.year %}selected{% endif %}>{{ m|date:"F" }} {{ y }}</option>
|
||||
{% endfor %}
|
||||
</optgroup>
|
||||
{% endfor %}
|
||||
</select>
|
||||
<button type="submit" class="js-hidden btn btn-default">
|
||||
{% trans "Go" %}
|
||||
</button>
|
||||
</form>
|
||||
</li>
|
||||
<li class="col-sm-4 hidden-xs text-right flip">
|
||||
<a href="?{% url_replace request "year" subevent_list.after.year "month" subevent_list.after.month %}"
|
||||
<li class="col-sm-4 col-xs-2 text-right flip">
|
||||
<a href="?{% url_replace request "date" subevent_list.after|date:"Y-m" %}"
|
||||
class="btn btn-default" aria-label="{% blocktrans with month=subevent_list.after|date:"F Y" %}Show next month, {{ month }}{% endblocktrans %}">
|
||||
{{ subevent_list.after|date:"F Y" }}
|
||||
<span class="hidden-xs">{{ subevent_list.after|date:"F Y" }}</span>
|
||||
<span class="fa fa-arrow-right" aria-hidden="true"></span>
|
||||
</a>
|
||||
</li>
|
||||
|
||||
@@ -3,54 +3,55 @@
|
||||
{% load urlreplace %}
|
||||
<nav aria-label="{% trans "calendar navigation" %}">
|
||||
<ul class="row calendar-nav">
|
||||
<li class="col-sm-4 hidden-xs text-left flip">
|
||||
<a href="?{% url_replace request "year" subevent_list.before.isocalendar.0 "week" subevent_list.before.isocalendar.1 %}"
|
||||
<li class="col-sm-4 col-xs-2 text-left flip">
|
||||
<a href="?{% url_replace request "date" subevent_list.before|date:"o-\WW" %}"
|
||||
class="btn btn-default" aria-label="{% blocktrans with week=subevent_list.before|date:subevent_list.week_format %}Show previous week, {{ week }}{% endblocktrans %}">
|
||||
<span class="fa fa-arrow-left" aria-hidden="true"></span>
|
||||
{{ subevent_list.before|date:subevent_list.week_format }}
|
||||
<span class="hidden-xs">{{ subevent_list.before|date:subevent_list.week_format }}</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="col-sm-4 col-xs-12 text-center">
|
||||
<li class="col-sm-4 col-xs-8 text-center">
|
||||
<form class="form-inline" method="get" id="monthselform" action="{% eventurl event "presale:event.index" cart_namespace=cart_namespace %}">
|
||||
{% for f, v in request.GET.items %}
|
||||
{% if f != "week" and f != "year" %}
|
||||
{% if f != "date" %}
|
||||
<input type="hidden" name="{{ f }}" value="{{ v }}">
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
<div role="group" aria-label="{% trans "Select week and year to show" %}">
|
||||
<select name="week" class="form-control select-calendar-week-short" aria-label="{% trans "Week" %}">
|
||||
{% for w in subevent_list.weeks %}
|
||||
<option value="{{ w.0.isocalendar.1 }}" {% if w.0.isocalendar.1 == subevent_list.date.isocalendar.1 %}selected{% endif %}>{% trans "W" %} {{ w.0.isocalendar.1 }} ({{ w.0|date:"SHORT_DATE_FORMAT" }} – {{ w.1|date:"SHORT_DATE_FORMAT" }})</option>
|
||||
{% endfor %}
|
||||
</select>
|
||||
<select name="year" class="form-control" aria-label="{% trans "Year" %}">
|
||||
{% for y in subevent_list.years %}
|
||||
<option value="{{ y }}" {% if y == subevent_list.date.isocalendar.0 %}selected{% endif %}>{{ y }}</option>
|
||||
{% endfor %}
|
||||
</select>
|
||||
</div>
|
||||
<select name="date" class="form-control" aria-label="{% trans "Select week to show" %}">
|
||||
{% for weeks_per_year in subevent_list.weeks %}
|
||||
<optgroup label="{{ weeks_per_year.0.0.year }}">
|
||||
{% for w in weeks_per_year %}
|
||||
<option value="{{ w.0.isocalendar.0 }}-W{{ w.0.isocalendar.1 }}"
|
||||
{% if w.0.isocalendar.0 == subevent_list.date.isocalendar.0 and w.0.isocalendar.1 == subevent_list.date.isocalendar.1 %}selected{% endif %}>
|
||||
{{ w.0|date:"WEEK_FORMAT" }}
|
||||
({{ w.0|date:"MONTH_DAY_FORMAT" }} – {{ w.1|date:"MONTH_DAY_FORMAT" }})
|
||||
</option>
|
||||
{% endfor %}
|
||||
</optgroup>
|
||||
{% endfor %}
|
||||
</select>
|
||||
<button type="submit" class="js-hidden btn btn-default">
|
||||
{% trans "Go" %}
|
||||
</button>
|
||||
</form>
|
||||
</li>
|
||||
<li class="col-sm-4 hidden-xs text-right flip">
|
||||
<a href="?{% url_replace request "year" subevent_list.after.isocalendar.0 "week" subevent_list.after.isocalendar.1 %}"
|
||||
<li class="col-sm-4 col-xs-2 text-right flip">
|
||||
<a href="?{% url_replace request "date" subevent_list.after|date:"o-\WW" %}"
|
||||
class="btn btn-default" aria-label="{% blocktrans with week=subevent_list.after|date:subevent_list.week_format %}Show next week, {{ week }}{% endblocktrans %}">
|
||||
{{ subevent_list.after|date:subevent_list.week_format }}
|
||||
<span class="hidden-xs">{{ subevent_list.after|date:subevent_list.week_format }}</span>
|
||||
<span class="fa fa-arrow-right" aria-hidden="true"></span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</nav>
|
||||
{% include "pretixpresale/fragment_week_calendar.html" with show_avail=event.settings.event_list_availability days=subevent_list.days show_names=subevent_list.show_names %}
|
||||
<div class="col-sm-4 visible-xs text-center" aria-hidden="true">
|
||||
<a href="?{% url_replace request "year" subevent_list.before.isocalendar.0 "week" subevent_list.before.isocalendar.1 %}"
|
||||
<div class="visible-xs text-center" aria-hidden="true">
|
||||
<a href="?{% url_replace request "date" subevent_list.before|date:"o-\WW" %}"
|
||||
class="btn btn-default">
|
||||
<span class="fa fa-arrow-left" aria-hidden="true"></span>
|
||||
{{ subevent_list.before|date:subevent_list.week_format }}
|
||||
</a>
|
||||
<a href="?{% url_replace request "year" subevent_list.after.isocalendar.0 "week" subevent_list.after.isocalendar.1 %}"
|
||||
<a href="?{% url_replace request "date" subevent_list.after|date:"o-\WW" %}"
|
||||
class="btn btn-default">
|
||||
{{ subevent_list.after|date:subevent_list.week_format }}
|
||||
<span class="fa fa-arrow-right" aria-hidden="true"></span>
|
||||
|
||||
Reference in New Issue
Block a user