Skip to content

Session: Improve summary UI/UX #6983

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 1 commit into from
Oct 31, 2025
Merged

Session: Improve summary UI/UX #6983

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
337 changes: 204 additions & 133 deletions public/main/template/default/session/resume_session.html.twig
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,139 +2,210 @@

{% block content %}

{% autoescape false %}
{{ session_header }}
{{ title }}

<table id="session-properties" class="table table-bordered">
<tr>
<td>{{ 'Created by'|trans }}</td>
<td>
{% for session_admin in session.sessionAdmins %}
{{ session_admin | user_complete_name_with_link }}<br>
{% endfor %}
</td>
</tr>
<tr>
<td>{{ 'General coach' | trans}} :</td>
<td>
{% for coach in session.generalCoaches %}
{{ coach | user_complete_name_with_link }}<br>
{% endfor %}
</td>
</tr>
{% if session.category %}
<tr>
<td>{{ 'Session category' | trans}} </td>
<td>{{ session.category.title }}</td>
</tr>
{% endif %}

{% if session.duration > 0 %}
<tr>
<td>{{ 'Duration' | trans}} </td>
<td>
{{ session.duration }} {{ 'Days' | trans }}
</td>
</tr>
{% else %}
<tr>
<td>{{ 'Dates shown' | trans}} </td>
<td>{{ session_dates.display }}</td>
</tr>
<tr>
<td>{{ 'Access dates for students' | trans}} </td>
<td>{{ session_dates.access }}</td>
</tr>
<tr>
<td>{{ 'Access dates for coaches' | trans}} </td>
<td>{{ session_dates.coach }}</td>
</tr>
{% endif %}

<tr>
<td>{{ 'Description' | trans}} </td>
<td>
{{ session.description }}
</td>
</tr>
<tr>
<td>{{ 'Show description' | trans}} </td>
<td>
{% if session.showDescription == 1 %}
{{ 'Yes' | trans}}
{% else %}
{{ 'No' | trans}}
<div class="w-full">

{% autoescape false %}
<div class="pt-1 mb-5 md:mb-8 space-y-2">
{{ session_header }}
{{ title }}
</div>
{% endautoescape %}

