feat: add contextual help panels to all backoffice pages

Add a 50/50 or 66/33 split layout to every backoffice page with Dutch
instructions explaining how to use Tijd voor de Test. Content covers the
overall workflow, quiz finalize/activate flow, and both candidate
participation methods (own device vs. shared laptop).

Help text lives in dedicated partials under templates/backoffice/help/ and
is loaded via Twig include(), keeping page templates clean. All strings use
a separate 'instructions' translation domain (instructions+intl-icu.nl.xliff)
isolated from the main messages domain.

Also updates 'Finalize'-related Dutch translations to use 'Afronden' and
adds tooltips to the finalize/unfinalize buttons.
This commit is contained in:
2026-07-04 23:10:12 +02:00
parent f6988f4d77
commit 482ca8be7e
32 changed files with 514 additions and 74 deletions
+55 -48
View File
@@ -11,53 +11,60 @@
{% endblock %}
{% block body %}
<div class="d-flex flex-row align-items-center mb-3">
<h2 class="mb-0 pe-2">
{{ is_granted('ROLE_ADMIN') ? 'All Seasons'|trans : 'Your Seasons'|trans }}
</h2>
<a class="link" href="{{ path('tvdt_backoffice_season_add') }}">
{{ 'Add'|trans }}
</a>
</div>
{% if seasons %}
<table class="table table-hover mb-3">
<thead>
<tr>
{% if is_granted('ROLE_ADMIN') %}
<th scope="col">{{ 'Owner(s)'|trans }}</th>
{% endif %}
<th scope="col">{{ 'Name'|trans }}</th>
<th scope="col">{{ 'Active Quiz'|trans }}</th>
<th scope="col">{{ 'Season Code'|trans }}</th>
<th scope="col">{{ 'Manage'|trans }}</th>
</tr>
</thead>
<tbody>
{% for season in seasons %}
<tr class="align-middle">
{% if is_granted('ROLE_ADMIN') %}
<td>{{ season.owners|map(o => o.email)|join(', ') }}</td>
{% endif %}
<td>{{ season.name }}</td>
<td>
{% if season.activeQuiz %}
{{ season.activeQuiz.name }}
{% else %}
{{ 'No active quiz'|trans }}
<div class="row">
<div class="col-md-8 col-12">
<div class="d-flex flex-row align-items-center mb-3">
<h2 class="mb-0 pe-2">
{{ is_granted('ROLE_ADMIN') ? 'All Seasons'|trans : 'Your Seasons'|trans }}
</h2>
<a class="link" href="{{ path('tvdt_backoffice_season_add') }}">
{{ 'Add'|trans }}
</a>
</div>
{% if seasons %}
<table class="table table-hover mb-3">
<thead>
<tr>
{% if is_granted('ROLE_ADMIN') %}
<th scope="col">{{ 'Owner(s)'|trans }}</th>
{% endif %}
</td>
<td>
<a {% if season.activeQuiz %}href="{{ path('tvdt_quiz_enter_name', {seasonCode: season.seasonCode}) }}"
{% else %}class="disabled" {% endif %}>{{ season.seasonCode }}</a>
</td>
<td>
<a href="{{ path('tvdt_backoffice_season', {seasonCode: season.seasonCode}) }}">{{ 'Manage'|trans }}</a>
</td>
</tr>
{% endfor %}
</tbody>
</table>
{% else %}
{{ 'You have no seasons yet.'|trans }}
{% endif %}
<th scope="col">{{ 'Name'|trans }}</th>
<th scope="col">{{ 'Active Quiz'|trans }}</th>
<th scope="col">{{ 'Season Code'|trans }}</th>
<th scope="col">{{ 'Manage'|trans }}</th>
</tr>
</thead>
<tbody>
{% for season in seasons %}
<tr class="align-middle">
{% if is_granted('ROLE_ADMIN') %}
<td>{{ season.owners|map(o => o.email)|join(', ') }}</td>
{% endif %}
<td>{{ season.name }}</td>
<td>
{% if season.activeQuiz %}
{{ season.activeQuiz.name }}
{% else %}
{{ 'No active quiz'|trans }}
{% endif %}
</td>
<td>
<a {% if season.activeQuiz %}href="{{ path('tvdt_quiz_enter_name', {seasonCode: season.seasonCode}) }}"
{% else %}class="disabled" {% endif %}>{{ season.seasonCode }}</a>
</td>
<td>
<a href="{{ path('tvdt_backoffice_season', {seasonCode: season.seasonCode}) }}">{{ 'Manage'|trans }}</a>
</td>
</tr>
{% endfor %}
</tbody>
</table>
{% else %}
{{ 'You have no seasons yet.'|trans }}
{% endif %}
</div>
<div class="col-md-4 col-12">
{{ include('backoffice/help/index.html.twig') }}
</div>
</div>
{% endblock %}