templates/Nordinfo/Main/infolettre.html.twig line 1

Open in your IDE?
  1. {% extends 'Nordinfo/Main/base.html.twig' %}
  2. {% set show_btt = true %}
  3. {% block title %}Infolettre - Nord Info{% endblock %}
  4. {% block body_class %}body-signaler bgColorGrey{% endblock %}
  5. {% block header_epingles %}
  6.   {{ include('Lenord/Main/parts/epingles.html.twig') }}
  7. {% endblock %}
  8. {% block header_breadcrumb %}
  9.   {{ include('Nordinfo/Main/parts/breadcrumb.html.twig') }}
  10. {% endblock %}
  11. {% block body %}
  12.   <main role="main" class="mainContent pt-0 pb-5 bgColorHighlightBlue" tabindex="-1" id="mainContent">
  13.     {% if referer is not null %}
  14.       {% set url_back = referer %}
  15.     {% else %}
  16.       {% set url_back = path('info') %}
  17.     {% endif %}
  18.     {% include 'Nordinfo/Main/parts/back_btn.html.twig' with {'back_btn_class':''} %}
  19.     <div class="container pt-5 pb-6">
  20.       <article class="pt-5 pb-6">
  21.         <h1 class="text-center">Infolettre</h1>
  22.         <div style="text-align:center;">
  23.           <img src="/img/logos/logo-departement.png" width="300px" height="121.5px" alt="">
  24.         </div>
  25.         <div class="pt-5">
  26.           <p>
  27.             <strong>Recevez toutes les deux semaines une sélection d’actualités, de services et d’idées sorties qui font
  28.               le Nord.</strong>
  29.           </p>
  30.           <p>
  31.             Pour vous abonner à l’infolettre du Département, merci de remplir ce formulaire. Votre courriel est
  32.             nécessaire pour la gestion de votre abonnement à cette infolettre et sera conservé jusqu'à désabonnement.
  33.             Les destinataires des données sont exclusivement les services du Département du Nord.
  34.           </p>
  35.           <p>
  36.             <a href="https://lenord.fr/donnees-personnelles#infolettre">Plus d'information sur la protection de vos
  37.               données personnelles</a>
  38.           </p>
  39.           <p>
  40.             Vous pourrez vous désabonner à tout moment en cliquant sur le lien de désinscription à la fin des courriels
  41.             reçus.
  42.           </p>
  43.           <p class="text-center pt-5">Les champs suivis d'un astérisque (<span class="colorRed">*</span>)
  44.             sont obligatoires</p>
  45.           
  46.           <script type="text/javascript" src="https://forms.sbc31.net/form.js" id="sb-form-script"
  47.                   data-sb-form-script="{&quot;accountId&quot;:&quot;61782104b95cee62596eb989&quot;,&quot;resourcesUrl&quot;:&quot;https://forms.sbc31.net/&quot;}"></script>
  48.           <form id="sb_form"
  49.                 class="formCustom pt-5"
  50.                 onsubmit="process2(
  51.     'https://api.sarbacane.com/v1/forms/contacts/upsert?listID&#x3D;-g2yvIUSR922trAcpGyU4w&amp;formID&#x3D;um8Emb-2R425t5Y8RZ45VQ&amp;timezone&#x3D;Europe/Paris', 'https://forms.sbc31.net/', '61782104b95cee62596eb989', 'true', 'message',
  52.     'https://info.lenord.fr/info',
  53.     'https://services.sarbacane.com/core/v1/transactional/sendmessage/optin', 'Merci', 'Votre demande d%27inscription a bien été prise en compte',
  54.     'Vous allez recevoir un email de confirmation', 'Vous devrez cliquer sur le lien de confirmation pour valider votre inscription', 'Erreur',
  55.     'Une erreur inattendue s%27est produite.', 'Le formulaire est en cours d%27édition, veuillez patienter quelques minutes avant d%27essayer à nouveau.', 'um8Emb-2R425t5Y8RZ45VQ',
  56.     'FR', 'Sarbacane', '', '',
  57.     '', '', ''
  58.   );
  59.   return false;"
  60.                 method="post">
  61.             <div class="form-group">
  62.               <div class="__input-wrapper _select">
  63.                 <div class="__inner">
  64.                   <label id="label-EMAIL_ID" for="input-email">
  65.                     <span class="label-text">Courriel (<span class="font-italic">adresse@domaine.com</span>)</span>
  66.                     <span class="colorRed" id="form-mandatory">*</span>
  67.                   </label>
  68.                   <input class="form-control" id="input-email" type="email" autocomplete="email" name="email"
  69.                          required="true" sb-form-input="">
  70.                 </div>
  71.               </div>
  72.             </div>
  73.             <div class="form-group">
  74.               <div class="__input-wrapper _select">
  75.                 <div class="__inner">
  76.                   <label id="label-katr5r7gyoufxryllymkq" for="input-katr5r7gyoufxryllymkq">
  77.                     <span class="label-text" id="form-mandatory">Année de naissance</span>
  78.                     <span class="colorRed" id="form-mandatory">*</span>
  79.                   </label>
  80.                   <input class="form-control" id="input-katr5r7gyoufxryllymkq" type="number" min="1900" max="2019"
  81.                          autocomplete="bday-year" name="katr5r7gyoufxryllymkq" required="true" sb-form-input="">
  82.                 </div>
  83.               </div>
  84.             </div>
  85.             <div class="form-group">
  86.               <div class="__input-wrapper _select">
  87.                 <div class="__inner">
  88.                   <label id="label-2nkysb7a0i56zv9cxv435c" for="input-2nkysb7a0i56zv9cxv435c">
  89.                     <span class="label-text" id="form-mandatory">Code postal</span>
  90.                     <span class="colorRed" id="form-mandatory">*</span>
  91.                   </label>
  92.                   <input class="form-control" id="input-2nkysb7a0i56zv9cxv435c" type="number" max="99999"
  93.                          autocomplete="postal-code" name="2nkysb7a0i56zv9cxv435c" required="true" sb-form-input="">
  94.                 </div>
  95.               </div>
  96.             </div>
  97.             <div class="form-group">
  98.               <div class="form-check">
  99.                 <input class="form-check-input" id="invalidCheck" required type="checkbox" value="" name="checkbox">
  100.                 <label class="form-check-label" for="invalidCheck">
  101.                   <span class="d-none label-text">En cochant cette case, j'accepte les mentions légales</span>
  102.                   En cochant cette case, j'accepte les
  103.                   <a href="https://info.lenord.fr/mentions-legales-nordinfo">mentions légales</a>&nbsp; de ce site <span
  104.                     class="colorRed d-validation-none">*</span>
  105.                 </label>
  106.               </div>
  107.             </div>
  108.             <div class="__buttons-wrapper" id="div-submitInput">
  109.               <button class="btn btnFormSubmit" id="submitInput" type="submit" value="Valider">
  110.                 <span>VALIDER</span>
  111.               </button>
  112.               <div class="loader" style="display:none"></div>
  113.             </div>
  114.           </form>
  115.         </div>
  116.       </article>
  117.     </div>
  118.   </main>
  119. {% endblock %}