templates/home/index.html.twig line 1

Open in your IDE?
  1. {% extends 'base.html.twig' %}
  3. {% block body %}
  4.     {% include 'include/_title.html.twig' with {title: ('Bienvenue')|trans} %}
  5.     <div class="section-wrapper">
  6.         <section class="container mt-5 py-5">
  7.             <div class="row">
  8.                 <div class="col-lg-6">
  9.                     <div class="swiper mb-5 mb-lg-0" {{ stimulus_controller('swiper') }}>
  10.                         <div class="swiper-wrapper">
  11.                             {% for instrument in instruments %}
  12.                                 <figure class="swiper-slide p-2">
  13.                                     <img src="{{ (instrument_dir ~ '/' ~ instrument.picture)|imagine_filter('instrument_swiper_thumb') }}" alt="">
  14.                                     <figcaption class="d-flex flex-column p-2 w-50">
  15.                                         <h3 class="fs-5">{{ instrument.name }}</h3>
  16.                                         <p>{{ instrument.summary }}</p>
  17.                                         <a class="btn btn-sm btn-primary mt-auto"
  18.                                            title="Accéder et écouter {{ instrument.name }}"
  19.                                            href="{{ path('app_instrument_show', {slug: instrument.slug}) }}">{{ 'Afficher'|trans }}</a>
  20.                                     </figcaption>
  21.                                 </figure>
  22.                             {% endfor %}
  23.                         </div>
  24.                     </div>
  25.                 </div>
  26.                 <div class="col-lg-5 d-flex flex-column justify-content-center align-items-center align-items-lg-start text-center text-lg-start">
  27.                     <h1>Welcome to Jimi&nbsp;&&nbsp;the&nbsp;wolf!</h1>
  28.                     <p>
  29.                         Jimi & the wolf est un catalogue d’instruments qui va vous étonner !
  30.                         <br>
  31.                         Découvrez et écoutez des titres qui ont été enregistrés avec les instruments du catalogue.
  32.                     </p>
  33.                     <a class="btn btn-primary" href="{{ path('app_instrument_index') }}">Parcourir le catalogue</a>
  34.                 </div>
  35.             </div>
  36.         </section>
  38.     {#    Le titre#}
  39.         <section class="container mt-5 py-5">
  40.             <div class="d-flex align-items-baseline">
  41.                 <h2>{{ 'Par les titres'|trans }}</h2>
  42.                 <a href="{{ path('app_sound_index') }}" class="ms-auto">
  43.                     {{ 'Tous les titres'|trans }}
  44.                 </a>
  45.             </div>
  46.             <div class="row g-5">
  47.                 {% for sound in sounds %}
  48.                     <div class="col-lg-2 col-6">
  49.                         {{ component('sound', {
  50.                             sound: sound,
  51.                             isCard: true
  52.                         }) }}
  53.                     </div>
  54.                 {% endfor %}
  55.             </div>
  56.         </section>
  57.     </div>
  59. {#    Hero center#}
  60.     <section class="text-bg-light-300 p-5 text-center">
  61.         <p class="fs-4">
  62.             Vous êtes passioné·· e de musique et d’instruments ?
  63.             <br />
  64.             Participez à la mise à jour du catalogue en partageant vos connaissances.
  65.         </p>
  66.         <a href="{{ path('app_register') }}" class="btn btn-primary">{{ 'Devenez contributeur'|trans }}</a>
  67.     </section>
  69. {#    Le marques#}
  70.     <section class="container p-5 mt-5">
  71.         <div class="d-flex align-items-baseline">
  72.             <h2>{{ 'Par les marques'|trans }}</h2>
  73.             <a href="{{ path('app_company_index') }}" class="ms-auto">
  74.                 {{ 'Toutes les marques'|trans }}
  75.             </a>
  76.         </div>
  77.         <div class="row g-5">
  78.             {% for company in companies %}
  79.                 <a href="{{ path('app_company_show', {'slug': company.slug}) }}" class="col-lg-3 col-6" title="{{ company.name }}">
  80.                     <img class="img-fluid" src="{{ vich_uploader_asset(company) }}" alt="{{ company.name }}">
  81.                 </a>
  82.             {% endfor %}
  83.         </div>
  84.     </section>
  86. {% endblock %}