[A11y] fix calendar nav dropdown (#5078)

* [A11y] fix calendar nav dropdown

* update organizer calender

* keep cal-nav on one line

* simplify html

* unify calendar layouts

* fix rounding issue with .input-group select+button

* add comment to explain complex css

* fix calendar dropdown due to too broad css-selector

* reduce spacing of top-nav

* fix input-group-btn double line through rounding issue
This commit is contained in:
Richard Schreiber
2025-05-14 10:01:16 +02:00
committed by GitHub
parent 4f4903b00e
commit d103d8782b
13 changed files with 386 additions and 222 deletions

View File

@@ -1,44 +1,55 @@
{% load i18n %}
{% load eventurl %}
{% load icon %}
{% load urlreplace %}
<nav aria-label="{% trans "calendar navigation" %}">
<ul class="row calendar-nav">
<li class="col-sm-4 col-xs-2 text-left flip">
<li class="text-left flip">
{% if subevent_list.has_before %}
<a href="?{% url_replace request "date" subevent_list.before|date:"Y-m" %}"
class="btn btn-default" data-save-scrollpos 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>
{% icon "arrow-left" %}
<span class="hidden-xs">{{ subevent_list.before|date:"F Y" }}</span>
</a>
{% endif %}
</li>
<li class="col-sm-4 col-xs-8 text-center">
<li class="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 != "date" %}
<input type="hidden" name="{{ f }}" value="{{ v }}">
{% endif %}
{% endfor %}
<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>
<fieldset>
<legend class="sr-only">{% trans "Select a month to display" %}</legend>
<div>
<label for="calendar-input-date">{% trans "Month" %}</label>
</div>
<div class="input-group">
<select name="date" class="form-control" id="calendar-input-date">
{% 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>
<span class="input-group-btn">
<button type="submit" class="btn btn-default" aria-label="{% trans "Show month" %}">
{% icon "chevron-right" %}
</button>
</span>
</div>
</fieldset>
</form>
</li>
<li class="col-sm-4 col-xs-2 text-right flip">
<li class="text-right flip">
{% if subevent_list.has_after %}
<a href="?{% url_replace request "date" subevent_list.after|date:"Y-m" %}"
class="btn btn-default" data-save-scrollpos aria-label="{% blocktrans with month=subevent_list.after|date:"F Y" %}Show next month, {{ month }}{% endblocktrans %}">
<span class="hidden-xs">{{ subevent_list.after|date:"F Y" }}</span>
<span class="fa fa-arrow-right" aria-hidden="true"></span>
{% icon "arrow-right" %}
</a>
{% endif %}
</li>

View File

@@ -1,63 +1,78 @@
{% load i18n %}
{% load eventurl %}
{% load icon %}
{% load urlreplace %}
<nav aria-label="{% trans "calendar navigation" %}">
<ul class="row calendar-nav">
<li class="col-sm-4 col-xs-2 text-left flip">
<li class="text-left flip">
{% if subevent_list.has_before %}
<a href="?{% url_replace request "date" subevent_list.before|date:"o-\WW" %}"
class="btn btn-default" data-save-scrollpos 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>
{% icon "arrow-left" %}
<span class="hidden-xs">{{ subevent_list.before|date:subevent_list.week_format }}</span>
</a>
{% endif %}
</li>
<li class="col-sm-4 col-xs-8 text-center">
<li class="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 != "date" %}
<input type="hidden" name="{{ f }}" value="{{ v }}">
{% endif %}
{% endfor %}
<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:subevent_list.week_format }}
({{ w.0|date:subevent_list.short_month_day_format }} {{ w.1|date:subevent_list.short_month_day_format }})
</option>
{% endfor %}
</optgroup>
{% for f, v in request.GET.items %}
{% if f != "date" %}
<input type="hidden" name="{{ f }}" value="{{ v }}">
{% endif %}
{% endfor %}
</select>
<button type="submit" class="js-hidden btn btn-default">
{% trans "Go" %}
</button>
<fieldset>
<legend class="sr-only">{% trans "Select a week to display" %}</legend>
<div>
<label for="calendar-input-date">{% trans "Week" %}</label>
</div>
<div class="input-group">
<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:subevent_list.week_format }}
({{ w.0|date:subevent_list.short_month_day_format }} {{ w.1|date:subevent_list.short_month_day_format }})
</option>
{% endfor %}
</optgroup>
{% endfor %}
</select>
<span class="input-group-btn">
<button type="submit" class="btn btn-default" aria-label="{% trans "Show week" %}">
{% icon "chevron-right" %}
</button>
</span>
</div>
</fieldset>
</form>
</li>
<li class="col-sm-4 col-xs-2 text-right flip">
<li class="text-right flip">
{% if subevent_list.has_after %}
<a href="?{% url_replace request "date" subevent_list.after|date:"o-\WW" %}"
class="btn btn-default" data-save-scrollpos aria-label="{% blocktrans with week=subevent_list.after|date:subevent_list.week_format %}Show next week, {{ week }}{% endblocktrans %}">
<span class="hidden-xs">{{ subevent_list.after|date:subevent_list.week_format }}</span>
<span class="fa fa-arrow-right" aria-hidden="true"></span>
{% icon "arrow-right" %}
</a>
{% endif %}
</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="visible-xs text-center" aria-hidden="true">
<a href="?{% url_replace request "date" subevent_list.before|date:"o-\WW" %}"
class="btn btn-default" data-save-scrollpos 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 }}
</a>
<a href="?{% url_replace request "date" subevent_list.after|date:"o-\WW" %}"
class="btn btn-default" data-save-scrollpos 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="fa fa-arrow-right" aria-hidden="true"></span>
</a>
<div class="row visible-xs">
<div class="col-xs-6 text-left flip">
<a href="?{% url_replace request "date" subevent_list.before|date:"o-\WW" %}"
class="btn btn-default" data-save-scrollpos 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>
<span class="hidden-xs">{{ subevent_list.before|date:subevent_list.week_format }}</span>
</a>
</div>
<div class="col-xs-6 text-right flip">
<a href="?{% url_replace request "date" subevent_list.after|date:"o-\WW" %}"
class="btn btn-default" data-save-scrollpos aria-label="{% blocktrans with week=subevent_list.after|date:subevent_list.week_format %}Show next week, {{ week }}{% endblocktrans %}">
<span class="hidden-xs">{{ subevent_list.after|date:subevent_list.week_format }}</span>
<span class="fa fa-arrow-right" aria-hidden="true"></span>
</a>
</div>
</div>