{# Session overview card #}
<div class="bg-white border border-gray-25 rounded-2xl shadow-sm p-6 md:p-7 mb-6 md:mb-8">
<div class="flex items-center gap-2 mb-4">
<i class="mdi mdi-information-outline text-info text-xl" aria-hidden="true"></i>
<h3 class="text-gray-90 text-body-1 font-semibold">{{ 'Session overview'|trans }}</h3>
</div>

<dl class="grid grid-cols-1 md:grid-cols-2 gap-4 md:gap-5">

{# Created by #}
<div class="p-4 rounded-xl bg-support-2 border border-gray-25">
<dt class="text-gray-50 text-tiny uppercase tracking-wide">{{ 'Created by'|trans }}</dt>
<dd class="prose prose-sm max-w-none text-gray-90 mt-1">
{% autoescape false %}
{% for session_admin in session.sessionAdmins %}
{{ session_admin | user_complete_name_with_link }}<br>
{% else %}
<span class="text-gray-50">{{ 'None'|trans }}</span>
{% endfor %}
{% endautoescape %}
</dd>
</div>

{# General coach #}
<div class="p-4 rounded-xl bg-support-2 border border-gray-25">
<dt class="text-gray-50 text-tiny uppercase tracking-wide">{{ 'General coach'|trans }}</dt>
<dd class="prose prose-sm max-w-none text-gray-90 mt-1">
{% autoescape false %}
{% for coach in session.generalCoaches %}
{{ coach | user_complete_name_with_link }}<br>
{% else %}
<span class="text-gray-50">{{ 'None'|trans }}</span>
{% endfor %}
{% endautoescape %}
</dd>
</div>

{# Session category #}
{% if session.category %}
<div class="p-4 rounded-xl bg-support-2 border border-gray-25">
<dt class="text-gray-50 text-tiny uppercase tracking-wide">{{ 'Session category'|trans }}</dt>
<dd class="text-gray-90 text-body-2 mt-1">{{ session.category.title }}</dd>
</div>
{% endif %}

{# Duration / Dates #}
{% if session.duration > 0 %}
<div class="p-4 rounded-xl bg-support-2 border border-gray-25">
<dt class="text-gray-50 text-tiny uppercase tracking-wide">{{ 'Duration'|trans }}</dt>
<dd class="text-gray-90 text-body-2 mt-1">{{ session.duration }} {{ 'Days'|trans }}</dd>
</div>
{% else %}
<div class="p-4 rounded-xl bg-support-2 border border-gray-25">
<dt class="text-gray-50 text-tiny uppercase tracking-wide">{{ 'Dates shown'|trans }}</dt>
<dd class="text-gray-90 text-body-2 mt-1">{{ session_dates.display }}</dd>
</div>
<div class="p-4 rounded-xl bg-support-2 border border-gray-25">
<dt class="text-gray-50 text-tiny uppercase tracking-wide">{{ 'Access dates for students'|trans }}</dt>
<dd class="text-gray-90 text-body-2 mt-1">{{ session_dates.access }}</dd>
</div>
<div class="p-4 rounded-xl bg-support-2 border border-gray-25">
<dt class="text-gray-50 text-tiny uppercase tracking-wide">{{ 'Access dates for coaches'|trans }}</dt>
<dd class="text-gray-90 text-body-2 mt-1">{{ session_dates.coach }}</dd>
</div>
{% endif %}

{# Visibility #}
<div class="p-4 rounded-xl bg-support-2 border border-gray-25">
<dt class="text-gray-50 text-tiny uppercase tracking-wide">{{ 'Visibility after end date'|trans }}</dt>
<dd class="text-gray-90 text-body-2 mt-1">
<span class="inline-flex items-center px-2.5 py-1 rounded-full border border-gray-25 bg-white">
{{ session_visibility }}
</span>
</dd>
</div>

{# Career / Promotion #}
{% if session.promotion %}
<div class="p-4 rounded-xl bg-support-2 border border-gray-25">
<dt class="text-gray-50 text-tiny uppercase tracking-wide">{{ 'Career'|trans }}</dt>
<dd class="text-gray-90 text-body-2 mt-1">
<a class="text-info hover:underline"
href="{{ _p.web_main }}admin/career_dashboard.php?filter={{ session.promotion.career.id }}&submit=&_qf__filter_form=">
{{ session.promotion.career.title }}
</a>
</dd>
</div>
<div class="p-4 rounded-xl bg-support-2 border border-gray-25">
<dt class="text-gray-50 text-tiny uppercase tracking-wide">{{ 'Promotion'|trans }}</dt>
<dd class="text-gray-90 text-body-2 mt-1">
<a class="text-info hover:underline"
href="{{ _p.web_main }}admin/promotions.php?action=edit&id={{ session.promotion.id }}">
{{ session.promotion.title }}
</a>
</dd>
</div>
{% endif %}

{# URLs #}
{% if url_list %}
<div class="p-4 rounded-xl bg-support-2 border border-gray-25 md:col-span-2">
<dt class="text-gray-50 text-tiny uppercase tracking-wide mb-2">URL</dt>
<dd class="flex flex-wrap gap-2">
{% for url in url_list %}
<span class="inline-flex items-center px-2.5 py-1 rounded-full bg-white border border-gray-25 text-gray-90 text-caption">
{{ url.url }}
</span>
{% endfor %}
</dd>
</div>
{% endif %}

{# Extra fields #}
{% if extra_fields is not empty %}
<div class="p-4 rounded-xl bg-support-2 border border-gray-25 md:col-span-2">
<dt class="text-gray-50 text-tiny uppercase tracking-wide mb-3">{{ 'Extra fields'|trans }}</dt>
<dd class="grid grid-cols-1 md:grid-cols-2 gap-3">
{% for extra_field in extra_fields %}
<div class="border border-gray-25 rounded-xl p-3 bg-white">
<div class="text-gray-50 text-tiny uppercase tracking-wide">{{ extra_field.text }}</div>
<div class="prose prose-sm max-w-none text-gray-90 mt-1 break-words">
{% if extra_field.value is iterable %}
{{ extra_field.value.value|raw }}
{% else %}
{{ extra_field.value|raw }}
{% endif %}
</div>
</div>
{% endfor %}
</dd>
</div>
{% endif %}
</dl>

{# Description #}
{% if session.description %}
<div class="mt-6">
<h4 class="text-gray-90 text-body-1 font-semibold mb-2">{{ 'Description'|trans }}</h4>
<div class="prose prose-sm max-w-none text-gray-90 bg-white border border-gray-25 rounded-xl p-4">
{{ session.description|raw }}
</div>
</div>
{% endif %}
</td>
</tr>
<tr>
<td>{{ 'Visibility after end date' | trans}} </td>
<td>
{{ session_visibility }}
</td>
</tr>
{% if session.promotion %}
<tr>
<td>{{ 'Career' | trans}}</td>
<td>
<a
href="{{ _p.web_main }}admin/career_dashboard.php?filter={{ session.promotion.career.id }}&submit=&_qf__filter_form="
>
{{ session.promotion.career.title }}
</a>
</td>
</tr>
<tr>
<td>{{ 'Promotion' | trans}}</td>
<td>
<a href="{{ _p.web_main }}admin/promotions.php?action=edit&id={{ session.promotion.id }}">
{{ session.promotion.title }}
</a>
</td>
</tr>
{% endif %}

{% if url_list %}
<tr>
<td>URL</td>
<td>
{% for url in url_list %}
{{ url.url }}
{% endfor %}
</td>
</tr>
{% endif %}

{% for extra_field in extra_fields %}
<tr>
<td>{{ extra_field.text }}</td>
{% if extra_field.value is iterable %}
<td>{{ extra_field.value.value }}</td>
{% else %}
<td>{{ extra_field.value }}</td>

{# Scheduled announcements #}
{% if programmed_announcement %}
<div class="mt-6">
<a class="inline-flex items-center gap-2 px-3 py-2 rounded-xl border border-gray-25 hover:shadow-sm hover:bg-gray-10 transition text-gray-90"
href="{{ _p.web_main }}session/scheduled_announcement.php?session_id={{ session.id }}">
<i class="mdi mdi-bullhorn text-info" aria-hidden="true"></i>
<span class="text-body-2">{{ 'Scheduled announcements'|trans }}</span>
</a>
</div>
{% endif %}
</tr>
{% endfor %}

{% if programmed_announcement %}
<tr>
<td>{{ 'Scheduled announcements' | trans }}</td>
<td>
<a class="btn btn--plain"
href="{{ _p.web_main }}session/scheduled_announcement.php?session_id={{ session.id }}"
>
{{ 'Edit' | trans }}
</a>
</td>
</tr>
{% endif %}
</table>

{{ course_list }}
{{ user_list }}
{{ requirements }}
{{ dependencies }}

{% endautoescape %}
</div>

{# Course list #}
<div class="bg-white border border-gray-25 rounded-2xl shadow-sm p-6 md:p-7 mb-6 md:mb-8">
<div class="flex items-center gap-2 mb-3">
<i class="mdi mdi-book-open-page-variant text-info text-xl" aria-hidden="true"></i>
<span class="text-gray-90 font-semibold">{{ 'Course list'|trans }}</span>
</div>
<div class="overflow-x-auto">
<div class="min-w-[720px]">
{% autoescape false %}{{ course_list }}{% endautoescape %}
</div>
</div>
</div>

{# User list #}
{% if user_list is not empty %}
<div class="bg-white border border-gray-25 rounded-2xl shadow-sm p-6 md:p-7 mb-6 md:mb-8">
<div class="flex items-center gap-2 mb-3">
<i class="mdi mdi-account-multiple text-info text-xl" aria-hidden="true"></i>
<span class="text-gray-90 font-semibold">{{ 'User list'|trans }}</span>
</div>
<div class="overflow-x-auto">
<div class="min-w-[720px]">
{% autoescape false %}{{ user_list }}{% endautoescape %}
</div>
</div>
</div>
{% endif %}

{# Requirements / Dependencies #}
{% if requirements %}
<div class="bg-white border border-gray-25 rounded-2xl shadow-sm p-6 md:p-7 mb-6">
{% autoescape false %}{{ requirements }}{% endautoescape %}
</div>
{% endif %}
{% if dependencies %}
<div class="bg-white border border-gray-25 rounded-2xl shadow-sm p-6 md:p-7">
{% autoescape false %}{{ dependencies }}{% endautoescape %}
</div>
{% endif %}

</div>
{% endblock %}
Loading