src/Aviatur/TwigBundle/Resources/views/default/Flux/General/Components/newsletterModal.html.twig line 1

Open in your IDE?
  1. <div class="main__newsletter-modal sp-stack--big modal-general js-form-modal-newsletter" sytle>
  2.     <form id="js-newsletterSubscribe" class="form-modal-newsletter" action="">
  3.         <span class="js-newsletter__btn-Close">X</span>
  4.         <div id="js-newsletterRS" class="col-12 text-center type-main" style="display:none;">
  5.             <div class="circularG center-block"></div>
  6.         </div>
  7.         <div id="js-newsletterRQ">
  8.             <p class="text-center" role="heading" aria-level="2" style="color:#444;font-weight:600;font-size:1.75rem;margin:1em 0;">
  9.                 Reciba nuestro boletín de ofertas directamente en su correo
  10.             </p>
  11.             <div class="boletinForm-email">
  12.                  <div class="form-group-nombre hidden-all">
  13.                      <span class="datos-boletin">Nombre</span>
  14.                      {{ form_widget(newsletter_form.firstname) }}
  15.                  </div>
  16.                 {# <div class="subscribeicon">
  17.                     <span class="icon icon_newsletters_circle"></span>
  18.                 </div> #}
  19.                 <div class="form-group-email">
  20.                     <span class="datos-boletin">Correo</span>
  21.                     {{ form_widget(newsletter_form.email) }}
  22.                 </div>
  23.             </div>
  24.             <div class="content-policy-disclaimer">
  25.                 <label>
  26.                     <input id="conditions" name="CD[accept-conditions-promos]" type="checkbox" required>
  27.                     <span for="conditions"><span class="conditions-boletin">Acepto las&nbsp;</span><strong><a class="boletin-ofertas" href="/contenidos/politica-de-privacidad" target="_blank">Políticas de uso de datos</a> </strong></span>
  28.                 </label>
  29.             </div>
  30.             <div class="boletinForm-email">
  31.                 <div class="boletinForm-butoom">
  32.                     <input type="submit" class="btn btn--full" value="Quiero suscribirme"/>
  33.                 </div>
  34.             </div>
  35.         </div>
  36.         </div>
  37.         <div class="hidden-all">
  38.             {{form_rest(newsletter_form)}}
  39.         </div>
  40.     </form>
  41. </div>
  42. <script>
  43.     document.addEventListener('DOMContentLoaded', e => {
  44.         jQuery("#newsletter_form_firstname").val('Nombre');
  45.         const queryString = window.location.search;
  46.         const urlParams = new URLSearchParams(queryString);
  47.         document.querySelector('.main__newsletter-block').style.display = 'none';
  48.         if (urlParams.has('newsletter') && urlParams.get('newsletter') === 'true' && urlParams.get('newsletter') !== '') {
  49.             document.querySelector('.js-form-modal-newsletter').classList.add('modal-general__active');
  50.             document.querySelector('#newsletter_form_firstname').value = 'corp';     
  51.         } else {
  52.             document.querySelector('.js-form-modal-newsletter').classList.remove('hide');
  53.         }    
  54.         document.addEventListener('click', e => {
  55.             if (e.target.matches('.js-form-modal-newsletter') || e.target.matches('.js-newsletter__btn-Close')) {
  56.                 document.querySelector('.js-form-modal-newsletter').classList.remove('modal-general__active');  
  57.                 document.querySelector('.js-form-modal-newsletter').style.display = 'none';
  58.                 document.querySelector('.main__newsletter-block').style.display = 'block';
  59.             }
  60.         });   
  61.     }); 
  62. </script>