templates/pages/home.html.twig line 1

  1. {% extends 'base.html.twig' %}
  3. {% block title %}{{ settings[0].siteName }} : bienvenue !{% endblock %}
  5. {% block body %}
  7. <div class="container py-5">
  8.     {# Titre principal du site #}
  9.     <div class="row">
  10.         <div class="col text-center">
  11.             <h1 data-aos="fade-right" data-aos-duration="1000" data-aos-easing="linear" class="home-main-title">{{ settings[0].siteHomesalonmaintitle}}</h1>
  12.         </div>
  13.     </div>
  15.     {# Cartes Programme, Entreprises, Contact #}
  16.     <div class="row">
  17.         <div class="col">
  18.             <div class="row row-cols-1 row-cols-md-5 g-4 d-flex justify-content-center">
  19.                 <div class="col" data-aos="zoom-in" data-aos-duration="1500">
  20.                     <a href="{{ path('app_programme') }}" class="text-decoration-none">
  21.                         <div class="card h-100 zoom">
  22.                             <div class="overflow-hidden">
  23.                                 <img src="{{ asset('assets/img/pages/' ~ settings[0].siteHomecard1image ) }}" class="card-img-top img-fluid" style="max-height: 500px; width: 100%; object-fit: cover;" alt="{{ settings[0].siteHomecard1title }}">
  24.                             </div>
  25.                             <div class="card-body section-home-card-bg1">
  26.                                 <span class="card-number">{{ settings[0].siteHomecard1nb }}</span>
  27.                                 <h5 class="home-card-title">{{ settings[0].siteHomecard1title }}</h5>
  28.                                 <p class="card-text text-center text-white small">{{ settings[0].siteHomecard1text|replace({'<div>' : '', '</div>': '', '<p>': '', '</p>': '',})|raw }}</p>
  29.                             </div>
  30.                         </div>
  31.                     </a>
  32.                 </div>
  34.                 <div class="col" data-aos="zoom-in" data-aos-duration="2000">
  35.                     <a href="{{ path('app_entreprises') }}" class="text-decoration-none">
  36.                         <div class="card h-100 zoom">
  37.                             <div class="position-relative overflow-hidden">
  38.                                 <img src="{{ asset('assets/img/pages/' ~ settings[0].siteHomecard2image ) }}" class="card-img-top img-fluid" style="max-height: 500px; width: 100%; object-fit: cover;" alt="{{ settings[0].siteHomecard2title }}">
  39.                             </div>
  40.                             <div class="card-body section-home-card-bg2">
  41.                                 <span class="card-number">{{ settings[0].siteHomecard2nb }}</span>
  42.                                 <h5 class="home-card-title">{{ settings[0].siteHomecard2title }}</h5>
  43.                                 <p class="card-text text-center text-white small">{{ settings[0].siteHomecard2text|replace({'<div>' : '', '</div>': '', '<p>': '', '</p>': '',})|raw }}</p>
  44.                             </div>
  45.                         </div>
  46.                     </a>
  47.                 </div>
  49.                 <div class="col" data-aos="zoom-in" data-aos-duration="2500">
  50.                     <a href="{{ path('app_contact') }}" class="text-decoration-none">
  51.                         <div class="card h-100 zoom">
  52.                             <div class="position-relative overflow-hidden">
  53.                                 <img src="{{ asset('assets/img/pages/' ~ settings[0].siteHomecard3image ) }}" class="card-img-top img-fluid" style="max-height: 500px; width: 100%; object-fit: cover;" alt="{{ settings[0].siteHomecard3title }}">
  54.                             </div>
  55.                             <div class="card-body section-home-card-bg3">
  56.                                 <span class="card-number">{{ settings[0].siteHomecard3nb }}</span>
  57.                                 <h5 class="home-card-title">{{ settings[0].siteHomecard3title }}</h5>
  58.                                 <p class="card-text text-center text-white small">{{ settings[0].siteHomecard3text|replace({'<div>' : '', '</div>': '', '<p>': '', '</p>': '',})|raw }}</p>
  59.                             </div>
  60.                         </div>
  61.                     </a>
  62.                 </div>
  64.                 <div class="col" data-aos="zoom-in" data-aos-duration="3000">
  65.                     <a href="{{ path('app_offres') }}" class="text-decoration-none">
  66.                         <div class="card h-100 zoom">
  67.                             <div class="position-relative overflow-hidden">
  68.                                 <img src="{{ asset('assets/img/pages/' ~ settings[0].siteHomecard4image ) }}" class="card-img-top img-fluid" style="max-height: 500px; width: 100%; object-fit: cover;" alt="{{ settings[0].siteHomecard4title }}">
  69.                             </div>
  70.                             <div class="card-body section-home-card-bg3">
  71.                                 <span class="card-number2">{{ settings[0].siteHomecard4nb }}</span>
  72.                                 <h5 class="home-card-title">{{ settings[0].siteHomecard4title }}</h5>
  73.                                 <p class="card-text text-center text-white small">{{ settings[0].siteHomecard4text|replace({'<div>' : '', '</div>': '', '<p>': '', '</p>': '',})|raw }}</p>
  74.                             </div>
  75.                         </div>
  76.                     </a>
  77.                 </div>
  79.                 <div class="col" data-aos="zoom-in" data-aos-duration="3000">
  80.                     <a href="{{ path('app_offres') }}" class="text-decoration-none">
  81.                         <div class="card h-100 zoom">
  82.                             <div class="position-relative overflow-hidden">
  83.                                 <img src="{{ asset('assets/img/pages/' ~ settings[0].siteHomecard5image ) }}" class="card-img-top img-fluid" style="max-height: 500px; width: 100%; object-fit: cover;" alt="{{ settings[0].siteHomecard5title }}">
  84.                             </div>
  85.                             <div class="card-body section-home-card-bg3">
  86.                                 <span class="card-number2">{{ settings[0].siteHomecard5nb }}</span>
  87.                                 <h5 class="home-card-title">{{ settings[0].siteHomecard5title }}</h5>
  88.                                 <p class="card-text text-center text-white small">{{ settings[0].siteHomecard5text|replace({'<div>' : '', '</div>': '', '<p>': '', '</p>': '',})|raw }}</p>
  89.                             </div>
  90.                         </div>
  91.                     </a>
  92.                 </div>
  94.             </div>
  95.         </div>
  96.     </div>
  98.     {# Texte principal #}
  99.     <div class="row d-flex justify-content-center mt-4">
  100.         <div class="col-lg-9 col-sm-12 text-center">
  101.             <p>{{ settings[0].siteHomemaintext|raw }}</p>
  102.         </div>
  103.     </div>
  105.     {# Video #}
  106.     <div class="row mt-4">
  107.         <div class="col text-center video">
  108.             <div class="video">
  109.                 <video controls width="250">
  110.                     <source src="{{ asset('assets/video/') ~ settings[0].siteHomemainvideo }}" type="video/mp4">
  111.                     Veuillez mettre à jour votre navigateur
  112.                 </video>
  113.             </div>
  114.         </div>
  115.     </div>
  117.     {# Logos des entreprises #}
  118.     <div class="row my-5">
  119.         <div class="col text-center home-partenaires-image">
  120.             {% for ent in entreprises %}
  121.                 <img data-aos="zoom-in-up" data-aos-duration="1100" src="{{ asset('assets/img/entreprises/' ~ ent.logo ) }}" alt="{{ ent.title }}" class="img-fluid" style="object-fit: scale-down;">
  122.             {% endfor %}
  123.         </div>
  124.     </div>
  126.     {# CTA Découverte métiers #}
  127.     <div class="row mt-5 decouverte-metiers-bg d-flex justify-content-center">
  128.         <div class="col-lg-8 home-section-description">
  129.             <p data-aos="fade-right" data-aos-duration="2000">
  130.                 <span>{{ settings[0].siteHomesubtext|replace({'<div>' : '', '</div>': '',})|raw }}</span>
  131.             </p>
  132.         </div>
  133.     </div>
  135. </div>
  137. {# Infos pratiques : Google map + infos pratiques #}
  138. <div class="container py-5">
  139.     <div class="row g-5 py-4">
  140.         <div class="col-lg-6 col-sm-12">
  141.             {# {{ settings[0].siteMap|raw }} #}
  142.             <div class="googlemapsembed py-3" data-url="{{ settings[0].siteMap }}" width="100%" height="600"></div>
  143.         </div>
  144.         <div class="col-lg-6 col-sm-12" data-aos="fade-right" data-aos-duration="2000">
  145.             <h1 class="home-title-pratique">{{ settings[0].siteHomepratiquemaintitle }}</h1>
  147.             <h3 class="home-subtitle-pratique">{{ settings[0].siteHomepratiquetitle1 }}</h3>
  148.             <p>{{ settings[0].siteHomepratiquetext1|replace({'<div>' : '', '</div>': '',})|raw }}</p>
  150.             <h3 class="home-subtitle-pratique">{{ settings[0].siteHomepratiquetitle2 }}</h3>
  151.             <p>{{ settings[0].siteHomepratiquetext2|replace({'<div>' : '', '</div>': '',})|raw }}</p>
  153.             <h3 class="home-subtitle-pratique">{{ settings[0].siteHomepratiquetitle3 }}</h3>
  154.             <p>{{ settings[0].siteHomepratiquetext3|replace({'<div>' : '', '</div>': '',})|raw }}</p>
  156.             <div class="mt-4">
  157.                 Suivez les actualités sur
  158.                 <a href="{{ settings[0].siteFacebook }}" class="text-decoration-none">
  159.                     <svg xmlns="http://www.w3.org/2000/svg" width="22" height="22" viewBox="0 0 24 24"><path fill="currentColor" d="M14 13.5h2.5l1-4H14v-2c0-1.03 0-2 2-2h1.5V2.14c-.326-.043-1.557-.14-2.857-.14C11.928 2 10 3.657 10 6.7v2.8H7v4h3V22h4v-8.5Z"/></svg>
  160.                 </a>
  161.             </div>
  162.         </div>
  163.     </div>
  164. </div>
  165. {% endblock %}