templates/pages/home.html.twig line 1

  1. {% extends 'base.html.twig' %}
  3. {# {% block title %}{{ settings[0].siteName }} : {{ homePage.title|raw }}{% endblock %} #}
  5. {% block body %}
  7.     <div class="page">
  8.         <div class="container text-white pb-5">
  9.             <div class="row">
  10.                 <div class="col position-relative container-bulle-responsive">
  11.                     {% if settings[0].siteHomeimage1 is defined and settings[0].siteHomeimage1 != null %}
  12.                         <img src="{{ asset('assets/img/pages/home/' ~ settings[0].siteHomeimage1 ) }}" alt="Logo"
  13.                              class="img-fluid logo-edition" style="max-width: 300px; width: 100%;">
  14.                     {% endif %}
  15.                     <div class="div-hour-home">
  16.                         13<sup style="top: -.30em;">e</sup> édition,<br>nouveaux horaires !<br>De 14h00 à 20h00
  17.                     </div>
  18.                     <div class="bigtitles-bloc">
  19.                         <div class="div-bulle"
  20.                              style="background-image: url('{{ asset('assets/img/pages/home/' ~ settings[0].siteHomeimage2 ) }}');">
  21.                             <p class="home-forum-description-bulle">
  22.                                 {{ settings[0].siteHomeforumdescription|raw }}
  23.                             </p>
  24.                         </div>
  25.                         <h1 class="title-hero-forum">{{ settings[0].siteHomeforumtitle }}</h1>
  26.                         <h2 class="subtitle-home"><span
  27.                                     class="title-hero-main">{{ settings[0].siteHomemaintitle1 }}</span><br>
  28.                             <span class="title-hero-main-bold-left">{{ settings[0].siteHomemaintitle2 }}</span><br><span
  29.                                     class="title-hero-main-bold-right">{{ settings[0].siteHomemaintitle3 }}</span>
  30.                         </h2>
  32.                         <div class="div-date-home"
  33.                              style="background-image: url('{{ asset('assets/img/date-home.svg') }}');">
  34.                             {{ settings[0].siteHomeforumdatejour }}
  35.                             {{ settings[0].siteHomeforumdatejournb }}
  36.                             {{ settings[0].siteHomeforumdatemois }}
  37.                             {{ settings[0].siteHomeforumdateannee }}
  38.                         </div>
  39.                     </div>
  41.                 </div>
  42.             </div>
  44.             {# Video #}
  45.             <div class="row container-video">
  46.                 <div class="col text-center video">
  47.                     <div class="video">
  48.                         <video controls width="250">
  49.                             <source src="{{ asset('assets/videos/' ~ settings[0].siteHomevideo) }}" type="video/mp4">
  50.                             Veuillez mettre à jour votre navigateur
  51.                         </video>
  52.                     </div>
  53.                 </div>
  54.             </div>
  56.             {# Bulles #}
  57.             <div class="row d-flex justify-content-center">
  58.                 <div class="col-lg-3 col-sm-12 text-center text-white"
  59.                      style="background: url({{ asset('assets/img/bulle-info-job-dating.png' ) }}); background-position: center; background-repeat: no-repeat; height: 400px;">
  60.                     <h2 class="fw-bold"
  61.                         style="margin-top: 115px; font-size: 1.75rem !important;">{{ settings[0].siteHomeforumsubdescription|replace({'<div>': '', '</div>': '',})|raw }}</h2>
  62.                 </div>
  63.                 <div class="col-lg-3 col-sm-12 text-center bleu"
  64.                      style="background: url({{ asset('assets/img/bulle-adresse-job-dating.png' ) }}); background-position: top; background-repeat: no-repeat; height: 400px;">
  65.                     <div style="margin-top: 50px;">
  66.                         <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24">
  67.                             <path fill="currentColor"
  68.                                   d="M12 12q.825 0 1.413-.588T14 10q0-.825-.588-1.413T12 8q-.825 0-1.413.588T10 10q0 .825.588 1.413T12 12Zm0 10q-4.025-3.425-6.012-6.362T4 10.2q0-3.75 2.413-5.975T12 2q3.175 0 5.588 2.225T20 10.2q0 2.5-1.988 5.438T12 22Z"/>
  69.                         </svg>
  70.                         {{ settings[0].siteHomeforumadresse|replace({'<div>': '', '</div>': '',})|raw }}
  72.                         <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24">
  73.                             <path fill="currentColor"
  74.                                   d="M11.99 2C6.47 2 2 6.48 2 12s4.47 10 9.99 10C17.52 22 22 17.52 22 12S17.52 2 11.99 2zM16 16a.996.996 0 0 1-1.41 0l-3.29-3.29A1 1 0 0 1 11 12V8c0-.55.45-1 1-1s1 .45 1 1v3.59l3 3c.39.39.39 1.02 0 1.41z"/>
  75.                         </svg>
  76.                         {{ settings[0].siteHomeforumhoraires|replace({'<div>': '', '</div>': '',})|raw }}
  77.                     </div>
  78.                 </div>
  79.             </div>
  81.             {# Programme #}
  82.             <div class="row d-flex justify-content-center align-items-center">
  83.                 <div class="col-lg-6 col-sm-12 text-center">
  84.                     <p class="fw-bold text-uppercase forum-title">{{ settings[0].siteHomeforumtitle }}</p>
  85.                     <p class="mt-4 lead">
  86.                         {{ settings[0].siteHomeforumtext|replace({'<div>': '', '</div>': '',})|raw }}
  87.                     </p>
  88.                 </div>
  89.             </div>
  91.             <div class="row mt-5">
  92.                 <div class="col text-center">
  93.                     <a href="{{ settings[0].siteHomeforumbuttonlink }}"
  94.                        class="button-programme-home">{{ settings[0].siteHomeforumbuttontext }}</a>
  95.                 </div>
  96.             </div>
  98.         </div>
  99.     </div>
  101.     <div class="container py-5">
  102.         <div class="row">
  103.             <div class="col text-center">
  104.                 <h2 class="title-actualites-home">{{ settings[0].siteHomeactualitestitle }}</h2>
  106.                 {# Facebook #}
  107.                 <div id="fb-root"></div>
  108.                 <script async defer crossorigin="anonymous"
  109.                         src="https://connect.facebook.net/fr_FR/sdk.js#xfbml=1&version=v17.0" nonce="ND6cs553"></script>
  110.                 <div class="fb-page" data-href="https://www.facebook.com/forumindustrieBourges" data-tabs="timeline"
  111.                      data-width="" data-height="" data-small-header="false" data-adapt-container-width="true"
  112.                      data-hide-cover="false" data-show-facepile="true">
  113.                     <blockquote cite="https://www.facebook.com/forumindustrieBourges" class="fb-xfbml-parse-ignore"><a
  114.                                 href="https://www.facebook.com/forumindustrieBourges">Forum de l&#039;industrie
  115.                             Bourges</a></blockquote>
  116.                 </div>
  117.             </div>
  118.         </div>
  119.     </div>
  121.     <div class="container-fluid py-5 page">
  122.         <div class="container">
  123.             <div class="row d-flex justify-content-center align-items-center">
  124.                 <div class="col-lg-8 col-sm-12">
  125.                     <h2 class="title-contact-home text-center">{{ settings[0].siteHomecontacttitle }}</h2>
  127.                     {{ form_start(form) }}
  128.                     {% for message in app.flashes('success') %}
  129.                         <div id="message-success" class="alert alert-success alert-dismissible fade show mb-4"
  130.                              role="alert">
  131.                             {{ message }}
  132.                             <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
  133.                         </div>
  134.                     {% endfor %}
  136.                     <div class="bg-danger">
  137.                         {{ form_errors(form) }}
  138.                     </div>
  140.                     <div class="row">
  141.                         <div class="col">
  142.                             {{ form_row(form.nom) }}
  143.                         </div>
  144.                         <div class="col">
  145.                             {{ form_row(form.prenom) }}
  146.                         </div>
  147.                     </div>
  148.                     <div class="row">
  149.                         <div class="col">
  150.                             {{ form_row(form.email) }}
  151.                         </div>
  152.                         <div class="col">
  153.                             {{ form_row(form.telephone) }}
  154.                         </div>
  155.                     </div>
  156.                     <div class="row">
  157.                         <div class="col">
  158.                             {{ form_row(form.objet) }}
  159.                         </div>
  160.                     </div>
  161.                     <div class="row">
  162.                         <div class="col">
  163.                             {{ form_row(form.message) }}
  164.                         </div>
  165.                     </div>
  167.                     <p class="small text-white">*Champs obligatoires</p>
  169.                     <div class="row">
  170.                         <div class="col-lg-10 col-sm-12 text-white">
  171.                             Merci de recopier le code antispam :
  172.                             <span class="ms-2">{{ form_row(form.captcha) }}</span>
  173.                         </div>
  174.                         <div class="col-lg-2 col-sm-12 align-self-center justify-content-center">
  175.                             <button type="submit" class="button-contact">Envoyer</button>
  176.                         </div>
  177.                     </div>
  179.                     {{ form_end(form) }}
  181.                 </div>
  182.             </div>
  183.         </div>
  185.         {# Google Map #}
  186.         <div class="container mt-5">
  187.             <div class="row py-5">
  188.                 <div class="col text-center">
  189.                     <div class="googlemapsembed py-3" data-url="{{ settings[0].siteMap }}" width="100%"
  190.                          height="600"></div>
  191.                 </div>
  192.             </div>
  193.         </div>
  194.     </div>
  196.     <style>
  197.         .eventmodal {
  198.             display: none;
  199.             position: fixed;
  200.             z-index: 100;
  201.             left: 0;
  202.             top: 0;
  203.             width: 100%;
  204.             height: 100%;
  205.             overflow: auto;
  206.             background-color: rgb(0, 0, 0);
  207.             background-color: rgba(0, 0, 0, 0.4);
  208.         }
  210.         .event-modal-content {
  211.             border-radius: 30px;
  212.             margin: 15% auto;
  213.             padding: 20px;
  214.             width: 50%;
  215.             height: 50%;
  216.             background-color: #ed3561;
  217.         }
  219.         .event-modal-content > .modal-box {
  220.             display: flex;
  221.             flex-direction: column;
  222.             justify-content: center;
  223.             align-items: center;
  224.             height: 100%;
  225.         }
  227.         .event-modal-content > .modal-box > p {
  228.             color: #fff;
  229.             font-size: 28px;
  230.         }
  232.         .event-modal-content > .modal-box > .title {
  233.             font-size: 35px;
  234.             font-weight: bold;
  235.         }
  237.         .event-close {
  238.             color: #fff;
  239.             float: right;
  240.             font-size: 50px;
  241.             font-weight: bold;
  242.         }
  244.         .event-close:hover,
  245.         .event-close:focus {
  246.             color: #d7d7d7;
  247.             text-decoration: none;
  248.             cursor: pointer;
  249.         }
  250.     </style>
  252.     <div id="eventModal" class="eventmodal">
  253.         <div class="event-modal-content">
  254.             <div class="event-close">x</div>
  255.             <div class="modal-box">
  256.                 <p>Forum de l’industrie de Bourges</p>
  257.                 <p class="title">JEUDI 25 SEPTEMBRE 2025</p>
  258.                 <p>À vos agendas !</p>
  259.             </div>
  260.         </div>
  261.     </div>
  263.     <script>
  265.         function getCookie(name) {
  266.             let cookies = document.cookie.split("; ");
  267.             for (let i = 0; i < cookies.length; i++) {
  268.                 let [cookieName, cookieValue] = cookies[i].split("=");
  269.                 if (cookieName === name) {
  270.                     return cookieValue;
  271.                 }
  272.             }
  273.             return null;
  274.         }
  276.         // Function to set a cookie
  277.         function setCookie(name, value, days) {
  278.             let expires = new Date();
  279.             expires.setTime(expires.getTime() + days * 24 * 60 * 60 * 1000);
  280.             document.cookie = `${name}=${value};expires=${expires.toUTCString()};path=/`;
  281.         }
  283.         var modal = document.getElementById("eventModal");
  285.         var btn = document.getElementById("myBtn");
  287.         var span = document.getElementsByClassName("event-close")[0];
  289.         window.addEventListener("load", (event) => {
  290.             if (getCookie("modalClosed")) {
  291.                 return;
  292.             }
  293.             modal.style.display = "block";
  294.         })
  296.         span.onclick = function () {
  297.             modal.style.display = "none";
  298.             setCookie("modalClosed", "true", 365);
  299.         }
  300.     </script>
  302. {% endblock %}