templates/section/carrousel.html.twig line 1

Open in your IDE?
  1. <section class="hero-carousel position-relative overflow-hidden">
  2.   <div id="mainHero" class="carousel slide" data-bs-ride="carousel">
  3.     <div class="carousel-inner">
  5.       {% for slide in slides %}
  6.         <div class="carousel-item {{ loop.first ? 'active' }}">
  7.           <div class="d-flex flex-column flex-md-row align-items-center justify-content-between">
  8.             
  9.             <!-- Bloc gauche texte -->
  10.             <div class="hero-text p-4 p-md-5 text-white flex-fill" style="min-width:280px;">
  11.               <h2 class="fw-bold text-warning mb-1">{{ slide.title }}</h2>
  12.               <h3 class="fw-bold fs-4 mb-3">{{ slide.subtitle }}</h3>
  13.               {% if slide.cta_text %}
  14.                 <a href="{{ slide.cta_link }}" class="btn btn-light btn-sm">{{ slide.cta_text }}</a>
  15.               {% endif %}
  16.             </div>
  18.             <!-- Image à droite -->
  19.             <div class="hero-image flex-fill text-center">
  20.               <img src="{{ asset(slide.image) }}" class="img-fluid w-100" alt="Visuel slider">
  21.             </div>
  23.           </div>
  24.         </div>
  25.       {% endfor %}
  27.     </div>
  29.     <!-- Contrôles -->
  30.     <button class="carousel-control-prev" type="button" data-bs-target="#mainHero" data-bs-slide="prev">
  31.       <span class="carousel-control-prev-icon"></span>
  32.     </button>
  33.     <button class="carousel-control-next" type="button" data-bs-target="#mainHero" data-bs-slide="next">
  34.       <span class="carousel-control-next-icon"></span>
  35.     </button>
  36.   </div>
  37. </section>