templates/front/accueil.html.twig line 1

Open in your IDE?
  1. {% extends 'base.html.twig' %}
  2. {% block style %}
  3. {% endblock %}
  4. {% block banniere %}
  5.     <section class="clearfix position-relative">
  6.         <div class="home-slide owl-carousel clearfix">
  7.         {% for slide in slides %}
  8.             <div class="item-slide">
  9.                 <div class="bg-slide ">
  10.                     <img src="{{ asset(slider_directory ~ slide.image) }}" {% if loop.index  !=  1  %} loading="lazy"  fetchPriority="low" {% else %}  fetchPriority="high" {% endif %} alt="" class="img">
  11.                 </div>
  12.                 <div class="container ">
  13.                     <div class="title">
  14.                         {{ slide.titre | raw }}
  15.                         <span></span>
  16.                     </div>
  17.                     <div class="desc">
  18.                     {{ slide.soustitre | raw }}
  19.                     </div>
  20.                     <div class="btn-slide">
  21.                         <a href="{{ slide.buttonLink }}" class="btn-2 "> {{ slide.buttonText }} </a>
  22.                     </div>
  23.                 </div>
  24.             </div>
  25.         {% endfor %}
  26.         <!--<div class="go-content">
  27.             <i class="fa fa-angle-double-down"></i>
  28.         </div>-->
  29.     </section>
  30.     <section class="mini-slide-section">
  31.         <div class="mini-slide owl-carousel" data-aos="fade-up" data-aos-delay="50" data-aos-duration="800" data-aos-easing="ease-in-out" data-aos-once="true">
  32.             <a href="/la-pedagogie.html" class="item">
  33.                 <div class="img">
  34.                     <img src="{{ asset('front/images/miniature-slide-index/miniature-notre-pegagogie.jpg') }}" loading="lazy" alt="comment se passe un cours de surf">
  35.                 </div>
  36.                 <div class="content">
  37.                     <div class="title">
  38.                         Notre <br> pédagogie
  39.                     </div>
  40.                     <div class="link">
  41.                         ➔
  42.                     </div>
  43.                 </div>
  44.                 <div class="hover-box">
  45.                     <div class="title">
  46.                         Comment se passe un cours de surf ?
  47.                     </div>
  48.                     <div class="desc">
  49.                        Notre école de surf a mis en place une façon unique pour vous permettre de découvrir ou améliorer votre surf rapidement et toujours avec du plaisir !
  50.                     </div>
  51.                     <div class="desc-2">
  52.                         En savoir plus
  53.                     </div>
  54.                 </div>
  55.             </a>
  56.             <a href="/cours-et-stages-collectifs-de-surf.html" class="item">
  57.                 <div class="img">
  58.                     <img src="{{ asset('front/images/miniature-slide-index/miniature-cours-collectifs-de-surf.jpg') }}" loading="lazy" alt="cours de surf collectif cote basque saint jean de luz">
  59.                 </div>
  60.                 <div class="content">
  61.                     <div class="title">
  62.                         cours de surf <br> collectifs
  63.                     </div>
  64.                     <div class="link">
  65.                         ➔
  66.                     </div>
  67.                 </div>
  68.                 <div class="hover-box">
  69.                     <div class="title">
  70.                         cours de surf collectifs à saint-jean-de-luz
  71.                     </div>
  72.                     <div class="desc">
  73.                         Progressez en groupe dans une ambiance conviviale et adaptée à votre niveau. Dépassez vos limites lors de stages d'un ou plusieurs jours.
  74.                     </div>
  75.                     <div class="desc-2">
  76.                         Découvrez nos tarifs pour les cours de surf collectifs
  77.                     </div>
  78.                 </div>
  79.             </a>
  80.             <a href="/cours-particuliers.html" class="item">
  81.                 <div class="img">
  82.                     <img src="{{ asset('front/images/miniature-slide-index/miniature-cours-de-surf-particuliers.jpg') }}" loading="lazy" alt="cours particuliers de surf">
  83.                 </div>
  84.                 <div class="content">
  85.                     <div class="title">
  86.                         cours de surf <br> particuliers
  87.                     </div>
  88.                     <div class="link">
  89.                         ➔
  90.                     </div>
  91.                 </div>
  92.                 <div class="hover-box">
  93.                     <div class="title">
  94.                         cours de surf privés à saint-jean-de-luz
  95.                     </div>
  96.                     <div class="desc">
  97.                         La formule idéale pour découvrir le surf ou pour améliorer rapidement son niveau sur les vagues de la plage d'Hendaye.
  98.                     </div>
  99.                     <div class="desc-2">
  100.                         Découvrez nos tarifs pour les cours de surf particuliers
  101.                     </div>
  102.                 </div>
  103.             </a>
  104.             <a href="/evg-evjf.html" class="item">
  105.                 <div class="img">
  106.                     <img src="{{ asset('front/images/miniature-slide-index/miniature-bachelor-party-surf.jpg') }}" loading="lazy" alt="evj surf hendaye">
  107.                 </div>
  108.                 <div class="content">
  109.                     <div class="title">
  110.                         EVJ <br> ET EVG
  111.                     </div>
  112.                     <div class="link">
  113.                         ➔
  114.                     </div>
  115.                 </div>
  116.                 <div class="hover-box">
  117.                     <div class="title">
  118.                         Bachelors et Bachelorettes parties !
  119.                     </div>
  120.                     <div class="desc">
  121.                         Des moments inoubliables à partager avec vos amie·s ! Du fun et du plaisir avec des programmes sur mesure préparés par notre équipe.
  122.                     </div>
  123.                     <div class="desc-2">
  124.                         En savoir plus
  125.                     </div>
  126.                 </div>
  127.             </a>
  128.             <a href="/faq.html" class="item">
  129.                 <div class="img">
  130.                     <img src="{{ asset('front/images/esf/mini-slide-5.jpeg') }}" loading="lazy" alt="">
  131.                 </div>
  132.                 <div class="content">
  133.                     <div class="title">
  134.                         la faq : toutes <br> nos réponses
  135.                     </div>
  136.                     <div class="link">
  137.                         ➔
  138.                     </div>
  139.                 </div>
  140.                 <div class="hover-box">
  141.                     <div class="title">
  142.                         Toutes les réponses à vos questions
  143.                     </div>
  144.                     <div class="desc">
  145.                         A quel âge commencer le surf, où ont lieu les cours de surf que vous proposez, que dois-je amener pour participer...
  146.                     </div>
  147.                     <div class="desc-2">
  148.                         En savoir plus
  149.                     </div>
  150.                 </div>
  151.             </a>
  152.         </div>
  153.     </section>
  154. {% endblock %}
  155. {% block contenu %}
  156.     <section class=" pb-50 pt-75 ">
  157.         <div class=" container clearfix ">
  158.             <div class="page-box">
  159.                 <div class="img-box float-xl-left" data-aos="fade-right" data-aos-delay="50" data-aos-duration="800" data-aos-easing="ease-in-out" data-aos-once="true">
  160.                     <div class="img-1">
  161.                         <img src="{{ src }}" loading="lazy" alt="">
  162.                     </div>
  163.                     <div class="img-2">
  164.                         <img src="{{ src1 }}" loading="lazy" alt="">
  165.                     </div>
  166.                     <div class="img-icon">
  167.                         <img src="{{ asset('front/images/esf/deco-img-1.svg') }}" width="93" loading="lazy" alt="" class="img-circle">
  168.                         <img src="{{ asset('front/images/esf/deco-img-2.svg') }}" width="152" loading="lazy" alt="" class="text-circle">
  169.                     </div>
  170.                 </div>
  171.                 <div class="content-box">
  172.                     <div class="sect-title">
  173.                         <h1>
  174.                             {{ page.titre }}
  175.                         </h1>
  176.                     </div>
  177.                     <div class="bloc-text ">
  178.                         {{ page.contenu | raw }}
  179.                     </div>
  180.                 </div>
  181.             </div>
  182.         </div>
  183.     </section>
  184. {% endblock %}
  185. {% block atout %}
  186.     <section class="services-section">
  187.         <div class="container">
  188.             <div class="row">
  189.                 <div class="col-xl-5 col-12 mb-40 pt-xl-95" data-aos="fade-right" data-aos-delay="50" data-aos-duration="800" data-aos-easing="ease-in-out" data-aos-once="true">
  190.                     <div class="sect-title">
  191.                         <div class="h1">
  192.                             Des services et des avantages exclusifs
  193.                         </div>
  194.                     </div>
  195.                     <div class="bloc-text">
  196.                         <p>Nous vous offrons bien plus qu'une leçon. Avec notre école de surf, plongez dans une expérience unique avec des cours adaptés, des moniteurs passionnés, et une atmosphère qui favorise l'apprentissage. </p>
  197.                         <p>Rejoignez l’ESF Saint-Jean-de-Luz pour des moments mémorables sur les vagues basques. Votre aventure commence ici.</p>
  198.                     </div>
  199.                 </div>
  200.                 <div class="col-xl-7 col-12" data-aos="fade-left" data-aos-delay="50" data-aos-duration="800" data-aos-easing="ease-in-out" data-aos-once="true">
  201.                     <div class="row">
  202.                         <div class="col-md-6 col-12 mb-0 mb-40 pt-xl-95">
  203.                             <div class="item-services mb-40">
  204.                                 <div class="icon">
  205.                                     <img src="{{ asset('front/images/esf/ico-avt-1.svg') }}" width="62" loading="lazy" alt="">
  206.                                 </div>
  207.                                 <div class="title">
  208.                                     Un local spacieux <br> face à l'océan
  209.                                 </div>
  210.                                 <div class="desc">
  211.                                     Profitez de vestiaires avec douches chaudes et casiers de rangements.
  212.                                 </div>
  213.                             </div>
  214.                             <div class="item-services">
  215.                                 <div class="icon">
  216.                                     <img src="{{ asset('front/images/esf/ico-avt-3.svg') }}" width="56" loading="lazy" alt="">
  217.                                 </div>
  218.                                 <div class="title">
  219.                                     Une team de moniteurs <br> 100% diplômés
  220.                                 </div>
  221.                                 <div class="desc">
  222.                                     Toute notre équipe de moniteurs de surf est titulaire du Brevet d’Etat pour un apprentissage sécurisé.
  223.                                 </div>
  224.                             </div>
  225.                         </div>
  226.                         <div class="col-md-6 col-12 mb-0">
  227.                             <div class="item-services mb-40">
  228.                                 <div class="icon">
  229.                                     <img src="{{ asset('front/images/esf/ico-avt-2.svg') }}" width="34" loading="lazy" alt="">
  230.                                 </div>
  231.                                 <div class="title">
  232.                                     Prêt gratuit <br> de matériel adapté
  233.                                 </div>
  234.                                 <div class="desc">
  235.                                     Planches et combinaisons de surf adaptées sont comprises dans nos formules.
  236.                                 </div>
  237.                             </div>
  238.                             <div class="item-services">
  239.                                 <div class="icon">
  240.                                     <img src="{{ asset('front/images/esf/ico-avt-4.svg') }}" width="57" loading="lazy" alt="">
  241.                                 </div>
  242.                                 <div class="title">
  243.                                     Enfants <br> du Pays basque
  244.                                 </div>
  245.                                 <div class="desc">
  246.                                     Avec nous, découvrez les meilleures adresses de la Côte basque pour des vacances inoubliables !
  247.                                 </div>
  248.                             </div>
  249.                         </div>
  250.                     </div>
  251.                 </div>
  252.             </div>
  253.         </div>
  254.     </section>
  255. {% endblock %}
  256. {% block cours %}
  257.     {% include 'front/formule.html.twig' %}
  258. {% endblock %}
  259. {% block a_voir %}
  260.     
  261.     <section class="pb-0 pt-50">
  262.         <div class="container">
  263.             <div class="sect-title text-center" data-aos="fade-up" data-aos-delay="50" data-aos-duration="800" data-aos-easing="ease-in-out" data-aos-once="true">
  264.                 <div class="h1">
  265.                     à voir et à faire au pays basque pendant vos vacances
  266.                 </div>
  267.             </div>
  268.             <div class="bloc-text mb-50 text-center fs-big">
  269.                 Manex et toute l’équipe de l’école de surf ESF SAINT-JEAN-DE-LUZ partageront avec vous leurs bonnes adresses et leurs bons plans pour passer des vacances inoubliables. Petit aperçu de ce que pourra vous réserver votre séjour au Pays basque...
  270.             </div>
  271.         </div>
  272.         <div class="container container-one">
  273.             <div class="row">
  274.                 <div class="col-xl col-md-6 col-12 mb-30 order-1" data-aos="fade-up" data-aos-delay="50" data-aos-duration="800" data-aos-easing="ease-in-out" data-aos-once="true">
  275.                     <a href="/maison-infante.html" class="item-vac deco-losange-parent mb-30">
  276.                         <div class="img">
  277.                             <img src="{{ asset('front/images/esf/vac-1.jpeg') }}" loading="lazy" alt="">
  278.                         </div>
  279.                         <div class="icon deco-losange">
  280.                             <img src="{{ asset('front/images/esf/vac-ico-1.svg') }}" loading="lazy" alt="">
  281.                         </div>
  282.                         <div class="content">
  283.                             <div class="title">
  284.                                 la maison <br> de l’infante
  285.                             </div>
  286.                             <div class="link">
  287.                                 ➔
  288.                             </div>
  289.                         </div>
  290.                     </a>
  291.                     <a href="/golf-pays-basque.html" class="item-vac deco-losange-parent">
  292.                         <div class="img">
  293.                             <img src="{{ asset('front/images/esf/golf-pays-basque-ecole-de-surf-hendaye-saint-jean-deluz.jpg') }}" loading="lazy" alt="golf pays basque et surf saint jean de luz et hendaye">
  294.                         </div>
  295.                         <div class="icon deco-losange">
  296.                             <img src="{{ asset('front/images/esf/vac-ico-2.svg') }}" loading="lazy" alt="">
  297.                         </div>
  298.                         <div class="content">
  299.                             <div class="title">
  300.                                 golf au <br> pays basque
  301.                             </div>
  302.                             <div class="link">
  303.                                 ➔
  304.                             </div>
  305.                         </div>
  306.                     </a>
  307.                 </div>
  308.                 <div class="col-xl-5 col-12 order-xl-2 order-3 mb-30 px-xl-5" data-aos="fade-up" data-aos-delay="350" data-aos-duration="800" data-aos-easing="ease-in-out" data-aos-once="true">
  309.                     <div class="bloc-text mb-50">
  310.                         <p>Explorez des lieux emblématiques tels que <a href="/maison-infante.html">la Maison de l'Infante</a>, offrant une plongée dans l'histoire locale. Profitez de la tranquillité à la Baie de Chingoudy et détendez-vous à la thalassothérapie après une journée de
  311.                             surf inoubliable.</p>
  312.                         <p>Pour les amateurs de golf, <a href="/golf-pays-basque.html">les greens et parcours de golf</a> de renom tels que Chiberta à Anglet et Biarritz et Chantaco vous attendent. Pour les aventuriers, testez vos limites à <a href="/accrobranche-cote-basque.html">l'accrobranche du Parc Oihana</a>. <br>Ne manquez pas le charme du
  313.                             <a href="/petit-train-rhune.html">Petit train de la Rhune</a> offrant des vues spectaculaires à partager en famille ou entre ami·e·s. Et pour les amoureux de la nature, partez à la découverte du <a href="/balade-et-randonnees-pays-basque.html">Pays Basque à vélo ou en rando</a>, une autre manière d'explorer cette
  314.                             magnifique région.</p>
  315.                         <p>Explorez, détendez-vous et vivez pleinement l'expérience unique de Saint-Jean-de-Luz et de ses trésors cachés. <b>Surf, histoire, nature, golf, sensations fortes et détente, tout est à portée de main sur la Côte basque.</b></p>
  316.                     </div>
  317.                     <a href="/petit-train-rhune.html" class="item-vac deco-losange-parent mb-30">
  318.                         <div class="img">
  319.                             <img src="{{ asset('front/images/esf/vac-5.jpeg') }}" loading="lazy" alt="tourisme decouverte pays basque rhune surf hendaye et saint jean de luz">
  320.                         </div>
  321.                         <div class="icon deco-losange">
  322.                             <img src="{{ asset('front/images/esf/vac-ico-5.svg') }}" loading="lazy" alt="">
  323.                         </div>
  324.                         <div class="content">
  325.                             <div class="title">
  326.                                 le petit train <br> de la rhune
  327.                             </div>
  328.                             <div class="link">
  329.                                 ➔
  330.                             </div>
  331.                         </div>
  332.                     </a>
  333.                 </div>
  334.                 <div class="col-xl col-md-6 col-12 mb-30 order-2 order-xl-3" data-aos="fade-up" data-aos-delay="650" data-aos-duration="800" data-aos-easing="ease-in-out" data-aos-once="true">
  335.                     <a href="/balade-et-randonnees-pays-basque.html" class="item-vac deco-losange-parent mb-30">
  336.                         <div class="img">
  337.                             <img src="{{ asset('front/images/esf/balade-en-velo-pays-basque.jpg') }}" loading="lazy" alt="randonnees pays basque et surf a hendaye et saint jean de luz">
  338.                         </div>
  339.                         <div class="icon deco-losange">
  340.                             <img src="{{ asset('front/images/esf/vac-ico-3.svg') }}" loading="lazy" alt="">
  341.                         </div>
  342.                         <div class="content">
  343.                             <div class="title">
  344.                                 baldes et randonnées <br> au pays basque
  345.                             </div>
  346.                             <div class="link">
  347.                                 ➔
  348.                             </div>
  349.                         </div>
  350.                     </a>
  351.                     <a href="/accrobranche-cote-basque.html" class="item-vac deco-losange-parent">
  352.                         <div class="img">
  353.                             <img src="{{ asset('front/images/esf/vac-4.jpeg') }}" loading="lazy" alt="accrobranche paintball et surf a saint jean de luz et hendaye">
  354.                         </div>
  355.                         <div class="icon deco-losange">
  356.                             <img src="{{ asset('front/images/esf/vac-ico-4.svg') }}" loading="lazy" alt="accrobranche et paintball au pays basque">
  357.                         </div>
  358.                         <div class="content">
  359.                             <div class="title">
  360.                                 accrobranche <br> près de saint-jean-de-luz
  361.                             </div>
  362.                             <div class="link">
  363.                                 ➔
  364.                             </div>
  365.                         </div>
  366.                     </a>
  367.                 </div>
  368.             </div>
  369.         </div>
  370.     </section>
  371. {% endblock %}
  372. {% block avis %}
  373.     <section class="avis-section">
  374.         <div class="container">
  375.             <div class="sect-title text-center" data-aos="fade-up" data-aos-delay="50" data-aos-duration="800" data-aos-easing="ease-in-out" data-aos-once="true">
  376.                 <div class="h1 text-white">
  377.                     NOTRE école de surf, c’est vous qui en parlez le mieux !
  378.                 </div>
  379.             </div>
  380.             <div class="bloc-text text-white text-center mb-60" data-aos="fade-up" data-aos-delay="50" data-aos-duration="800" data-aos-easing="ease-in-out" data-aos-once="true">
  381.                 Retrouvez ci-dessous quelques témoignages d’élèves ayant participé à des cours et des stages de surf à Hendaye et Saint-Jean-de-Luz avec l’équipe de l’école de surf ESF SAINT-JEAN-DE-LUZ.
  382.             </div>
  383.             <div class="row align-items-center">
  384.                 <div class="col-lg-google col-12 mb-40" data-aos="fade-right" data-aos-delay="50" data-aos-duration="800" data-aos-easing="ease-in-out" data-aos-once="true">
  385.                     <div class="note-google ml-lg-0">
  386.                         <div class="note">
  387.                             4.8
  388.                         </div>
  389.                         <div class="stars-list">
  390.                             <i class="fa fa-star"></i>
  391.                             <i class="fa fa-star"></i>
  392.                             <i class="fa fa-star"></i>
  393.                             <i class="fa fa-star"></i>
  394.                             <i class="fa fa-star"></i>
  395.                         </div>
  396.                         <div class="desc">
  397.                             sur plus de 150 avis
  398.                         </div>
  399.                         <div class="text-center">
  400.                             <img src="{{ asset('front/images/esf/google.png') }}" loading="lazy" alt="">
  401.                         </div>
  402.                     </div>
  403.                 </div>
  404.                 <div class="col-lg-google-avis col-12 mb-40" data-aos="fade-left" data-aos-delay="50" data-aos-duration="800" data-aos-easing="ease-in-out" data-aos-once="true">
  405.                     <div class="google-slide-box">
  406.                         <div class="deco-left-box"></div>
  407.                         <div class="deco-left-box"></div>
  408.                         <div class="google-slide owl-carousel">
  409.                             {% for avis in avisListe %}
  410.                             <a href="" class="item">
  411.                                 <div class="title-box">
  412.                                     <div class="avatar">
  413.                                         <img src="{{ asset(avis_directory~avis.avatar) }}" loading="lazy" alt="">
  414.                                     </div>
  415.                                     <div class="title">
  416.                                         {{ avis.nom }}
  417.                                     </div>
  418.                                 </div>
  419.                                 <div class="stars-list">
  420.                                     {% for i in 1..5 %}
  421.                                         {% if (i <= avis.note) %}
  422.                                             <i class="fa fa-star"></i>
  423.                                         {% else %}
  424.                                             <i class="fa fa-star empty"></i>
  425.                                         {% endif %}
  426.                                     {% endfor %}
  427.                                 </div>
  428.                                 <div class="desc">
  429.                                     {{ avis.commentaire }}
  430.                                 </div>
  431.                             </a>
  432.                             {% endfor %}
  433.                         </div>
  434.                     </div>
  435.                 </div>
  436.             </div>
  437.         </div>
  438.     </section>
  439. {% endblock %}
  440. {% block actualite %}
  441.     <section class="pt-90 pb-140">
  442.         <div class="container">
  443.             <div class="sect-title text-center" data-aos="fade-up" data-aos-delay="50" data-aos-duration="800" data-aos-easing="ease-in-out" data-aos-once="true">
  444.                 <div class="h1">
  445.                     Le Blog de l’ESF SAINT-JEAN-DE-LUZ
  446.                 </div>
  447.             </div>
  448.             <div class="bloc-text fs-big text-center mb-55">
  449.                 Découvrez les coulisses de notre école de surf, les bonnes adresses et les conseils pour débuter le surf ou améliorer son niveau de glisse. Retrouvez également des témoignages en longueur de nos élèves.
  450.             </div>
  451.         </div>
  452.         <div class="container container-one">
  453.             <div class="blog-list">
  454.                 {% for actualite in actualites %}
  455.                 {{ actualite.init() }}
  456.                 <a href="{{ path('app_actualite_detail', { slug : actualite.slug }) }}" class="item-blog" data-aos="fade-up" data-aos-delay="50" data-aos-duration="800" data-aos-easing="ease-in-out" data-aos-once="true">
  457.                     <div class="img">
  458.                         <img src="{{ asset(actualite.imgSrc) }}" loading="lazy" alt="">
  459.                     </div>
  460.                     <div class="content">
  461.                         <div class="cat">
  462.                             {% if actualite.categorie is not null %}
  463.                                 {{ actualite.categorie.nom }}
  464.                             {% endif %}
  465.                         </div>
  466.                         <div class="title">
  467.                             {{ actualite.titre }}
  468.                         </div>
  469.                     </div>
  470.                 </a>
  471.                 {% endfor %}
  472.             </div>
  473.         </div>
  474.     </section>
  475. {% endblock %}
  476. {% block modal %}
  477.     {% if popup is defined and popup is not null %}
  478.     <!-- Modal -->
  479.     <div class="modal fade" id="modal-popup" tabindex="-1" role="dialog" aria-hidden="true">
  480.         <div class="modal-dialog modal-dialog-centered" role="document">
  481.             <div class="modal-content">
  482.                 <div class="modal-body" style="background: url({{ asset(popup_directory ~ popup.image) }}) no-repeat center/cover;">
  483.                     <button type="button" class="close" data-dismiss="modal" aria-label="Close">
  484.                         <span aria-hidden="true">&times;</span>
  485.                     </button>
  486.                     {{ popup.contenu | raw }}
  487.                 </div>
  488.             </div>
  489.         </div>
  490.     </div>
  491.     {% endif %}
  492. {% endblock %}