feat(PublicPage): add schedule parts system for page with a lot of schedule (dense schedule)
This commit is contained in:
parent
61a9a703e9
commit
ebd725b0d3
3 changed files with 77 additions and 44 deletions
|
|
@ -149,54 +149,58 @@
|
|||
<h2>Crénaux</h2>
|
||||
<div class="section-divider"></div>
|
||||
</div>
|
||||
<div class="schedule org-container">
|
||||
{% for item in data.schedule %}
|
||||
{% if item.when|length > 0 %}
|
||||
<div class="schedule-category">
|
||||
<div class="schedule-category-header" title="Déroulez">
|
||||
<div class="schedule-category-name">
|
||||
{{ item.name|e }}
|
||||
{% if item.description is not empty %}
|
||||
<span class="separator">-</span><span class="subtitle"> {{ item.description|e }}</span>
|
||||
{% endif %}
|
||||
<div class="schedule org-container {% if data.scheduleParts|length > 1 %}dense{% endif %}">
|
||||
{% for schedules in data.scheduleParts %}
|
||||
<div class="schedule-part">
|
||||
{% for item in schedules %}
|
||||
{% if item.when|length > 0 %}
|
||||
<div class="schedule-category">
|
||||
<div class="schedule-category-header" title="Déroulez">
|
||||
<div class="schedule-category-name">
|
||||
{{ item.name|e }}
|
||||
{% if item.description is not empty %}
|
||||
<span class="separator">-</span><span class="subtitle"> {{ item.description|e }}</span>
|
||||
{% endif %}
|
||||
</div>
|
||||
<div class="schedule-category-collapse-icon-container">
|
||||
<svg class="schedule-category-collapse-icon"
|
||||
aria-hidden="true" focusable="false" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
|
||||
<path fill="currentColor" d="M8 256C8 119 119 8 256 8s248 111 248 248-111 248-248 248S8 393 8 256zm231-113.9L103.5 277.6c-9.4 9.4-9.4 24.6 0 33.9l17 17c9.4 9.4 24.6 9.4 33.9 0L256 226.9l101.6 101.6c9.4 9.4 24.6 9.4 33.9 0l17-17c9.4-9.4 9.4-24.6 0-33.9L273 142.1c-9.4-9.4-24.6-9.4-34 0z"></path>
|
||||
</svg>
|
||||
</div>
|
||||
</div>
|
||||
<div class="schedule-category-collapse-icon-container">
|
||||
<svg class="schedule-category-collapse-icon"
|
||||
aria-hidden="true" focusable="false" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
|
||||
<path fill="currentColor" d="M8 256C8 119 119 8 256 8s248 111 248 248-111 248-248 248S8 393 8 256zm231-113.9L103.5 277.6c-9.4 9.4-9.4 24.6 0 33.9l17 17c9.4 9.4 24.6 9.4 33.9 0L256 226.9l101.6 101.6c9.4 9.4 24.6 9.4 33.9 0l17-17c9.4-9.4 9.4-24.6 0-33.9L273 142.1c-9.4-9.4-24.6-9.4-34 0z"></path>
|
||||
</svg>
|
||||
</div>
|
||||
</div>
|
||||
<div class="schedule-category-table">
|
||||
<div class="schedule-category-days-container">
|
||||
{# {% for when in item.when %}
|
||||
<div class="schedule-category-day-container">
|
||||
<div class="schedule-category-day">
|
||||
{{ when.day }}
|
||||
</div>
|
||||
<div class="schedule-category-hours">
|
||||
{{ when.from }} <span class="separator">-</span> {{ when.to }}
|
||||
</div>
|
||||
</div>
|
||||
{% endfor %} #}
|
||||
{% for when in item.when %}
|
||||
<div class="schedule-category-day-container">
|
||||
<div class="schedule-category-day">
|
||||
{{ when.day|e }}
|
||||
</div>
|
||||
<div class="schedule-category-hours">
|
||||
{% for i in when.hours %}
|
||||
<span>
|
||||
{{ i.from|e }} <span class="separator">-</span> {{ i.to|e }}{% if not loop.last %},{% endif %}
|
||||
</span>
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endfor %}
|
||||
<div class="schedule-category-table">
|
||||
<div class="schedule-category-days-container">
|
||||
{# {% for when in item.when %}
|
||||
<div class="schedule-category-day-container">
|
||||
<div class="schedule-category-day">
|
||||
{{ when.day }}
|
||||
</div>
|
||||
<div class="schedule-category-hours">
|
||||
{{ when.from }} <span class="separator">-</span> {{ when.to }}
|
||||
</div>
|
||||
</div>
|
||||
{% endfor %} #}
|
||||
{% for when in item.when %}
|
||||
<div class="schedule-category-day-container">
|
||||
<div class="schedule-category-day">
|
||||
{{ when.day|e }}
|
||||
</div>
|
||||
<div class="schedule-category-hours">
|
||||
{% for i in when.hours %}
|
||||
<span>
|
||||
{{ i.from|e }} <span class="separator">-</span> {{ i.to|e }}{% if not loop.last %},{% endif %}
|
||||
</span>
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</section>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue