templates/pages/index.html.twig line 1

Open in your IDE?
  1. {% extends "base.html.twig" %}
  3. {% block title %}{% endblock %}
  5. {% block body %}
  6.     <main role="main">
  7.         <section class="home" style="background: url(images/migennois_centre_home.jpg);">
  8.             <div class="home__content-text">
  9.                 <h1 style="color: #FFFFFF;">
  10.                     La vie comme
  11.                     vous l’imaginez !
  12.                 </h1>
  13.                 <a href="{{ path("app_installation") }}" class="btn yellow">Famille</a>
  14.                 <a href="{{ path('app_entreprendre') }}" class="btn white">Professionnel</a>
  15.             </div>
  16.         </section>
  18.         <!-- Install -->
  19.         <section class="install">
  20.             <img src="{{ asset('images/icons/house.svg') }}" alt="" class="house">
  21.             <img src="{{ asset('images/icons/idv_LeMigennois.svg') }}" alt="" class="idv">
  22.             <div class="container">
  23.                 <div class="title-subtitle blue">
  24.                     <span class="subtitle">La vie comme vous l’imaginez !</span>
  25.                     <h2>S’installer dans le Migennois ?</h2>
  26.                 </div>
  28.                 <div class="install__points">
  29.                     <div class="install__points__wrapper">
  30.                         <div class="install__points__wrapper__point">
  31.                             <div class="title-point">
  32.                                 <img src="{{ asset('images/icons/point_1_jaune.svg') }}" class="number" alt="">
  33.                                 <h3>Vivre pleinement</h3>
  34.                             </div>
  35.                             <p>
  36.                                 Bienvenue dans le Migennois !<br> Porté par la Communauté de Communes de l’Agglomération
  37.                                 Migennoise et de ses huit communes (Bassou, Bonnard, Charmoy, Cheny, Chichery, Epineau-
  38.                                 Les-Voves, Laroche-Saint-Cydroine et Migennes), le Migennois se situe au centre de l'Yonne,
  39.                                 au nord de la Bourgogne à 1h30 de Paris et Dijon. Vous souhaitez quitter Paris, la banlieue ou
  40.                                 les grandes villes pour vivre plus sereinement ? Moins d'embouteillage, plus de verdure, sans
  41.                                 être isolé, c'est possible. Ce territoire, c'est le Migennois. A vous de choisir, de dire oui à la douceur
  42.                                 de vivre, au calme et à l'authentique.<br>
  43.                                 A vous décider de vivre pleinement la vie comme vous l'imaginez.
  44.                             </p>
  45.                             <img src="{{ asset('images/migennes_parc.jpg') }}" class="mobile" alt="Parc arboré Migennes">
  46.                             <a href="{{ path('app_installation') }}" class="btn blue">En savoir plus</a>
  47.                             <img src="{{ asset('images/migennes_parc.jpg') }}" class="photo desktop" alt="Parc arboré Migennes">
  48.                         </div>
  50.                         <div class="install__points__wrapper__point rp">
  51.                             <div class="title-point yellow">
  52.                                 <img src="{{ asset('images/icons/point_2_bleu.svg') }}" class="number" alt="">
  53.                                 <h3>Entreprendre demain</h3>
  54.                             </div>
  55.                             <p>
  56.                                 Vous souhaitez changer de vie professionnelle ou vous portez un projet de création d’entreprise ? <br>
  57.                                 Le Migennois est votre terre d’accueil. Trouvez l’équilibre que vous recherchez et profitez
  58.                                 pleinement de votre famille. Fini les embouteillages, les heures à rallonge et la problématique
  59.                                 des transports en commun. Le Migennois vous offre tous les avantages : télétravail, fibre
  60.                                 connectée, espace de co-working, aide à l’installation et à l’étude de projet (<a href="{{ path("app_entreprendre") }}">via notre référent
  61.                                 Frédéric</a>)... <br>
  62.                                 Dès à présent, entreprenez demain !
  63.                             </p>
  64.                             <img src="{{ asset('images/migennes-commerce.jpeg') }}" class="mobile" alt="Parc arboré Migennes">
  65.                             <a href="{{ path('app_entreprendre') }}" class="btn yellow">En savoir plus</a>
  66.                             <img src="{{ asset('images/migennes-commerce.jpeg') }}" class="photo desktop" alt="Parc arboré Migennes">
  67.                         </div>
  69.                         <div class="install__points__wrapper__point">
  70.                             <div class="title-point">
  71.                                 <img src="{{ asset('images/icons/point_3_jaune.svg') }}" class="number" alt="">
  72.                                 <h3>S’éloigner, mais pas trop</h3>
  73.                             </div>
  74.                             <p>
  75.                                 Envie d’évasion le temps d’un instant ? <br>
  76.                                 Le Migennois regorge de richesses naturelles dans un cadre bucolique, calme et varié. Balades à vélos, randonnées, 
  77.                                 promenades, <a href="https://www.poneys-des-quatre-saisons.fr/" target="_blank" rel="noopener noreferrer">balades en poney</a> ... <br>
  78.                                 Partez à la découverte de la Bourgogne via nos véloroutes, baladez-vous sur le Canal de Bourgogne avec 
  79.                                 <a href="http://leboat.fr" target="_blank" rel="noopener noreferrer">Le Boat</a>  (location de bateau) 
  80.                                 ou accordez-vous un instant de détente au bord de nos rivières.
  81.                             </p>
  82.                             <img src="{{ asset('images/activites-cheval.jpg') }}" class="mobile" alt="Poney des quatres saisons">
  83.                             <a href="{{ path('app_installation') }}#veloroute" class="btn blue">En savoir plus</a>
  84.                             <img src="{{ asset('images/activites-cheval.jpg') }}" class="photo desktop" alt="Poney des quatres saisons">
  85.                         </div>
  87.                         <div class="install__points__wrapper__point rp">
  88.                             <div class="title-point yellow">
  89.                                 <img src="{{ asset('images/icons/point_4_bleu.svg') }}" class="number" alt="">
  90.                                 <h3>Profiter de chaque instant</h3>
  91.                             </div>
  92.                             <p>
  93.                                 Plongez au cœur du Migennois et de son bassin d’activités incroyablement riche. Sport, culture,
  94.                                 vie associative, vous n’êtes pas près de vous ennuyer ! Le cabaret l’Escale, le cinéma 4k Le
  95.                                 Prisme, l’Ecole de musique intercommunale du Migennois ou encore la MJC... <br>
  96.                                 Une liste non exhaustive des atouts de notre territoire qui n’a rien à envier aux plus grands... <br>
  97.                                 Bienvenue chez vous !
  98.                             </p>
  99.                             <img src="{{ asset('images/migennes-cheval.jpg') }}" class="mobile" alt="Parc arboré Migennes">
  100.                             <a href="{{ path('app_installation') }}#activite" class="btn yellow">En savoir plus</a>
  101.                             <img src="{{ asset('images/migennes-cheval.jpg') }}" class="photo desktop" alt="Parc arboré Migennes">
  102.                         </div>
  104.                         <div class="install__points__wrapper__point">
  105.                             <div class="title-point">
  106.                                 <img src="{{ asset('images/icons/point_5_jaune.svg') }}" class="number" alt="">
  107.                                 <h3>Voir grandir vos enfants</h3>
  108.                             </div>
  109.                             <p>
  110.                                 Quoi de mieux que de voir ses enfants grandir et se développer dans de bonnes conditions. Le
  111.                                 Migennois bénéficie d’équipements d’accueil collectif, d’établissements scolaires et de santé pour
  112.                                 tous les âges. Chacune des communes de la CCAM dispose d’écoles primaires (maternelles et
  113.                                 élémentaires), crèches, garderies, centres de loisirs, rien n’est laissé au hasard.
  114.                             </p>
  115.                             <img src="{{ asset('images/migennes-enfant.png') }}" class="mobile" alt="Parc arboré Migennes">
  116.                             <a href="{{ path('app_installation') }}#enfant" class="btn blue">En savoir plus</a>
  117.                             <img src="{{ asset('images/migennes-enfant.png') }}" class="photo desktop" alt="Parc arboré Migennes">
  118.                         </div>
  119.                         <div class=" install__points__wrapper__point rp">
  120.                             <div class="title-point yellow">
  121.                                 <h3>
  122.                                     Découvrir un aperçu du Migennois en vidéo
  123.                                 </h3>
  124.                             </div>
  125.                             <p>
  126.                                 Notre territoire se targue d’être innovant, connecté, dynamique et empreint de richesses et d’Histoire.
  127.                                 <br>
  128.                                 L'art, la culture, la santé, l'éducation, les services, le bien-manger, le bien-vivre, le sport, la vie associative, la
  129.                                 vie professionnelle, les événements... Nous avons tellement à vous dire, à vous montrer pour vous parler du
  130.                                 Migennois.
  131.                                 <br>
  132.                                 On dit qu'une image vaut mille mots alors que dire d'une vidéo ?
  133.                                 <br>
  134.                                 En découvrant, cet aperçu condensé des paysages, des lieux de vie et des activités qui composent notre territoire,
  135.                                 vous pourrez vous projeter et déjà déterminer si le Migennois est bien la vie comme vous l'imaginez !
  136.                             </p>
  137.                             <iframe src="https://www.youtube-nocookie.com/embed/kYaIq9mxbJE" title="YouTube video player"
  138.                                 allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
  139.                                 allowfullscreen>
  140.                             </iframe>
  141.                             
  142.                         </div> 
  143.                     </div>
  144.                 </div>
  145.             </div>
  146.         </section>
  147.         <section class="suivi-chaleureux">
  148.             <div class="container">
  149.                 <div class="row justify-content-center">
  150.                     <div class="col-5">
  151.                         <div class="title-subtitle yellow">
  152.                             <span class="subtitle">L’accompagnement personnalisé au coeur de votre projet</span>
  153.                             <h2>Un suivi et un accueil chaleureux</h2>
  154.                         </div>
  155.                         <p>
  156.                             La chargée d’accueil et son équipe vous accompagnent gratuitement de l’idée à la réalisation :
  157.                         </p>
  158.                         <ul>
  159.                             <li>
  160.                                 Comprendre les atouts du Migennois en Bourgogne par rapport à votre projet
  161.                             </li>
  162.                             <li>
  163.                                 Être mis en relation avec les bonnes personnes sur place
  164.                             </li>
  165.                             <li>
  166.                                 Être bien accueilli en arrivant !
  167.                             </li>
  168.                         </ul>
  169.                         <a href="{{ path('contact') }}" class="btn blue">Je prends contact</a>
  170.                         <img class="bulle-chat" src="{{ asset('images/icons/bubble-chat.svg') }}" alt="bulle de discussion">
  171.                     </div>
  172.                     <div class="col-4">
  173.                         <img class="right" src="{{ asset('images/suivi-chaleureux.jpg') }}" alt="Photo de notre référente : Alexia">
  174.                     </div>
  175.                 </div>
  176.             </div>
  177.         </section>
  179.         <!-- Ambassador -->
  180.         <section class="ambassadors">
  181.             <div class="rect-swiper"></div>
  182.             <img src="{{ asset('images/icons/man.svg') }}" class="man" alt="Pictogramme homme">
  183.             <img src="{{ asset('images/icons/woman.svg') }}" class="woman desktop" alt="Pictogramme femme">
  184.             <div class="container">
  185.                 <div class="title-subtitle yellow">
  186.                     <span class="subtitle">Le Migennois… Ils vous en parlent !</span>
  187.                     <h2>Découvrez nos ambassadeurs</h2>
  188.                 </div>
  189.                 
  190.                 <div class="ambassadors__carousel swiper" data-controller="swiper">
  191.                     <div class="swiper-wrapper">
  192.                         {% for temoignage in temoignages %}
  193.                             <div class="swiper-slide">
  194.                                 <div class="ambassadors__carousel__ambassador">
  195.                                     <div class="wrapper">
  196.                                         <div class="wrapper__photo">
  197.                                             <img src="{{ vich_uploader_asset(temoignage, 'imageFile') | imagine_filter('citationPortrait') }}" alt="Photo de {{ temoignage.prenom }}">
  198.                                         </div>
  199.                                         <div class="wrapper__nom">
  200.                                             <span class="nom">{{ temoignage.prenom }}</span>
  201.                                             <span class="metier">{{ temoignage.metier }}</span>
  202.                                         </div>
  203.                                     </div>
  204.                                     <p>
  205.                                         <span class="quote yellow">«</span>
  206.                                         {{ temoignage.citation }}
  207.                                         <span class="quote blue">»</span>
  208.                                     </p>
  209.                                     <a href="{{ path('app_ambassadeurs_show', {slug: temoignage.slug, id: temoignage.id}) }}" class="btn blue">Lire le témoignage</a>
  210.                                 </div>
  211.                             </div>
  212.                         {% endfor %}
  213.                         <div class="swiper-slide">
  214.                         </div>
  215.                     </div>
  216.                     <!-- Navigation carousel -->
  217.                     <div class="swiper-navigation">
  218.                         <div class="swiper-button-prev sw-button">
  219.                             <img src="{{ asset('images/icons/prev.svg') }}" alt="Flêche gauche">
  220.                         </div>
  222.                         <div class="swiper-button-next sw-button">
  223.                             <img src="{{ asset('images/icons/next.svg') }}" alt="Flêche droite">
  224.                         </div>
  225.                     </div>
  226.                 </div>
  227.                 <a href="{{ path('app_ambassadeurs_index') }}" class="btn blue mt-4">Voir tous les témoignages</a>
  228.             </div>
  229.         </section>
  231.         <!-- week-end gratuit -->
  232.         <section class="hesitation">
  233.             <div class="container">
  234.                 <div class="row align-center justify-content-between">
  235.                     <div class="col-7">
  236.                         <div class="title-subtitle">
  237.                             <h2>Vous hésitez encore ?</h2>
  238.                         </div>
  239.                         <p>
  240.                             Les équipes de Laou et de la Communauté de Communes du Migennois vous accompagnent
  241.                             gratuitement dans votre changement de ville (trouver sa ville idéale, accélérer son projet
  242.                             professionnel, trouver un logement), quel que soit où vous en êtes de votre projet.
  243.                         </p>
  244.                         <div class="week-end">
  245.                             <h3 class="title-white">Un week-end pour tester votre futur mode de vie en 48h</h3>
  246.                             <span>Le parcours inclut selon votre profil :</span>
  247.                             <ul>
  248.                                 <li>
  249.                                     Un accueil en groupe pour rencontrer d’autres familles
  250.                                 </li>
  251.                                 <li>
  252.                                     Des visites pour découvrir le charme du Migennois en
  253.                                     Bourgogne
  254.                                 </li>
  255.                                 <li>
  256.                                     Des rencontres avec votre futur réseau professionnel pour faire
  257.                                     avancer votre projet
  258.                                 </li>
  259.                             </ul>
  260.                             <a href="https://app.laou.fr/account/signup?coll=577" target="_blank" class="btn white">S'inscrire</a>
  261.                         </div>    
  262.                     </div>
  263.                     <div class="col-4">
  264.                         <img src="{{ asset('images/bienvenue-dans-le-migennois.webp') }}" alt="Fille avec une valise">
  265.                     </div>
  266.                 </div>
  267.             </div>
  268.         </section>
  270.         <!-- Actuality / Event -->
  271.         <section class="actuality-event">
  272.             <div class="container">
  273.                 <div class="title-subtitle blue">
  274.                     <span class="subtitle">La vie comme vous l’aimez !</span>
  275.                     <h2>Ça bouge dans le Migennois</h2>
  276.                 </div>
  278.                 <div class="row actuality-event__list">
  279.                     <div class="col-6">
  280.                         <div class="actuality-event__title yellow">
  281.                             <h3>Actualités</h3>
  282.                             <a href="{{ path('actuality') }}">Voir toutes les actualités ></a>
  283.                         </div>
  285.                         <div class="actuality-event__item">
  286.                             <img src="{{ asset('images/actu-1.jpg') }}" alt="">
  287.                             <div class="actuality-event__item__content">
  288.                                 <h4>
  289.                                     Reprise de l’entrainement pour
  290.                                     les jeunes de l’école de rugby
  291.                                 </h4>
  292.                                 <p>
  293.                                     Proin ac quam et lectus vestibulum blandit. Nunc maximus nibh at placerat tincidunt. 
  294.                                     Nam sem lacus, ornare non ante sed, ultricies fringilla massa. Ut congue, elit non 
  295.                                     tempus elementum, sem risus tincidunt diam…
  296.                                 </p>
  297.                                 <a href="" class="btn yellow">Lire l'article</a>
  298.                             </div>
  299.                         </div>
  301.                         <div class="actuality-event__item">
  302.                             <img src="{{ asset('images/actu-2.jpg') }}" alt="">
  303.                             <div class="actuality-event__item__content">
  304.                                 <h4>
  305.                                     Vide grenier - Dimanche 12 juin
  306.                                     à partir de 8h 
  307.                                 </h4>
  308.                                 <p>
  309.                                     Proin ac quam et lectus vestibulum blandit. Nunc maximus nibh at placerat tincidunt. 
  310.                                     Nam sem lacus, ornare non ante sed, ultricies fringilla massa. Ut congue, elit non 
  311.                                     tempus elementum, sem risus tincidunt diam…
  312.                                 </p>
  313.                                 <a href="" class="btn yellow">Lire l'article</a>
  314.                             </div>
  315.                         </div>
  317.                         <div class="actuality-event__item">
  318.                             <img src="{{ asset('images/actu-3.jpg') }}" alt="">
  319.                             <div class="actuality-event__item__content">
  320.                                 <h4>
  321.                                     La chasse aux oeufs de Prèblin
  322.                                 </h4>
  323.                                 <p>
  324.                                     Proin ac quam et lectus vestibulum blandit. Nunc maximus nibh at placerat tincidunt. 
  325.                                     Nam sem lacus, ornare non ante sed, ultricies fringilla massa. Ut congue, elit non 
  326.                                     tempus elementum, sem risus tincidunt diam…
  327.                                 </p>
  328.                                 <a href="" class="btn yellow">Lire l'article</a>
  329.                             </div>
  330.                         </div>
  331.                     </div>
  333.                     <div class="col-6">
  334.                         <div class="actuality-event__title blue">
  335.                             <h3>Évènements</h3>
  336.                             <a href="{{ path('event') }}">Voir toutes les évènements ></a>
  337.                         </div>
  338.                         {% for event in events%}
  339.                             <div class="actuality-event__item yellow">
  340.                                 <img src="{{ vich_uploader_asset(event, 'imageFile') | imagine_filter('eventPreview') }}" alt="">
  341.                                 <div class="actuality-event__item__content">
  342.                                     <h4>
  343.                                         {{ event.name }}
  344.                                     </h4>
  345.                                     <p>
  346.                                         {{ event.description }}
  347.                                     </p>
  348.                                     {% if event.link %}
  349.                                     <a href="{{ event.link }}" class="btn blue" target="_blank">Voir l'événement</a>
  350.                                     {% endif %}
  351.                                 </div>
  352.                             </div>
  353.                         {% endfor %}
  354.                     </div>
  355.                 </div>
  356.             </div>
  357.         </section>
  359.         <section class="decouvrir-patrimoine">
  360.             <div class="container">
  361.                 <div class="title-subtitle blue">
  362.                     <h2>Venez découvrir le patrimoine du Migennois</h2>
  363.                 </div>
  364.                 <p>
  365.                     Découvrez le Migennois en Bourgogne, entre Paris et Dijon.<br>
  366.                     Nos huit communes regorgent de secrets. À pied ou en vélo, nous vous invitons à parcourir notre territoire.
  367.                     Vous pourrez vous balader dans la vallée d'Othe, découvrir le gué de Bonnard, admirer le paysage en vous rendant à la
  368.                     table d'orientation de Chichery ou contempler l'architecture de nos églises comme l'église Saint-Cydroine. Église
  369.                     romane datant des XIe siècle et XIIe siècle parmi les plus anciennes du département de l'Yonne
  370.                 </p>
  371.                 <a href="{{ path('app_patrimoine') }}" class="btn yellow">En savoir plus</a>
  372.             </div>
  373.         </section>
  375.         <!-- offers -->
  376.         {# <section class="offers">
  377.             <div class="container">
  378.                 <div class="title-subtitle yellow">
  379.                     <span class="subtitle">Le Migennois… C’est pour vous !</span>
  380.                     <h2>Nos offres</h2>
  381.                 </div>
  383.                 <div class="row justify-content-between">
  384.                     <div class="col-4 offer">
  385.                         <div class="offer__title job">
  386.                             <h3>Offres d’emploi</h3>
  387.                             <img src="{{ asset('images/icons/job.svg') }}" alt="Pictogramme offre emploi">
  388.                         </div>
  389.                     </div>
  391.                     <div class="col-4 offer">
  392.                         <div class="offer__title activity">
  393.                             <h3>Reprise d’activité</h3>
  394.                             <img src="{{ asset('images/icons/magasin.svg') }}" alt="Pictogramme offre emploi">
  395.                         </div>
  396.                     </div>
  398.                     <div class="col-4 offer">
  399.                         <div class="offer__title house">
  400.                             <h3>Offres immobilières</h3>
  401.                             <img src="{{ asset('images/icons/cle-maison.svg') }}" alt="Pictogramme offre emploi">
  402.                         </div>
  403.                     </div>
  404.                 </div>
  405.                 <div class="row">
  406.                     <div class="col-4">
  407.                         {% for offreEmploi in offreEmplois %}    
  408.                         <div class="offer mb-3">
  409.                             <div class="offer__content">
  410.                                 <div class="rond"></div>
  411.                                 <div class="tags">
  412.                                     <div class="tag">{{ offreEmploi.ville.nom }}</div>
  413.                                     <div class="tag">{{ offreEmploi.nomEntreprise }}</div>
  414.                                 </div>
  415.                                 <h4>{{ offreEmploi.titre }}</h4>
  416.                                 <p>
  417.                                    {{offreEmploi.description |length > 300 ? offreEmploi.description|slice(0, 300) ~ '...' : offreEmploi.description }}
  418.                                 </p>
  419.                                 <a href="">En savoir plus</a>
  420.                             </div>
  421.                         </div>
  422.                         {% endfor %}
  423.                     </div>
  424.                     <div class="col-4">
  425.                         {% for repriseActivite in repriseActivites %}
  426.                             <div class="offer mb-3">
  427.                                 <div class="offer__content activity">
  428.                                     <div class="rond"></div>
  429.                                     <div class="tags">
  430.                                         <div class="tag">{{ repriseActivite.ville.nom }}</div>
  431.                                         {% if repriseActivite.nomEntreprise %}
  432.                                             <div class="tag">{{ repriseActivite.nomEntreprise }}</div>
  433.                                         {% endif %}
  434.                                     </div>
  435.                                     <h4>{{ repriseActivite.titre }}</h4>
  436.                                     <p>
  437.                                         {{ repriseActivite.description |length > 300 ? repriseActivite.description|slice(0, 300) ~ '...' : repriseActivite.description }}
  438.                                     </p>
  439.                                     <a href="">En savoir plus</a>
  440.                                 </div>
  441.                             </div>
  442.                         {% endfor %}
  443.                     </div>
  444.                     <div class="col-4">
  445.                         {% for offreImmobiliere in offreImmobilieres %}
  446.                             <div class="offer mb-3">
  447.                                 <div class="offer__content house">
  448.                                     <div class="rond"></div>
  449.                                     <div class="tags">
  450.                                         <div class="tag">{{ offreImmobiliere.ville.nom }}</div>
  451.                                     </div>
  452.                                     <h4>{{ offreImmobiliere.titre }}</h4>
  453.                                     <p>
  454.                                         {{ offreImmobiliere.description |length > 300 ? offreImmobiliere.description|slice(0, 300) ~ '...' : offreImmobiliere.description }}
  455.                                     </p>
  456.                                     <a href="">En savoir plus</a>
  457.                                 </div>
  458.                             </div>
  459.                         {% endfor %}
  460.                     </div>
  461.                 </div>
  462.             </div>
  463.         </section> #}
  464.     </main>
  465. {% endblock %}