accourse banner carousel: slide2 control on right, + display when ready

This commit is contained in:
Mathieu Jaumotte 2021-11-22 10:05:34 +01:00
parent 7758e1358d
commit f69d6edba3
3 changed files with 10 additions and 3 deletions

View File

@ -28,6 +28,9 @@ if (ACHeaderSlider) {
touch: true touch: true
}) })
; ;
document.addEventListener('DOMContentLoaded', (e) => {
controlNext.classList.remove('visually-hidden');
});
ACHeaderSlider.addEventListener('slid.bs.carousel', (e) => { ACHeaderSlider.addEventListener('slid.bs.carousel', (e) => {
//console.log('from slide', e.direction, e.relatedTarget, e.from, e.to ); //console.log('from slide', e.direction, e.relatedTarget, e.from, e.to );
switch (e.to) { switch (e.to) {

View File

@ -135,6 +135,10 @@ div#header-accompanying_course-details {
width: 8%; width: 8%;
opacity: inherit; opacity: inherit;
} }
button.carousel-control-prev {
left: unset;
right: 0;
}
span.to-social-issues, span.to-social-issues,
span.to-persons-associated { span.to-persons-associated {
display: inline-block; display: inline-block;

View File

@ -34,13 +34,13 @@
</div> </div>
<div class="carousel-item"> <div class="carousel-item">
{# vue teleport fragment here #} {# vue teleport fragment here #}
<div id="banner-persons-associated" class="col-11 offset-1 text-end"></div> <div id="banner-persons-associated" class="col-11"></div>
</div> </div>
</div> </div>
<button class="carousel-control-prev justify-content-start visually-hidden" type="button" data-bs-target="#ACHeaderSlider" data-bs-slide="prev"> <button class="carousel-control-prev justify-content-end visually-hidden" type="button" data-bs-target="#ACHeaderSlider" data-bs-slide="prev">
<span class="to-social-issues" title="{{ 'see social issues'|trans }}"></span> <span class="to-social-issues" title="{{ 'see social issues'|trans }}"></span>
</button> </button>
<button class="carousel-control-next justify-content-end" type="button" data-bs-target="#ACHeaderSlider" data-bs-slide="next"> <button class="carousel-control-next justify-content-end visually-hidden" type="button" data-bs-target="#ACHeaderSlider" data-bs-slide="next">
<span class="to-persons-associated" title="{{ 'see persons associated'|trans }}"></span> <span class="to-persons-associated" title="{{ 'see persons associated'|trans }}"></span>
</button> </button>
</div> </div>