alpes-maritimes-2022: don't display steps informations if only one step (#72118)
This commit is contained in:
parent
a632f26e7c
commit
ccb0cf7a72
|
@ -1,40 +1,42 @@
|
|||
{% extends "wcs/front/formdata_steps.html" %}
|
||||
{% block steps-list %}
|
||||
<div class="theme-steps">
|
||||
{% for page_label in page_labels %}
|
||||
{% if forloop.counter == current_page_no %}
|
||||
<strong class="theme-steps--page-nb">Étape {{ forloop.counter }} sur {{ page_labels|length }}</strong>
|
||||
<h2 class="theme-steps--title">
|
||||
{{ page_label }}
|
||||
</h2>
|
||||
<div class="theme-steps--progress-bar" style="--gradient-stop: calc(1% * {{ forloop.counter }} * 100 / {{ page_labels|length }})"></div>
|
||||
{% endif%}
|
||||
{% endfor%}
|
||||
<p class="theme-steps--voir-etapes togglable">
|
||||
<span class="theme-steps--voir" aria-label="Voir"></span>
|
||||
<a class="theme-steps--panel-open" role="button">Toutes les étapes</a>
|
||||
</p>
|
||||
<div class="theme-steps--panel" >
|
||||
<a class="theme-steps--panel-close" role="button">
|
||||
FERMER
|
||||
<span class="theme-steps--panel-close-icon"></span>
|
||||
</a>
|
||||
{{ block.super }}
|
||||
{% if page_labels|length > 1 %}
|
||||
<div class="theme-steps">
|
||||
{% for page_label in page_labels %}
|
||||
{% if forloop.counter == current_page_no %}
|
||||
<strong class="theme-steps--page-nb">Étape {{ forloop.counter }} sur {{ page_labels|length }}</strong>
|
||||
<h2 class="theme-steps--title">
|
||||
{{ page_label }}
|
||||
</h2>
|
||||
<div class="theme-steps--progress-bar" style="--gradient-stop: calc(1% * {{ forloop.counter }} * 100 / {{ page_labels|length }})"></div>
|
||||
{% endif%}
|
||||
{% endfor%}
|
||||
<p class="theme-steps--voir-etapes togglable">
|
||||
<span class="theme-steps--voir" aria-label="Voir"></span>
|
||||
<a class="theme-steps--panel-open" role="button">Toutes les étapes</a>
|
||||
</p>
|
||||
<div class="theme-steps--panel" >
|
||||
<a class="theme-steps--panel-close" role="button">
|
||||
FERMER
|
||||
<span class="theme-steps--panel-close-icon"></span>
|
||||
</a>
|
||||
{{ block.super }}
|
||||
</div>
|
||||
<div class="theme-steps--panel-mask"></div>
|
||||
</div>
|
||||
<div class="theme-steps--panel-mask"></div>
|
||||
</div>
|
||||
<script>
|
||||
const openStepsBtn = document.querySelector('.theme-steps--panel-open')
|
||||
const closeStepsBtn = document.querySelector('.theme-steps--panel-close')
|
||||
const stepsMask = document.querySelector('.theme-steps--panel-mask')
|
||||
<script>
|
||||
const openStepsBtn = document.querySelector('.theme-steps--panel-open')
|
||||
const closeStepsBtn = document.querySelector('.theme-steps--panel-close')
|
||||
const stepsMask = document.querySelector('.theme-steps--panel-mask')
|
||||
|
||||
closeStepsBtn.addEventListener('click', function(){
|
||||
openStepsBtn.click()
|
||||
});
|
||||
stepsMask.addEventListener('click', function(){
|
||||
openStepsBtn.click()
|
||||
});
|
||||
</script>
|
||||
closeStepsBtn.addEventListener('click', function(){
|
||||
openStepsBtn.click()
|
||||
});
|
||||
stepsMask.addEventListener('click', function(){
|
||||
openStepsBtn.click()
|
||||
});
|
||||
</script>
|
||||
{% endif %}
|
||||
{% endblock%}
|
||||
|
||||
|
||||
|
|
Loading…
Reference in New Issue