templates/Lenord/Main/politique.html.twig line 1

Open in your IDE?
  1. {% extends 'Lenord/base.html.twig' %}
  2. {% block header_epingles %}
  3.     {{ include('Lenord/Main/parts/epingles.html.twig') }}
  4. {% endblock %}
  5. {% block header_breadcrumb %}
  6.     {% include 'Nordinfo/Main/parts/breadcrumb.html.twig' with {'variation':'le-nord'} %}
  7. {% endblock %}
  8. {% block header_breadcrumb_pdf %}
  9.     {% include 'Nordinfo/Main/parts/breadcrumb.html.twig' with {'variation':'le-nord'} %}
  10. {% endblock %}
  11. {% block body %}
  12.     <main role="main" tabindex="-1" id="mainContent">
  13.         {% include 'Nordinfo/Main/parts/back_btn.html.twig' with {'back_btn_class':'--leNord --barHeading --blueDark'} %}
  14.         <div class="barHeading --leNord --blueDark">
  15.             <h1>{{ politique.titre }}</h1>
  16.         </div>
  17.         {% if politique.sommaireAffiche == 1 %}
  18.             <div class="barInternalLinks --leNord" data-sticky data-submenu-target="contentContainer">
  19.                 <nav>
  20.                     <ul></ul>
  21.                 </nav>
  22.             </div>
  23.         {% endif %}
  24.         <article>
  25.             <div class="containerSm containerPostDetails --nordServices mBMd">
  26.                 <div class="containerContent --nordServices" id="contentContainer">
  27.                     <p class="__intro">{{ politique.chapo|raw }}</p>
  28.                     <div class="wrapperSectionsBackground {% if politique.chapo|length > 0 %}--hasIntro{% endif %}">
  29.                         {{ content_post|raw }}
  30.                     </div>
  31.                 </div>
  32.             </div>
  33.         </article>
  34.         {% for elu in politique.contacts %}
  35.             {% include 'Lenord/Main/parts/banner-contact.html.twig' with {'data':elu} %}
  36.         {% endfor %}
  37.         {% if slug|default and slug is same as('relais-paralympique') %}
  38.             <div class="sectionOlympicFlame --blue">
  39.                 <div class="container sectionOlympicFlame__containerHeading">
  40.                     <h2>Valenciennes, ville étape</h2>
  41.                     <p>
  42.                         LOREM IPSUM
  43.                     </p>
  44.                 </div>
  45.                 <div class="container">
  46.                     <ul class="gridPlaces">
  47.                         <a href="{{ path('lenord_page_legale', {'slug': 'avesnes-relais-olympique'}) }}">
  48.                             <div>
  49.                                 <img src="{{ asset('/olympique/Avesnes.png') }}" alt="">
  50.                             </div>
  51.                             <div>
  52.                                 <span>Valenciennes</span>
  53.                                 <span></span>
  54.                             </div>
  55.                         </a>
  56.                     </li>
  57.                 </ul>
  58.             </div>
  59.         </div>
  60.         <div class="sectionOlympicFlame">
  61.             <div class="container sectionOlympicFlame__containerHeading">
  62.                 <h2>Demandez le programme !</h2>
  63.                 <p>
  64.                     Le 2 juillet, les six arrondissements du département rayonneront à la lumière de la Flamme Olympique. Sur
  65.                                                                                                 notre carte interactive, découvrez la ville accueillant le Relais la plus proche de chez vous.
  66.                                                                                                 Prochainement, retrouvez les horaires de passage et rues empruntées par les Porteurs de la Flamme ainsi que
  67.                                                                                                 le programme des festivités dans chaque commune.
  69.                 </p>
  70.             </div>
  71.             <div class="container">
  72.                 <iframe title="Relais de la Flamme 2024" width="100%" height="600px" src="https://livemap.getwemap.com/dom.html?emmid=25263" frameborder="0" style="max-width:100%" allowfullscreen allowtransparency allow="geolocation; camera; accelerometer; gyroscope; magnetometer; fullscreen"></iframe>
  73.             </div>
  74.         </div>
  75.         <div class="sectionOlympicFlame --blue">
  76.             <div class="container sectionOlympicFlame__containerHeading">
  77.                 <h2>Ils feront briller le Nord !</h2>
  78.                 <p>
  79.                     Femmes et hommes, sportifs de haut niveau ou amateurs, acteurs de la vie économique, associative et
  80.                                                                                                 citoyenne : les Porteurs de la Flamme feront monter la ferveur à l’aube des Jeux. Personnalités publiques ou
  81.                                                                                                 inconnus aux histoires extraordinaires : découvrez le portrait des acteurs nordistes du Relais de la Flamme
  82.                                                                                                 Olympique.
  83.                 </p>
  84.             </div>
  85.             <div class="container p-0">
  86.                 <div class="wrapperSwiperHomepagePersons">
  87.                     <div class="swiper swiperHomepagePersons">
  88.                         <div class="swiper-wrapper">
  89.                             <div class="swiper-slide">
  90.                                 <a href="https://info.lenord.fr/carima-louami--porter-la-flamme-cest-pour-moi-boucler-la-boucle-">
  91.                                     <div>
  92.                                         <img src="{{ asset('/olympique/Carima_Louami.png') }}" alt="">
  93.                                     </div>
  94.                                     <div>
  95.                                         <span>Carima Louami : « porter la flamme, c'est pour moi boucler la boucle ! »</span>
  96.                                         {{ source('svg/icons/icon-external.svg') }}
  97.                                     </div>
  98.                                 </a>
  99.                             </div>
  100.                             <div class="swiper-slide">
  101.                                 <a href="https://info.lenord.fr/serge-leroy--en-portant-la-flamme-je-vais-participer-a-un-grand-moment-de-sport">
  102.                                     <div>
  103.                                         <img src="{{ asset('/olympique/Serge_Leroy.png') }}" alt="">
  104.                                     </div>
  105.                                     <div>
  106.                                         <span>Serge Leroy : « En portant la flamme, je vais participer à un grand moment de sport »</span>
  107.                                         {{ source('svg/icons/icon-external.svg') }}
  108.                                     </div>
  109.                                 </a>
  110.                             </div>
  111.                             <div class="swiper-slide">
  112.                                 <a href="https://info.lenord.fr/relais-de-la-flamme--mettre-en-lumiere-une-discipline-historique-pour-richard-chelmowski">
  113.                                     <div>
  114.                                         <img src="{{ asset('/olympique/Richard_Chelmoski.png') }}" alt="">
  115.                                     </div>
  116.                                     <div>
  117.                                         <span>Richard Chelmowski : « relayer la flamme, c'est mettre en lumière une discipline historique »</span>
  118.                                         {{ source('svg/icons/icon-external.svg') }}
  119.                                     </div>
  120.                                 </a>
  121.                             </div>
  122.                             <div class="swiper-slide">
  123.                                 <a href="https://info.lenord.fr/victor-mahon--tous-ensemble-pour-porter-la-flamme-">
  124.                                     <div>
  125.                                         <img src="{{ asset('/olympique/Victor_Mahon.png') }}" alt="">
  126.                                     </div>
  127.                                     <div>
  128.                                         <span>Victor Mahon : « Tous ensemble pour porter la flamme ! »</span>
  129.                                         {{ source('svg/icons/icon-external.svg') }}
  130.                                     </div>
  131.                                 </a>
  132.                             </div>
  133.                             {#<div class="swiper-slide">
  134.                                                                                                                                       <a href="https://info.lenord.fr/victor-mahon--tous-ensemble-pour-porter-la-flamme-">
  135.                                                                                                                                         <div>
  136.                                                                                                                                           <img src="{{ asset('/olympique/Relayeur4.png') }}" alt="">
  137.                                                                                                                                         </div>
  138.                                                                                                                                         <div>
  139.                                                                                                                                           <span>Victor Mahon : "Tous ensemble pour porter la flamme !«</span>
  140.                                                                                                                                           {{ source('svg/icons/icon-external.svg') }}
  141.                                                                                                                                         </div>
  142.                                                                                                                                       </a>
  143.                                                                                                                                     </div>
  144.                                                                                                                                     <div class="swiper-slide">
  145.                                                                                                                                       <a href="https://info.lenord.fr/victor-mahon--tous-ensemble-pour-porter-la-flamme-">
  146.                                                                                                                                         <div>
  147.                                                                                                                                           <img src="{{ asset('/olympique/Relayeur4.png') }}" alt="">
  148.                                                                                                                                         </div>
  149.                                                                                                                                         <div>
  150.                                                                                                                                           <span>Victor Mahon : "Tous ensemble pour porter la flamme !«</span>
  151.                                                                                                                                           {{ source('svg/icons/icon-external.svg') }}
  152.                                                                                                                                         </div>
  153.                                                                                                                                       </a>
  154.                                                                                                                                     </div>#}
  155.                         </div>
  156.                         <button class="swiper-button-prev"></button>
  157.                         <button class="swiper-button-next"></button>
  158.                     </div>
  159.                 </div>
  160.             </div>
  161.         </div>
  162.         <div class="containerGridPosts --nordInfo">
  163.             <div class="container">
  164.                 <h2 class="headingSection --white mTMd--imp mBMd--imp">L'actualité du Relais de la Flamme</h2>
  165.                 <ul class="gridPosts">
  166.                     <li class="__col">
  167.                         <a href="https://info.lenord.fr/participez-a-la-grande-collecte-des-archives-du-sport" class="itemPost --nordInfo --video" title="Participez à la Grande collecte des archives du sport" target="_blank">
  168.                             <div class="__img">
  169.                                 <img src="{{ asset('/olympique/Actu01.jpg') }}" alt="">
  170.                             {# <span class="__icon-play">{{ source('svg/icons/icon-play.svg') }}</span> #}
  171.                                 {# <span class="__duration">03:01</span> #}
  172.                             </div>
  173.                             <p class="__title">
  174.                                 <span>Participez à la Grande collecte des archives du sport</span>
  175.                             </p>
  176.                         </a>
  177.                     </li>
  178.                     <li class="__col">
  179.                         <a href="https://info.lenord.fr/paris-2024--ils-porteront-la-flamme-dans-le-nord-avec-le-departement-" class="itemPost --nordInfo --video" title="Paris 2024 : ils porteront la flamme dans le Nord avec le Département !" target="_blank">
  180.                             <div class="__img">
  181.                                 <img src="{{ asset('/olympique/Actu02.jpg') }}" alt="">
  182.                             {# <span class="__icon-play">{{ source('svg/icons/icon-play.svg') }}</span> #}
  183.                                 {# <span class="__duration">03:01</span> #}
  184.                             </div>
  185.                             <p class="__title">
  186.                                 <span>Paris 2024 : ils porteront la flamme dans le Nord avec le Département !</span>
  187.                             </p>
  188.                         </a>
  189.                     </li>
  190.                     <li class="__col">
  191.                         <a href="https://info.lenord.fr/passage-de-la-flamme-de-paris-2024-j-200" class="itemPost --nordInfo --video" title="J-200 pour le Relais de la Flamme Paris 2024" target="_blank">
  192.                             <div class="__img">
  193.                                 <img src="{{ asset('/olympique/Actu03.png') }}" alt="">
  194.                             {# <span class="__icon-play">{{ source('svg/icons/icon-play.svg') }}</span> #}
  195.                                 {# <span class="__duration">03:01</span> #}
  196.                             </div>
  197.                             <p class="__title">
  198.                                 <span>J-200 pour le Relais de la Flamme Paris 2024</span>
  199.                             </p>
  200.                         </a>
  201.                     </li>
  202.                     <li class="__col">
  203.                         <a target="_blank" href="https://info.lenord.fr" class="__btnLoadMore" title="Toute l'info">
  204.                             <div class="__inner">
  205.                                 <div>
  206.                                     <div>{{ source('svg/icons/icon-plus.svg') }}</div>
  207.                                     <div>
  208.                                         <p>
  209.                                             <span class="__text">Toute l'info</span>&nbsp;<span class="__icon-external">{{ source('svg/icons/icon-external.svg') }}</span>
  210.                                         </p>
  211.                                     </div>
  212.                                 </div>
  213.                             </div>
  214.                         </a>
  215.                     </li>
  216.                 </ul>
  217.             </div>
  218.         </div>
  219.         {#<div class="sectionOlympicFlame --dark">
  220.                                             <div class="container sectionOlympicFlame__containerHeading">
  221.                                               <h2>L’agenda du Relais de la Flamme</h2>
  222.                                             </div>
  223.                                             <div class="container containerGridAgenda">
  224.                                               <div>
  225.                                                 {% for i in range(1, 4) %}
  226.                                                   <div>
  227.                                                     <a href="#" target="_blank">
  228.                                                       <div>
  229.                                                         <div>
  230.                                                           <img src="{{ asset('img/demo/header_banner.jpg') }}" alt="">
  231.                                                         </div>
  232.                                                       </div>
  233.                                                       <div>
  234.                                                         <div>
  235.                                                           <span>Titre de l'événement lorem ipsum dolor sit amet</span>
  236.                                                           {{ source('svg/icons/icon-external.svg') }}
  237.                                                         </div>
  238.                                                         <div>Le 0 mois 2023</div>
  239.                                                         <div>LIEU DE L'ÉVÉNEMENT <span>|</span> VILLE</div>
  240.                                                       </div>
  241.                                                     </a>
  242.                                                   </div>
  243.                                                 {% endfor %}
  244.                                               </div>
  245.                                               <div class="mt-6">
  246.                                                 <a target="_blank" href="https://info.lenord.fr/agenda" class="btnLoadMore"
  247.                                                    title="Toute l'info">
  248.                                                   <div class="__inner">
  249.                                                     <div>
  250.                                                       <div>{{ source('svg/icons/icon-plus.svg') }}</div>
  251.                                                       <div><p><span class="__text">TOUT L'AGENDA</span>&nbsp;<span
  252.                                                             class="__icon-external">{{ source('svg/icons/icon-external.svg') }}</span></p></div>
  253.                                                     </div>
  254.                                                   </div>
  255.                                                 </a>
  256.                                               </div>
  257.                                             </div>
  258.                                           </div>#}
  259.         <div class="sectionOlympicFlame --blue">
  260.             <div class="container sectionOlympicFlame__containerHeading">
  261.                 <h2>Les Jeux, c’est aussi dans le Nord !</h2>
  262.                 <p>
  263.                     Le Nord est une terre d’accueil de grands événements sportifs. Du 27 juillet au 11 août, 52 rencontres de
  264.                                                                                                 basket-ball et de handball se dérouleront au stade Pierre Mauroy à Villeneuve d’Ascq. Dans tout le
  265.                                                                                                 département, 34 Centres de Préparation aux Jeux offrent aux délégations sportives internationales les
  266.                                                                                                 conditions optimales pour s’entraîner et réaliser des Jeux au sommet.
  267.                 </p>
  268.             </div>
  269.             <div class="container containerGridNorth">
  270.                 <div class="flex flex-wrap -m-3 justify-center">
  271.                     {#            <div#}
  272.                     {#              class="flex-[100%] max-w-[100%] p-3 md:flex-[50%] md:max-w-[50%] lg:flex-[33.33333333%] lg:max-w-[33.33333333%]">#}
  273.                     {#              <a href="https://www.lillemetropole.fr/decathlon-arena-stade-pierre-mauroy"#}
  274.                     {#                 class="group bg-white flex justify-center items-center shadow-lg rounded-2xl aspect-video transition-shadow duration-300 hover:shadow-md hover:text-[var(--color-text)]">#}
  275.                     {#                <div>#}
  276.                     {#                  <div class="flex justify-center items-center mb-4">#}
  277.                     {#                    <img src="" class="w-16 h-16" alt="">#}
  278.                     {#                  </div>#}
  279.                     {#                  <div class="text-center">#}
  280.                     {#                    <span#}
  281.                     {#                      class="font-medium duration-300 transition-colors underline decoration-[rgba(23,50,63,0)] group-hover:decoration-[rgba(23,50,63,1)]">Le site de compétition</span>#}
  282.                     {#                    <span#}
  283.                     {#                      class="[&>svg]:inline [&>svg]:w-3.5 [&>svg]:h-3.5 [&>svg]:mb-1 [&>svg]:ml-1">{{ source('svg/icons/icon-external.svg') }}</span>#}
  284.                     {#                  </div>#}
  285.                     {#                </div>#}
  286.                     {#              </a>#}
  287.                     {#            </div>#}
  288.                     {#            <div#}
  289.                     {#              class="flex-[100%] max-w-[100%] p-3 md:flex-[50%] md:max-w-[50%] lg:flex-[33.33333333%] lg:max-w-[33.33333333%]">#}
  290.                     {#              <a href="https://www.paris2024.org/fr/centre-preparation-jeux/"#}
  291.                     {#                 class="group bg-white flex justify-center items-center shadow-lg rounded-2xl aspect-video transition-shadow duration-300 hover:shadow-md hover:text-[var(--color-text)]">#}
  292.                     {#                <div>#}
  293.                     {#                  <div class="flex justify-center items-center mb-4">#}
  294.                     {#                    <img src="" class="w-16 h-16" alt="">#}
  295.                     {#                  </div>#}
  296.                     {#                  <div class="text-center">#}
  297.                     {#                    <span#}
  298.                     {#                      class="font-medium duration-300 transition-colors underline decoration-[rgba(23,50,63,0)] group-hover:decoration-[rgba(23,50,63,1)]">Les Centres de Préparation aux Jeux</span>#}
  299.                     {#                    <span#}
  300.                     {#                      class="[&>svg]:inline [&>svg]:w-3.5 [&>svg]:h-3.5 [&>svg]:mb-1 [&>svg]:ml-1">{{ source('svg/icons/icon-external.svg') }}</span>#}
  301.                     {#                  </div>#}
  302.                     {#                </div>#}
  303.                     {#              </a>#}
  304.                     {#            </div>#}
  305.                         <div>
  306.                             <a href="https://www.lillemetropole.fr/decathlon-arena-stade-pierre-mauroy"> <div>
  307.                                 <div>
  308.                                     <img src="{{ asset('/olympique/site_competition.png') }}" alt="">
  309.                                 </div>
  310.                                 <div>
  311.                                     <span>Le site de compétition</span>
  312.                                     <span>{{ source('svg/icons/icon-external.svg') }}</span>
  313.                                 </div>
  314.                             </div>
  315.                         </a>
  316.                     </div>
  317.                     <div>
  318.                         <a href="https://www.paris2024.org/fr/centre-preparation-jeux/">
  319.                             <div>
  320.                                 <div>
  321.                                     <img src="{{ asset('/olympique/centres_jeux.png') }}" alt="">
  322.                                 </div>
  323.                                 <div>
  324.                                     <span>Les Centres de Préparation aux Jeux</span>
  325.                                     <span>{{ source('svg/icons/icon-external.svg') }}</span>
  326.                                 </div>
  327.                             </div>
  328.                         </a>
  329.                     </div>
  330.                 </div>
  331.             </div>
  332.         </div>
  333.     {% elseif slug|default and slug is same as('relais') %}
  334.         {#<div class="sectionOlympicFlame --blue">
  335.                             <div class="container sectionOlympicFlame__containerHeading">
  336.                                 <h2>Vivez le Nord à la lumière de la Flamme !</h2>
  337.                                 <p>
  338.                                     De la digue de Malo-les-Bains à la célèbre Trouée d’Arenberg en passant par la Grand’Place de Lille, le
  339.                                                                         Relais de la Flamme constitue une occasion unique de mettre en lumière le patrimoine du département.
  340.                                                                         Découvrez, en vidéo, les sites emblématiques situés sur le parcours du Relais de la Flamme dans les sept
  341.                                                                         villes nordistes traversées.
  342.                                 </p>
  343.                             </div>
  344.                             <div class="container">
  345.                                 <ul class="gridPlaces">
  346.                                     <li>
  347.                                         <a
  348.                                             href="https://youtu.be/u4KTO6kS9oc">
  349.                                             <!-- {{ path('lenord_page_legale', {'slug': 'dunkerque-relais-olympique'}) }} -->
  350.                                             <div>
  351.                                                 <img src="{{ asset('/olympique/Dunkerque.png') }}" alt="">
  352.                                             </div>
  353.                                             <div>
  354.                                                 <span>Dunkerque</span>
  355.                                                 <span>{{ source('svg/icons/icon-external.svg') }}</span>
  356.                                             </div>
  357.                                         </a>
  358.                                     </li>
  359.                                     <li>
  360.                                         <a
  361.                                             href="https://youtu.be/kFMFchBP_uk">
  362.                                             <!--{{ path('lenord_page_legale', {'slug': 'tourcoing-relais-olympique'}) }}-->
  363.                                             <div>
  364.                                                 <img src="{{ asset('/olympique/Tourcoing.png') }}" alt="">
  365.                                             </div>
  366.                                             <div>
  367.                                                 <span>Tourcoing</span>
  368.                                                 <span>{{ source('svg/icons/icon-external.svg') }}</span>
  369.                                             </div>
  370.                                         </a>
  371.                                     </li>
  372.                                     <li>
  373.                                         <a
  374.                                             href="https://youtu.be/qQGExDuVglg">
  375.                                             <!--{{ path('lenord_page_legale', {'slug': 'lille-relais-olympique'}) }}-->
  376.                                             <div>
  377.                                                 <img src="{{ asset('/olympique/Lille.png') }}" alt="">
  378.                                             </div>
  379.                                             <div>
  380.                                                 <span>Lille</span>
  381.                                                 <span>{{ source('svg/icons/icon-external.svg') }}</span>
  382.                                             </div>
  383.                                         </a>
  384.                                     </li>
  385.                                     <li>
  386.                                         <a
  387.                                             href="https://youtu.be/l3ON60JtK2M">
  388.                                             <!--{{ path('lenord_page_legale', {'slug': 'wallers-arember-relais-olympique'}) }}-->
  389.                                             <div>
  390.                                                 <img src="{{ asset('/olympique/Wallers.png') }}" alt="">
  391.                                             </div>
  392.                                             <div>
  393.                                                 <span>Wallers-Arenberg</span>
  394.                                                 <span>{{ source('svg/icons/icon-external.svg') }}</span>
  395.                                             </div>
  396.                                         </a>
  397.                                     </li>
  398.                                     <li>
  399.                                         <a
  400.                                             href="https://youtu.be/X8ZNFf9qNGk">
  401.                                             <!--{{ path('lenord_page_legale', {'slug': 'douai-relais-olympique'}) }}-->
  402.                                             <div>
  403.                                                 <img src="{{ asset('/olympique/Douai.png') }}" alt="">
  404.                                             </div>
  405.                                             <div>
  406.                                                 <span>Douai</span>
  407.                                                 <span>{{ source('svg/icons/icon-external.svg') }}</span>
  408.                                             </div>
  409.                                         </a>
  410.                                     </li>
  411.                                     <li>
  412.                                         <a
  413.                                             href="https://youtu.be/-UvMJrdknrk">
  414.                                             <!--{{ path('lenord_page_legale', {'slug': 'cambrai-relais-olympique'}) }}-->
  415.                                             <div>
  416.                                                 <img src="{{ asset('/olympique/Cambrai.png') }}" alt="">
  417.                                             </div>
  418.                                             <div>
  419.                                                 <span>Cambrai</span>
  420.                                                 <span>{{ source('svg/icons/icon-external.svg') }}</span>
  421.                                             </div>
  422.                                         </a>
  423.                                     </li>
  424.                                     <li>
  425.                                         <a
  426.                                             href="https://youtu.be/gVPe2AzoZ0k">
  427.                                             <!--{{ path('lenord_page_legale', {'slug': 'avesnes-relais-olympique'}) }}-->
  428.                                             <div>
  429.                                                 <img src="{{ asset('/olympique/Avesnes.png') }}" alt="">
  430.                                             </div>
  431.                                             <div>
  432.                                                 <span>Avesnes-sur-Helpe</span>
  433.                                                 <span>{{ source('svg/icons/icon-external.svg') }}</span>
  434.                                             </div>
  435.                                         </a>
  436.                                     </li>
  437.                                 </ul>
  438.                             </div>
  439.                         </div>#}
  440.         <div class="sectionOlympicFlame">
  441.             <div class="container sectionOlympicFlame__containerHeading">
  442.                 <h2>Demandez le programme !</h2>
  443.                 
  444.             </div>
  445.             <div class="container">
  446.                 <iframe title="Relais de la Flamme 2024 Para" 
  447.         width="100%" 
  448.         height="500px" 
  449.         src="https://livemap.getwemap.com/dom.html?emmid=28021&token=3GU8S4LI8EBXP87HGQBYBC21Z" 
  450.         frameborder="0" 
  451.         style="max-width:100%" 
  452.         allowfullscreen 
  453.         allowtransparency 
  454.         allow="geolocation; camera; accelerometer; gyroscope; magnetometer; fullscreen">
  455. </iframe>
  456.             </div>
  457.         </div>
  458.         <div class="sectionOlympicFlame --blue">
  459.             <div class="container sectionOlympicFlame__containerHeading">
  460.                 <h2>Ils font briller le Nord !</h2>
  461.                 <p>
  462.                     Femmes et hommes, sportifs de haut niveau ou amateurs, acteurs de la vie économique, associative et
  463.                                                                                                 citoyenne : les Porteurs de la Flamme font monter la ferveur à l’aube des Jeux. Personnalités publiques ou
  464.                                                                                                 inconnus aux histoires extraordinaires : découvrez le portrait des acteurs nordistes des Relais de la Flamme.
  465.                 </p>
  466.             </div>
  467.             <div class="container p-0">
  468.                 <div class="wrapperSwiperHomepagePersons">
  469.                     <div class="swiper swiperHomepagePersons">
  470.                         <div class="swiper-wrapper">
  471.                             <div class="swiper-slide">
  472.                                 <a href="https://info.lenord.fr/en-portant-la-flamme-la-marathonienne-roselyne-leleu-releve-un-nouveau-defi">
  473.                                     <div>
  474.                                         <img src="{{ asset('/olympique/66c5b957f3324_Roselyne-Leleu.png') }}" alt="">
  475.                                     </div>
  476.                                     <div>
  477.                                         <span>Roselyne Leleu : relever un nouveau défi</span>
  478.                                         {{ source('svg/icons/icon-external.svg') }}
  479.                                     </div>
  480.                                 </a>
  481.                             </div>
  482.                             <div class="swiper-slide">
  483.                                 <a href="https://info.lenord.fr/le-rappeur-ilyass-belhadri-va-vibrer-pour-la-flamme-paralympique">
  484.                                     <div>
  485.                                         <img src="{{ asset('/olympique/66c5b957f2a8f_Rappeur.png') }}" alt="">
  486.                                     </div>
  487.                                     <div>
  488.                                         <span>Le rappeur Ilyass Belhadri va vibrer pour la flamme paralympique</span>
  489.                                         {{ source('svg/icons/icon-external.svg') }}
  490.                                     </div>
  491.                                 </a>
  492.                             </div>
  493.                             <div class="swiper-slide">
  494.                                 <a href="https://info.lenord.fr/brigitte-drumez--une-vie-au-service-des-autres-via-le-sport">
  495.                                     <div>
  496.                                         <img src="{{ asset('/olympique/Brigitte_DRUMEZ.png') }}" alt="">
  497.                                     </div>
  498.                                     <div>
  499.                                         <span>Brigitte Drumez : une vie au service des autres via le sport</span>
  500.                                         {{ source('svg/icons/icon-external.svg') }}
  501.                                     </div>
  502.                                 </a>
  503.                             </div>
  504.                             <div class="swiper-slide">
  505.                                 <a href="https://info.lenord.fr/miss-france--porter-la-flamme-dans-le-nord-cest-du-bonheur-a-letat-pur-">
  506.                                     <div>
  507.                                         <img src="{{ asset('/olympique/667d060185fa9_MISSFRANCE.png') }}" alt="">
  508.                                     </div>
  509.                                     <div>
  510.                                         <span>Miss France : "porter la flamme dans le Nord, c'est du bonheur à l'état pur !</span>
  511.                                         {{ source('svg/icons/icon-external.svg') }}
  512.                                     </div>
  513.                                 </a>
  514.                             </div>
  515.                             <div class="swiper-slide">
  516.                                 <a href="https://www.youtube.com/watch?v=fVwehzuA2ow">
  517.                                     <div>
  518.                                         <img src="{{ asset('/olympique/667d0601867a9_DANYBOON.png') }}" alt="">
  519.                                     </div>
  520.                                     <div>
  521.                                         <span>Dany Boon, l’enfant du pays portera la flamme !</span>
  522.                                         {{ source('svg/icons/icon-external.svg') }}
  523.                                     </div>
  524.                                 </a>
  525.                             </div>
  526.                             <div class="swiper-slide">
  527.                                 <a href="https://info.lenord.fr/flamme-olympique--le-rugby-feminin-a-lhonneur-avec-laura-di-muzio">
  528.                                     <div>
  529.                                         <img src="{{ asset('/olympique/667e6d2b26131_vignette Nord info P2024 - Laura Di Muzio.png') }}" alt="">
  530.                                     </div>
  531.                                     <div>
  532.                                         <span>Flamme olympique : le rugby féminin à l'honneur avec Laura Di Muzio</span>
  533.                                         {{ source('svg/icons/icon-external.svg') }}
  534.                                     </div>
  535.                                 </a>
  536.                             </div>
  537.                             <div class="swiper-slide">
  538.                                 <a href="https://info.lenord.fr/gaetan-hubaud-l-inclusion-par-le-sport">
  539.                                     <div>
  540.                                         <img src="{{ asset('/olympique/vignette_-_Gaetan_Huband.jpg') }}" alt="">
  541.                                     </div>
  542.                                     <div>
  543.                                         <span>Gaëtan Hubaud, l’inclusion par le sport</span>
  544.                                         {{ source('svg/icons/icon-external.svg') }}
  545.                                     </div>
  546.                                 </a>
  547.                             </div>
  548.                             <div class="swiper-slide">
  549.                                 <a href="https://info.lenord.fr/daouda-sow--en-termes-d-emotion-le-2-juillet-ca-va-vibrer-en-moi">
  550.                                     <div>
  551.                                         <img src="{{ asset('/olympique/vignette_-_Daouda_Sow.jpg') }}" alt="">
  552.                                     </div>
  553.                                     <div>
  554.                                         <span>Daouda Sow : "En termes d’émotion, le 2 juillet, ça va vibrer en moi"</span>
  555.                                         {{ source('svg/icons/icon-external.svg') }}
  556.                                     </div>
  557.                                 </a>
  558.                             </div>
  559.                             <div class="swiper-slide">
  560.                                 <a href="https://info.lenord.fr/melanie-laisne-relayeuse-un-jour-handballeuse-toujours">
  561.                                     <div>
  562.                                         <img src="{{ asset('/olympique/MelanieLaisne.png') }}" alt="">
  563.                                     </div>
  564.                                     <div>
  565.                                         <span>Mélanie Laisne, relayeuse un jour, handballeuse toujours</span>
  566.                                         {{ source('svg/icons/icon-external.svg') }}
  567.                                     </div>
  568.                                 </a>
  569.                             </div>
  570.                             <div class="swiper-slide">
  571.                                 <a href="https://info.lenord.fr/mohamed-atsamnia--porteur-de-flamme-pour-l-amour-du-sport">
  572.                                     <div>
  573.                                         <img src="{{ asset('/olympique/Mohamed_ATSAMNIA.png') }}" alt="">
  574.                                     </div>
  575.                                     <div>
  576.                                         <span>Mohamed Atsamnia, pour l'amour du sport</span>
  577.                                         {{ source('svg/icons/icon-external.svg') }}
  578.                                     </div>
  579.                                 </a>
  580.                             </div>
  581.                             <div class="swiper-slide">
  582.                                 <a href="https://info.lenord.fr/segolene-lefebvre-championne-du-monde-de-boxe-portera-la-flamme-dans-le-nord">
  583.                                     <div>
  584.                                         <img src="{{ asset('/olympique/Segolene_Lefebvre.png') }}" alt="">
  585.                                     </div>
  586.                                     <div>
  587.                                         <span>Ségolène Lefebvre, championne du monde de boxe, portera la flamme dans le Nord</span>
  588.                                         {{ source('svg/icons/icon-external.svg') }}
  589.                                     </div>
  590.                                 </a>
  591.                             </div>
  593.                             <div class="swiper-slide">
  594.                                 <a href="https://info.lenord.fr/jean-pierre-guilbert--porter-la-flamme-cest-comme-decrocher-une-medaille-dor-aux-jo">
  595.                                     <div>
  596.                                         <img src="{{ asset('/olympique/Jean-Pierre_Guilbert.png') }}" alt="">
  597.                                     </div>
  598.                                     <div>
  599.                                         <span>Jean-Pierre Guilbert : "porter la flamme, c'est comme décrocher une médaille d'or aux JO"</span>
  600.                                         {{ source('svg/icons/icon-external.svg') }}
  601.                                     </div>
  602.                                 </a>
  603.                             </div>
  604.                             <div class="swiper-slide">
  605.                                 <a href="https://info.lenord.fr/carima-louami--porter-la-flamme-cest-pour-moi-boucler-la-boucle-">
  606.                                     <div>
  607.                                         <img src="{{ asset('/olympique/Carima_Louami.png') }}" alt="">
  608.                                     </div>
  609.                                     <div>
  610.                                         <span>Carima Louami : « porter la flamme, c'est pour moi boucler la boucle ! »</span>
  611.                                         {{ source('svg/icons/icon-external.svg') }}
  612.                                     </div>
  613.                                 </a>
  614.                             </div>
  615.                             <div class="swiper-slide">
  616.                                 <a href="https://info.lenord.fr/serge-leroy--en-portant-la-flamme-je-vais-participer-a-un-grand-moment-de-sport">
  617.                                     <div>
  618.                                         <img src="{{ asset('/olympique/Serge_Leroy.png') }}" alt="">
  619.                                     </div>
  620.                                     <div>
  621.                                         <span>Serge Leroy : « En portant la flamme, je vais participer à un grand moment de sport »</span>
  622.                                         {{ source('svg/icons/icon-external.svg') }}
  623.                                     </div>
  624.                                 </a>
  625.                             </div>
  626.                             <div class="swiper-slide">
  627.                                 <a href="https://info.lenord.fr/relais-de-la-flamme--mettre-en-lumiere-une-discipline-historique-pour-richard-chelmowski">
  628.                                     <div>
  629.                                         <img src="{{ asset('/olympique/Richard_Chelmoski.png') }}" alt="">
  630.                                     </div>
  631.                                     <div>
  632.                                         <span>Richard Chelmowski : « relayer la flamme, c'est mettre en lumière une discipline historique »</span>
  633.                                         {{ source('svg/icons/icon-external.svg') }}
  634.                                     </div>
  635.                                 </a>
  636.                             </div>
  637.                             <div class="swiper-slide">
  638.                                 <a href="https://info.lenord.fr/victor-mahon--tous-ensemble-pour-porter-la-flamme-">
  639.                                     <div>
  640.                                         <img src="{{ asset('/olympique/Victor_Mahon.png') }}" alt="">
  641.                                     </div>
  642.                                     <div>
  643.                                         <span>Victor Mahon : « Tous ensemble pour porter la flamme ! »</span>
  644.                                         {{ source('svg/icons/icon-external.svg') }}
  645.                                     </div>
  646.                                 </a>
  647.                             </div>
  648.                             {#<div class="swiper-slide">
  649.                                                                                                                                       <a href="https://info.lenord.fr/victor-mahon--tous-ensemble-pour-porter-la-flamme-">
  650.                                                                                                                                         <div>
  651.                                                                                                                                           <img src="{{ asset('/olympique/Relayeur4.png') }}" alt="">
  652.                                                                                                                                         </div>
  653.                                                                                                                                         <div>
  654.                                                                                                                                           <span>Victor Mahon : "Tous ensemble pour porter la flamme !«</span>
  655.                                                                                                                                           {{ source('svg/icons/icon-external.svg') }}
  656.                                                                                                                                         </div>
  657.                                                                                                                                       </a>
  658.                                                                                                                                     </div>
  659.                                                                                                                                     <div class="swiper-slide">
  660.                                                                                                                                       <a href="https://info.lenord.fr/victor-mahon--tous-ensemble-pour-porter-la-flamme-">
  661.                                                                                                                                         <div>
  662.                                                                                                                                           <img src="{{ asset('/olympique/Relayeur4.png') }}" alt="">
  663.                                                                                                                                         </div>
  664.                                                                                                                                         <div>
  665.                                                                                                                                           <span>Victor Mahon : "Tous ensemble pour porter la flamme !«</span>
  666.                                                                                                                                           {{ source('svg/icons/icon-external.svg') }}
  667.                                                                                                                                         </div>
  668.                                                                                                                                       </a>
  669.                                                                                                                                     </div>#}
  670.                         </div>
  671.                         <button class="swiper-button-prev"></button>
  672.                         <button class="swiper-button-next"></button>
  673.                     </div>
  674.                 </div>
  675.             </div>
  676.         </div>
  677.         <div class="containerGridPosts --nordInfo">
  678.             <div class="container">
  679.                 <h2 class="headingSection --white mTMd--imp mBMd--imp">L'actualité du Relais de la Flamme</h2>
  680.                 <ul class="gridPosts">
  681.                     <li class="__col">
  682.                         <a href="https://info.lenord.fr/video-relais-de-la-flamme-paralympique--ils-feront-briller-le-nord-" class="itemPost --nordInfo --video" title="J-200 pour le Relais de la Flamme Paris 2024" target="_blank">
  683.                             <div class="__img">
  684.                                 <img src="{{ asset('/olympique/66c5ba27d176e_NI1.png') }}" alt="">
  685.                             {# <span class="__icon-play">{{ source('svg/icons/icon-play.svg') }}</span> #}
  686.                                 {# <span class="__duration">03:01</span> #}
  687.                             </div>
  688.                             <p class="__title">
  689.                                 <span>Relais de la Flamme Paralympique : ils feront briller le Nord !</span>
  690.                             </p>
  691.                         </a>
  692.                     </li>
  693.                     <li class="__col">
  694.                         <a href="https://info.lenord.fr/tout-ce-quil-faut-savoir-sur-la-flamme-paralympique" class="itemPost --nordInfo --video" title="J-200 pour le Relais de la Flamme Paris 2024" target="_blank">
  695.                             <div class="__img">
  696.                                 <img src="{{ asset('/olympique/66c5ba27d1fcd_NI2.png') }}" alt="">
  697.                             {# <span class="__icon-play">{{ source('svg/icons/icon-play.svg') }}</span> #}
  698.                                 {# <span class="__duration">03:01</span> #}
  699.                             </div>
  700.                             <p class="__title">
  701.                                 <span>Tout ce qu'il faut savoir sur la flamme paralympique</span>
  702.                             </p>
  703.                         </a>
  704.                     </li>
  705.                     <li class="__col">
  706.                         <a href="https://www.youtube.com/watch?v=iNo14eq4jLg" class="itemPost --nordInfo --video" title="J-200 pour le Relais de la Flamme Paris 2024" target="_blank">
  707.                             <div class="__img">
  708.                                 <img src="{{ asset('/olympique/nordinfo3.jpg') }}" alt="">
  709.                             {# <span class="__icon-play">{{ source('svg/icons/icon-play.svg') }}</span> #}
  710.                                 {# <span class="__duration">03:01</span> #}
  711.                             </div>
  712.                             <p class="__title">
  713.                                 <span>Flamme olympique dans le Nord : retour sur une journée historique"
  714.                                 </span>
  715.                             </p>
  716.                         </a>
  717.                     </li>
  718.                     <li class="__col">
  719.                         <a target="_blank" href="https://info.lenord.fr" class="__btnLoadMore" title="Toute l'info">
  720.                             <div class="__inner">
  721.                                 <div>
  722.                                     <div>{{ source('svg/icons/icon-plus.svg') }}</div>
  723.                                     <div>
  724.                                         <p>
  725.                                             <span class="__text">Toute l'info</span>&nbsp;<span class="__icon-external">{{ source('svg/icons/icon-external.svg') }}</span>
  726.                                         </p>
  727.                                     </div>
  728.                                 </div>
  729.                             </div>
  730.                         </a>
  731.                     </li>
  732.                 </ul>
  733.             </div>
  734.         </div>
  735.         {#<div class="sectionOlympicFlame --dark">
  736.                                             <div class="container sectionOlympicFlame__containerHeading">
  737.                                               <h2>L’agenda du Relais de la Flamme</h2>
  738.                                             </div>
  739.                                             <div class="container containerGridAgenda">
  740.                                               <div>
  741.                                                 {% for i in range(1, 4) %}
  742.                                                   <div>
  743.                                                     <a href="#" target="_blank">
  744.                                                       <div>
  745.                                                         <div>
  746.                                                           <img src="{{ asset('img/demo/header_banner.jpg') }}" alt="">
  747.                                                         </div>
  748.                                                       </div>
  749.                                                       <div>
  750.                                                         <div>
  751.                                                           <span>Titre de l'événement lorem ipsum dolor sit amet</span>
  752.                                                           {{ source('svg/icons/icon-external.svg') }}
  753.                                                         </div>
  754.                                                         <div>Le 0 mois 2023</div>
  755.                                                         <div>LIEU DE L'ÉVÉNEMENT <span>|</span> VILLE</div>
  756.                                                       </div>
  757.                                                     </a>
  758.                                                   </div>
  759.                                                 {% endfor %}
  760.                                               </div>
  761.                                               <div class="mt-6">
  762.                                                 <a target="_blank" href="https://info.lenord.fr/agenda" class="btnLoadMore"
  763.                                                    title="Toute l'info">
  764.                                                   <div class="__inner">
  765.                                                     <div>
  766.                                                       <div>{{ source('svg/icons/icon-plus.svg') }}</div>
  767.                                                       <div><p><span class="__text">TOUT L'AGENDA</span>&nbsp;<span
  768.                                                             class="__icon-external">{{ source('svg/icons/icon-external.svg') }}</span></p></div>
  769.                                                     </div>
  770.                                                   </div>
  771.                                                 </a>
  772.                                               </div>
  773.                                             </div>
  774.                                           </div>#}
  775.         {#<div class="sectionOlympicFlame --blue">
  776.                     <div class="container sectionOlympicFlame__containerHeading">
  777.                         <h2>Les Jeux, c’est aussi dans le Nord !</h2>
  778.                         <p>
  779.                             Le Nord est une terre d’accueil de grands événements sportifs. Depuis le 27 juillet et jusqu'au 11 août, 52 rencontres de
  780.                                                                                     basket-ball et de handball se déroulent au stade Pierre Mauroy à Villeneuve d’Ascq. Dans tout le
  781.                                                                                     département, 34 Centres de Préparation aux Jeux offrent aux délégations sportives internationales les
  782.                                                                                     conditions optimales pour s’entraîner et réaliser des Jeux au sommet.
  783.                         </p>
  784.                     </div>
  785.                     <div class="container containerGridNorth">
  786.                         <div class="flex flex-wrap -m-3 justify-center">
  787.                             
  788.                                 <div>
  789.                                     <a href="https://www.lillemetropole.fr/decathlon-arena-stade-pierre-mauroy"> <div>
  790.                                         <div>
  791.                                             <img src="{{ asset('/olympique/site_competition.png') }}" alt="">
  792.                                         </div>
  793.                                         <div>
  794.                                             <span>Le site de compétition</span>
  795.                                             <span>{{ source('svg/icons/icon-external.svg') }}</span>
  796.                                         </div>
  797.                                     </div>
  798.                                 </a>
  799.                             </div>
  800.                             <div>
  801.                                 <a href="https://www.paris2024.org/fr/centre-preparation-jeux/">
  802.                                     <div>
  803.                                         <div>
  804.                                             <img src="{{ asset('/olympique/centres_jeux.png') }}" alt="">
  805.                                         </div>
  806.                                         <div>
  807.                                             <span>Les Centres de Préparation aux Jeux</span>
  808.                                             <span>{{ source('svg/icons/icon-external.svg') }}</span>
  809.                                         </div>
  810.                                     </div>
  811.                                 </a>
  812.                             </div>
  813.                         </div>
  814.                     </div>
  815.                 </div>#}
  816.     {% endif %}
  817. </main>{% endblock %}{% block footer_top %}
  818. {% if is_preview != 1 %}
  819.     <div class="container pB pT">
  820.         {% include 'Nordinfo/Main/parts/article-actions.html.twig' with {'post_title':politique.titre, 'post_id':politique.id, 'is_le_nord':true} %}
  821.     </div>
  822. {% endif %}
  823. {% if nordinfo_rss|length > 0 %}
  824.     <div class="containerGridPosts --nordInfo">
  825.         <div class="container">
  826.             <h2 class="headingSection --white mTMd--imp mBMd--imp">{{ nordinfo_rss_description }}</h2>
  827.             <ul class="gridPosts">
  828.                 {% for post in nordinfo_rss %}
  829.                     <li class="__col">
  830.                         {{ include('Lenord/Main/parts/item-post.html.twig') }}
  831.                     </li>
  832.                 {% endfor %}
  833.                 <li class="__col">
  834.                     <a href="https://info.lenord.fr" class="__btnLoadMore" title="Toute l'info">
  835.                         <div class="__inner">
  836.                             <div>
  837.                                 <div>{{ source('svg/icons/icon-plus.svg') }}</div>
  838.                                 <div>
  839.                                     <p>
  840.                                         <span class="__text">Toute l'info</span>&nbsp;<span class="__icon-external">{{ source('svg/icons/icon-external.svg') }}</span>
  841.                                     </p>
  842.                                 </div>
  843.                             </div>
  844.                         </div>
  845.                     </a>
  846.                 </li>
  847.             </ul>
  848.         </div>
  849.     </div>
  850. {% endif %}
  851. {{ include('Lenord/Main/js/submenu.js.html.twig') }}{% endblock %}