Better mobile menu

This commit is contained in:
Tom Hubrecht 2021-08-22 03:52:57 +02:00
parent f2b4e9bcfe
commit db2d69bc5f
2 changed files with 256 additions and 174 deletions

View file

@ -85,142 +85,145 @@
<div class="level-right">
{# Visibilité de l'élection #}
<div class="level-item">
{% if not election.visible %}
<span class="tag is-medium is-outlined is-warning is-light">
<span class="icon">
<i class="fas fa-eye-slash"></i>
</span>
<span>{% trans "Élection invisible" %}</span>
</span>
{% else %}
<span class="tag is-medium is-outlined is-primary is-light">
<span class="icon">
<i class="fas fa-eye"></i>
</span>
<span>{% trans "Élection visible" %}</span>
</span>
{% endif %}
</div>
{# Menu d'actions #}
<div class="level-item">
<div class="dropdown is-right">
<div class="dropdown-trigger">
<button class="button" aria-haspopup="true" aria-controls="dropdown-menu">
<span class="icon-text">
<span class="icon">
<i class="fas fa-cog" aria-hidden="true"></i>
</span>
<span>{% trans "Actions" %}</span>
<div class="level is-mobile">
<div class="level-item">
{% if not election.visible %}
<span class="tag is-medium is-outlined is-warning is-light">
<span class="icon">
<i class="fas fa-eye-slash"></i>
</span>
</button>
<span>{% trans "Élection invisible" %}</span>
</span>
{% else %}
<span class="tag is-medium is-outlined is-primary is-light">
<span class="icon">
<i class="fas fa-eye"></i>
</span>
<span>{% trans "Élection visible" %}</span>
</span>
{% endif %}
</div>
<div class="dropdown-menu" id="dropdown-menu" role="menu">
<div class="dropdown-content">
{# Vue classique #}
<a class="dropdown-item" href="{% url 'election.view' election.pk %}">
<span class="icon">
<i class="fas fa-exchange-alt"></i>
</span>
<span>{% trans "Vue classique" %}
</a>
{# Menu d'actions #}
<div class="level-item">
<div class="dropdown is-right">
<div class="dropdown-trigger">
<button class="button" aria-haspopup="true" aria-controls="dropdown-menu">
<span class="icon-text">
<span class="icon">
<i class="fas fa-cog" aria-hidden="true"></i>
</span>
<span>{% trans "Actions" %}</span>
</span>
</button>
</div>
<hr class="dropdown-divider">
<div class="dropdown-menu" id="dropdown-menu" role="menu">
<div class="dropdown-content">
{# Vue classique #}
<a class="dropdown-item" href="{% url 'election.view' election.pk %}">
<span class="icon">
<i class="fas fa-exchange-alt"></i>
</span>
<span>{% trans "Vue classique" %}
</a>
{% if not election.visible %}
{# Rend l'élection visible par tout le monde #}
<a class="dropdown-item" href="{% url 'election.set-visible' election.pk %}">
<span class="icon">
<i class="fas fa-eye"></i>
</span>
<span>{% trans "Rendre l'élection visible" %}
</a>
{% endif %}
<hr class="dropdown-divider">
{# Téléchargement de la liste des votant·e·s #}
<a class="dropdown-item" href="{% url 'election.export-voters' election.pk %}">
<span class="icon">
<i class="fas fa-file-download"></i>
</span>
<span>{% trans "Exporter les votant·e·s" %}
</a>
{% if not election.visible %}
{# Rend l'élection visible par tout le monde #}
<a class="dropdown-item" href="{% url 'election.set-visible' election.pk %}">
<span class="icon">
<i class="fas fa-eye"></i>
</span>
<span>{% trans "Rendre l'élection visible" %}
</a>
{% endif %}
{% if election.start_date > current_time %}
{# Modification de l'élection #}
<a class="dropdown-item" href="{% url 'election.update' election.pk %}">
<span class="icon">
<i class="fas fa-edit"></i>
</span>
<span>{% trans "Modifier" %}</span>
</a>
{# Téléchargement de la liste des votant·e·s #}
<a class="dropdown-item" href="{% url 'election.export-voters' election.pk %}">
<span class="icon">
<i class="fas fa-file-download"></i>
</span>
<span>{% trans "Exporter les votant·e·s" %}
</a>
{# Gestion des votant·e·s #}
{% if election.restricted %}
<a class="dropdown-item" href="{% url 'election.upload-voters' election.pk %}">
<span class="icon">
<i class="fas fa-file-import"></i>
</span>
<span>{% trans "Gestion de la liste de votant·e·s" %}</span>
</a>
{% endif %}
{% if election.start_date > current_time %}
{# Modification de l'élection #}
<a class="dropdown-item" href="{% url 'election.update' election.pk %}">
<span class="icon">
<i class="fas fa-edit"></i>
</span>
<span>{% trans "Modifier" %}</span>
</a>
{% elif election.end_date < current_time %}
{# Gestion des votant·e·s #}
{% if election.restricted %}
<a class="dropdown-item" href="{% url 'election.upload-voters' election.pk %}">
<span class="icon">
<i class="fas fa-file-import"></i>
</span>
<span>{% trans "Gestion de la liste de votant·e·s" %}</span>
</a>
{% endif %}
{% if not election.tallied %}
{# Liste des votants #}
<a class="dropdown-item" href="{% url 'election.voters' election.pk %}">
<span class="icon">
<i class="fas fa-list"></i>
</span>
<span>{% trans "Liste des votant·e·s" %}</span>
</a>
{% elif election.end_date < current_time %}
{# Dépouillement #}
<a class="dropdown-item" href="{% url 'election.tally' election.pk %}">
<span class="icon">
<i class="fas fa-poll-h"></i>
</span>
<span>{% trans "Dépouiller" %}</span>
</a>
{% if not election.tallied %}
{# Liste des votants #}
<a class="dropdown-item" href="{% url 'election.voters' election.pk %}">
<span class="icon">
<i class="fas fa-list"></i>
</span>
<span>{% trans "Liste des votant·e·s" %}</span>
</a>
{% else %}
{# Dépouillement #}
<a class="dropdown-item" href="{% url 'election.tally' election.pk %}">
<span class="icon">
<i class="fas fa-poll-h"></i>
</span>
<span>{% trans "Dépouiller" %}</span>
</a>
{# Publication des résultats #}
{% if not election.archived %}
<a class="dropdown-item" href="{% url 'election.publish' election.pk %}">
<span class="icon">
<i class="fas fa-edit"></i>
</span>
{% if not election.results_public %}
<span>{% trans "Publier" %}</span>
{% else %}
<span>{% trans "Dépublier" %}</span>
{% endif %}
</a>
{% endif %}
{% else %}
{# Export des résultats #}
<a class="dropdown-item" href="{% url 'election.download-results' election.pk %}">
<span class="icon">
<i class="fas fa-save"></i>
</span>
<span>{% trans "Télécharger les résultats" %}</span>
</a>
{# Publication des résultats #}
{% if not election.archived %}
<a class="dropdown-item" href="{% url 'election.publish' election.pk %}">
<span class="icon">
<i class="fas fa-edit"></i>
</span>
{% if not election.results_public %}
<span>{% trans "Publier" %}</span>
{% else %}
<span>{% trans "Dépublier" %}</span>
{% endif %}
</a>
{% endif %}
{# Archivage #}
{% if not election.archived %}
<a class="dropdown-item" href="{% url 'election.archive' election.pk %}">
<span class="icon">
<i class="fas fa-archive"></i>
</span>
<span>{% trans "Archiver" %}</span>
</a>
{% endif %}
{% endif %}
{# Export des résultats #}
<a class="dropdown-item" href="{% url 'election.download-results' election.pk %}">
<span class="icon">
<i class="fas fa-save"></i>
</span>
<span>{% trans "Télécharger les résultats" %}</span>
</a>
{% endif %}
{# Archivage #}
{% if not election.archived %}
<a class="dropdown-item" href="{% url 'election.archive' election.pk %}">
<span class="icon">
<i class="fas fa-archive"></i>
</span>
<span>{% trans "Archiver" %}</span>
</a>
{% endif %}
{% endif %}
{% endif %}
</div>
</div>
</div>
</div>
</div>