View File

@@ -7,7 +7,7 @@
<thead>
<tr>
{% for d in weeks|iter_weekdays %}
<th><span aria-hidden="true">{{ d|date_fast:"D" }}</span><span class="sr-only">{{ d|date_fast:"l" }}</span></th>
<th><span aria-hidden="true" class="text-muted">{{ d|date_fast:"D" }}</span><span class="sr-only">{{ d|date_fast:"l" }}</span></th>
{% endfor %}
</tr>
</thead>

View File

@@ -16,6 +16,7 @@
{% for f in filter_form.fields %}
{% bootstrap_field filter_form|getitem:f %}
{% endfor %}
<div class="visible-xs">&nbsp;</div>
<button type="submit" class="btn btn-primary">
<span class="fa fa-filter" aria-hidden="true"></span>
{% trans "Filter" %}

View File

@@ -1,61 +1,91 @@
{% extends "pretixpresale/organizers/base.html" %}
{% load i18n %}
{% load icon %}
{% load rich_text %}
{% load eventurl %}
{% load urlreplace %}
{% block title %}{% trans "Event overview" %}{% endblock %}
{% block content %}
{% if organizer_homepage_text %}
<div>
<div class="blank-after">
{{ organizer_homepage_text | rich_text }}
</div>
{% endif %}
<h3>{{ date|date:"F Y" }}</h3>
<form class="form-inline" method="get" id="monthselform" action="{% eventurl request.organizer "presale:organizer.index" %}">
{% for f, v in request.GET.items %}
{% if f != "date" %}
<input type="hidden" name="{{ f }}" value="{{ v }}">
{% endif %}
{% endfor %}
<div class="row">
<div class="col-md-5 col-sm-6 col-xs-12 text-left flip">
{% include "pretixpresale/fragment_calendar_nav.html" with date=date request=request style="calendar" %}
</div>
<div class="col-md-2 col-sm-4 col-xs-8 text-center" role="group" aria-label="{% trans "Select month to show" %}">
<select name="date" class="form-control" aria-label="{% trans "Month" %}">
{% for y in years %}
<optgroup label="{{ y }}">
{% for m in months %}
<option value="{{ y }}-{{ m|date:"m" }}" {% if m.month == date.month and y == 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>
</div>
<div class="col-md-5 col-sm-2 col-xs-4 text-right flip">
{% if has_before %}
<a href="?{% url_replace request "date" before|date:"Y-m" %}"
class="btn btn-default" data-save-scrollpos aria-label="{{ before|date:"F Y" }}">
<span class="fa fa-arrow-left" aria-hidden="true"></span>
<span class="hidden-sm hidden-xs">{{ before|date:"F Y" }}</span>
</a>
{% endif %}
{% if has_after %}
<a href="?{% url_replace request "date" after|date:"Y-m" %}"
class="btn btn-default" data-save-scrollpos aria-label="{{ after|date:"F Y" }}">
<span class="fa fa-arrow-right" aria-hidden="true"></span>
<span class="hidden-sm hidden-xs">{{ after|date:"F Y" }}</span>
</a>
{% endif %}
</div>
<div class="blank-after text-left flip">
{% include "pretixpresale/fragment_calendar_nav.html" with date=date request=request style="calendar" %}
</div>
<div class="panel panel-default">
<div class="panel-heading">
<h2 class="panel-title">
<strong>
{% blocktrans trimmed with month=date|date:"F Y" %}
Events in {{ month }}
{% endblocktrans %}
</strong>
</h2>
</div>
</form>
{% include "pretixpresale/fragment_event_list_filter.html" with request=request %}
{% include "pretixpresale/fragment_calendar.html" with show_avail=request.organizer.settings.event_list_availability %}
{% if filter_form.fields %}
<div class="panel-subhead">
{% include "pretixpresale/fragment_event_list_filter.html" with request=request %}
</div>
{% endif %}
<div class="panel-body">
<nav aria-label="{% trans "calendar navigation" %}">
<ul class="row calendar-nav">
<li class="text-left flip">
{% if has_before %}
<a href="?{% url_replace request "date" before|date:"Y-m" %}"
class="btn btn-default" data-save-scrollpos aria-label="{{ before|date:"F Y" }}">
{% icon "arrow-left" %}
<span class="hidden-xs">{{ before|date:"F Y" }}</span>
</a>
{% endif %}
</li>
<li class="text-center">
<form class="form-inline" method="get" id="monthselform" action="{% eventurl request.organizer "presale:organizer.index" %}">
{% for f, v in request.GET.items %}
{% if f != "date" %}
<input type="hidden" name="{{ f }}" value="{{ v }}">
{% endif %}
{% endfor %}
<fieldset>
<legend class="sr-only">{% trans "Select a month to display" %}</legend>
<div>
<label for="calendar-input-date">{% trans "Month" %}</label>
</div>
<div class="input-group">
<select name="date" class="form-control" id="calendar-input-date">
{% for y in years %}
<optgroup label="{{ y }}">
{% for m in months %}
<option value="{{ y }}-{{ m|date:"m" }}" {% if m.month == date.month and y == date.year %}selected{% endif %}>{{ m|date:"F" }} {{ y }}</option>
{% endfor %}
</optgroup>
{% endfor %}
</select>
<span class="input-group-btn">
<button type="submit" class="btn btn-default" aria-label="{% trans "Show month" %}">
{% icon "chevron-right" %}
</button>
</span>
</div>
</fieldset>
</form>
</li>
<li class="text-right flip">
{% if has_after %}
<a href="?{% url_replace request "date" after|date:"Y-m" %}"
class="btn btn-default" data-save-scrollpos aria-label="{{ after|date:"F Y" }}">
<span class="hidden-xs">{{ after|date:"F Y" }}</span>
{% icon "arrow-right" %}
</a>
{% endif %}
</li>
</ul>
</nav>
{% include "pretixpresale/fragment_calendar.html" with show_avail=request.organizer.settings.event_list_availability %}
</div>
</div>
{% if multiple_timezones %}
<div class="alert alert-info">
{% blocktrans trimmed %}

View File

@@ -1,68 +1,102 @@
{% extends "pretixpresale/organizers/base.html" %}
{% load i18n %}
{% load icon %}
{% load rich_text %}
{% load eventurl %}
{% load urlreplace %}
{% block title %}{% trans "Event overview" %}{% endblock %}
{% block content %}
{% if organizer_homepage_text %}
<div>
<div class="blank-after">
{{ organizer_homepage_text | rich_text }}
</div>
{% endif %}
<h3>{{ date|date:"DATE_FORMAT" }}</h3>
<form class="form-inline" method="get" id="monthselform"
action="{% eventurl request.organizer "presale:organizer.index" %}">
{% for f, v in request.GET.items %}
{% if f != "date" %}
<input type="hidden" name="{{ f }}" value="{{ v }}">
{% endif %}
{% endfor %}
<div class="row">
<div class="col-md-5 col-sm-6 col-xs-12 text-left flip">
{% include "pretixpresale/fragment_calendar_nav.html" with date=date request=request style="day" %}
<div class="blank-after text-left flip">
{% include "pretixpresale/fragment_calendar_nav.html" with date=date request=request style="day" %}
</div>
<div class="panel panel-default">
<div class="panel-heading">
<h2 class="panel-title">
<strong>
{% blocktrans trimmed with day=date|date:"DATE_FORMAT" %}
Events on {{ day }}
{% endblocktrans %}
</strong>
</h2>
</div>
{% if filter_form.fields %}
<div class="panel-subhead">
{% include "pretixpresale/fragment_event_list_filter.html" with request=request %}
</div>
<div class="col-md-2 col-sm-4 col-xs-8 text-center">
<input class="datepickerfield form-control" value="{{ date|date:"SHORT_DATE_FORMAT" }}" name="date">
<button type="submit" class="js-hidden btn btn-default">
{% trans "Go" %}
</button>
</div>
<div class="col-md-5 col-sm-2 col-xs-4 text-right flip">
{% endif %}
<div class="panel-body">
<nav aria-label="{% trans "calendar navigation" %}">
<ul class="row calendar-nav">
<li class="text-left flip">
{% if has_before %}
<a href="?{% url_replace request "date" before.date.isoformat %}"
class="btn btn-default" data-save-scrollpos aria-label="{{ before|date:"SHORT_DATE_FORMAT" }}">
{% icon "arrow-left" %}
<span class="hidden-xs">{{ before|date:"SHORT_DATE_FORMAT" }}</span>
</a>
{% endif %}
</li>
<li class="text-center">
<form class="form-inline" method="get" id="monthselform" action="{% eventurl request.organizer "presale:organizer.index" %}">
{% for f, v in request.GET.items %}
{% if f != "date" %}
<input type="hidden" name="{{ f }}" value="{{ v }}">
{% endif %}
{% endfor %}
<fieldset>
<legend class="sr-only">{% trans "Select a date to display" %}</legend>
<div>
<label for="calendar-input-date">{% trans "Date" %}</label>
</div>
<div class="input-group">
<input class="datepickerfield form-control" id="calendar-input-date" value="{{ date|date:"SHORT_DATE_FORMAT" }}" name="date">
<span class="input-group-btn">
<button type="submit" class="btn btn-default" aria-label="{% trans "Show date" %}">
{% icon "chevron-right" %}
</button>
</span>
</div>
</fieldset>
</form>
</li>
<li class="text-right flip">
{% if has_after %}
<a href="?{% url_replace request "date" after.date.isoformat %}"
class="btn btn-default" data-save-scrollpos aria-label="{{ after|date:"SHORT_DATE_FORMAT" }}">
<span class="hidden-xs">{{ after|date:"SHORT_DATE_FORMAT" }}</span>
{% icon "arrow-right" %}
</a>
{% endif %}
</li>
</ul>
</nav>
{% include "pretixpresale/fragment_day_calendar.html" with show_avail=request.organizer.settings.event_list_availability %}
<div class="row visible-xs">
{% if has_before %}
<div class="col-xs-6 text-left flip">
<a href="?{% url_replace request "date" before.date.isoformat %}"
class="btn btn-default" data-save-scrollpos aria-label="{{ before|date:"SHORT_DATE_FORMAT" }}">
class="btn btn-default">
<span class="fa fa-arrow-left" aria-hidden="true"></span>
<span class="hidden-sm hidden-xs">{{ before|date:"SHORT_DATE_FORMAT" }}</span>
<span class="hidden-xs">{{ before|date:"SHORT_DATE_FORMAT" }}</span>
</a>
</div>
{% endif %}
{% if has_after %}
<div class="col-xs-6 text-right flip{% if not has_before %} col-xs-offset-6{% endif %}">
<a href="?{% url_replace request "date" after.date.isoformat %}"
class="btn btn-default" data-save-scrollpos aria-label="{{ after|date:"SHORT_DATE_FORMAT" }}">
<span class="hidden-sm hidden-xs">{{ after|date:"SHORT_DATE_FORMAT" }}</span>
class="btn btn-default">
<span class="hidden-xs">{{ after|date:"SHORT_DATE_FORMAT" }}</span>
<span class="fa fa-arrow-right" aria-hidden="true"></span>
</a>
</div>
{% endif %}
</div>
</div>
</form>
{% include "pretixpresale/fragment_event_list_filter.html" with request=request %}
{% include "pretixpresale/fragment_day_calendar.html" with show_avail=request.organizer.settings.event_list_availability %}
<div class="col-sm-4 visible-xs text-center">
{% if has_before %}
<a href="?{% url_replace request "date" before.date.isoformat %}"
class="btn btn-default">
<span class="fa fa-arrow-left" aria-hidden="true"></span>
{{ before|date:"SHORT_DATE_FORMAT" }}
</a>
{% endif %}
{% if has_after %}
<a href="?{% url_replace request "date" after.date.isoformat %}"
class="btn btn-default">
{{ after|date:"SHORT_DATE_FORMAT" }}
<span class="fa fa-arrow-right" aria-hidden="true"></span>
</a>
{% endif %}
</div>
{% if multiple_timezones %}

View File

@@ -1,82 +1,117 @@
{% extends "pretixpresale/organizers/base.html" %}
{% load i18n %}
{% load icon %}
{% load rich_text %}
{% load eventurl %}
{% load urlreplace %}
{% block title %}{% trans "Event overview" %}{% endblock %}
{% block content %}
{% if organizer_homepage_text %}
<div>
<div class="blank-after">
{{ organizer_homepage_text | rich_text }}
</div>
{% endif %}
<h3>{{ date|date:"F Y" }}</h3>
<form class="form-inline" method="get" id="monthselform"
action="{% eventurl request.organizer "presale:organizer.index" %}">
{% for f, v in request.GET.items %}
{% if f != "date" %}
<input type="hidden" name="{{ f }}" value="{{ v }}">
{% endif %}
{% endfor %}
<div class="row">
<div class="col-md-4 col-sm-6 col-xs-12 text-left flip">
{% include "pretixpresale/fragment_calendar_nav.html" with date=date request=request style="week" %}
<div class="blank-after text-left flip">
{% include "pretixpresale/fragment_calendar_nav.html" with date=date request=request style="week" %}
</div>
<div class="panel panel-default">
<div class="panel-heading">
<h2 class="panel-title">
<strong>
{% blocktrans trimmed with week=date|date:week_format week_day_from=date|date:short_month_day_format week_day_to=date|date:short_month_day_format %}
Events in {{ week }} ({{ week_day_from }} {{ week_day_to }})
{% endblocktrans %}
</strong>
</h2>
</div>
{% if filter_form.fields %}
<div class="panel-subhead">
{% include "pretixpresale/fragment_event_list_filter.html" with request=request %}
</div>
<div class="col-md-4 col-sm-4 col-xs-8 text-center">
<select name="date" class="form-control" aria-label="{% trans "Select week to show" %}">
{% for weeks_per_year in 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 == date.isocalendar.0 and w.0.isocalendar.1 == date.isocalendar.1 %}selected{% endif %}>
{{ w.0|date:week_format }}
({{ w.0|date:short_month_day_format }} {{ w.1|date:short_month_day_format }})
</option>
{% endfor %}
</optgroup>
{% endfor %}
</select>
<button type="submit" class="js-hidden btn btn-default">
{% trans "Go" %}
</button>
</div>
<div class="col-md-4 col-sm-2 col-xs-4 text-right flip">
{% endif %}
<div class="panel-body">
<nav aria-label="{% trans "calendar navigation" %}">
<ul class="row calendar-nav">
<li class="text-left flip">
{% if has_before %}
<a href="?{% url_replace request "date" before|date:"o-\WW" %}"
class="btn btn-default" data-save-scrollpos aria-label="{{ before|date:week_format }}">
{% icon "arrow-left" %}
<span class="hidden-xs">{{ before|date:week_format }}</span>
</a>
{% endif %}
</li>
<li class="text-center">
<form class="form-inline" method="get" id="monthselform" action="{% eventurl request.organizer "presale:organizer.index" %}">
{% for f, v in request.GET.items %}
{% if f != "date" %}
<input type="hidden" name="{{ f }}" value="{{ v }}">
{% endif %}
{% endfor %}
<fieldset>
<legend class="sr-only">{% trans "Select a week to display" %}</legend>
<div>
<label for="calendar-input-date">{% trans "Week" %}</label>
</div>
<div class="input-group">
<select name="date" class="form-control" id="calendar-input-date">
{% for weeks_per_year in 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 == date.isocalendar.0 and w.0.isocalendar.1 == date.isocalendar.1 %}selected{% endif %}>
{{ w.0|date:week_format }}
({{ w.0|date:short_month_day_format }} {{ w.1|date:short_month_day_format }})
</option>
{% endfor %}
</optgroup>
{% endfor %}
</select>
<span class="input-group-btn">
<button type="submit" class="btn btn-default" aria-label="{% trans "Show week" %}">
{% icon "chevron-right" %}
</button>
</span>
</div>
</fieldset>
</form>
</li>
<li class="text-right flip">
{% if has_after %}
<a href="?{% url_replace request "date" after|date:"o-\WW" %}"
class="btn btn-default" data-save-scrollpos aria-label="{{ after|date:week_format }}">
<span class="hidden-xs">{{ after|date:week_format }}</span>
{% icon "arrow-right" %}
</a>
{% endif %}
</li>
</ul>
</nav>
{% include "pretixpresale/fragment_week_calendar.html" with show_avail=request.organizer.settings.event_list_availability %}
<div class="row visible-sm visible-xs">
{% if has_before %}
<div class="col-xs-6 text-left flip">
<a href="?{% url_replace request "date" before|date:"o-\WW" %}"
class="btn btn-default" data-save-scrollpos aria-label="{{ before|date:week_format }}">
class="btn btn-default">
<span class="fa fa-arrow-left" aria-hidden="true"></span>
<span class="hidden-sm hidden-xs">{{ before|date:week_format }}</span>
{{ before|date:week_format }}
</a>
</div>
{% endif %}
{% if has_after %}
<div class="col-xs-6 text-right flip">
<a href="?{% url_replace request "date" after|date:"o-\WW" %}"
class="btn btn-default" data-save-scrollpos aria-label="{{ after|date:week_format }}">
<span class="hidden-sm hidden-xs">{{ after|date:week_format }}</span>
class="btn btn-default">
{{ after|date:week_format }}
<span class="fa fa-arrow-right" aria-hidden="true"></span>
</a>
</div>
{% endif %}
</div>
</div>
</form>
{% include "pretixpresale/fragment_event_list_filter.html" with request=request %}
{% include "pretixpresale/fragment_week_calendar.html" with show_avail=request.organizer.settings.event_list_availability %}
<div class="col-sm-12 visible-sm visible-xs text-center">
{% if has_before %}
<a href="?{% url_replace request "date" before|date:"o-\WW" %}"
class="btn btn-default">
<span class="fa fa-arrow-left" aria-hidden="true"></span>
{{ before|date:week_format }}
</a>
{% endif %}
{% if has_after %}
<a href="?{% url_replace request "date" after|date:"o-\WW" %}"
class="btn btn-default">
{{ after|date:week_format }}
<span class="fa fa-arrow-right" aria-hidden="true"></span>
</a>
{% endif %}
</div>
{% if multiple_timezones %}
<div class="alert alert-info">
{% blocktrans trimmed %}

View File

@@ -19,17 +19,13 @@
<meta property="og:url" content="{% abseventurl organizer "presale:organizer.index" %}"/>
{% endblock %}
{% block content %}
<div>
{% if organizer_homepage_text %}
{% if organizer_homepage_text %}
<div class="blank-after">
{{ organizer_homepage_text | rich_text }}
{% endif %}
</div>
<div id="monthselform">
<div class="row">
<div class="col-md-12">
{% include "pretixpresale/fragment_calendar_nav.html" with date=date request=request style="list" %}
</div>
</div>
{% endif %}
<div class="blank-after text-left flip">
{% include "pretixpresale/fragment_calendar_nav.html" with date=date request=request style="list" %}
</div>
<div class="panel panel-default">
<div class="panel-heading">