ParcBundle/Resources/views/parcbundle/retirage/index.html.twig line 1

Open in your IDE?
  1. {% extends '@parcBundle/base.html.twig' %}
  3. {% block stylesheets %}
  4.     {{ parent() }}
  5.     {{ encore_entry_link_tags('retirage', null, 'parc_build') }}
  6.     <script id="search-js" defer="" src="https://api.mapbox.com/search-js/v1.0.0-beta.14/web.js"></script>
  7. {% endblock %}
  9. {% block content %}
  10.     <section id="section-retirage">
  11.         <div class="container-fluid">
  12.             <div class="row pt-5 pb-5">
  13.                 <div class="col-md-12">
  14.                     <div class="card bg-green-to-light shadow mt-70" style="min-height:750px">
  15.                         <div class="card-body">
  16.                             {% for label, messages in app.flashes %}
  17.                                 {% for message in messages %}
  18.                                     <div class="alert alert-{{ label }} alert-dismissible fade show position-absolute" role="alert">
  19.                                         {{ message }}
  20.                                         <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
  21.                                     </div>
  22.                                 {% endfor %}
  23.                             {% endfor %}
  24.                             <div class=" contact-form mb-50">
  25.                                 <div class="row">
  26.                                     <h2 class="text-white">Formulaire de retirages photos</h2>
  27.                                     <p class="text-white pb-2">Merci de compléter le formulaire ci-dessous pour toutes demandes de retirages photos.<br>
  28.                                         Nous vous recontacterons dans les plus brefs délais pour finaliser votre demande.</p>
  29.                                     <div id="form-step">
  30.                                         <div class="form-progress">
  31.                                             <progress class="form-progress-bar" min="0" max="100" value="0" step="33" aria-labelledby="form-progress-completion"></progress>
  32.                                         <div id="form-progress-indicator-one" class="form-progress-indicator one active"></div>
  33.                                         <div id="form-progress-indicator-two" class="form-progress-indicator two"></div>
  34.                                         <div id="form-progress-indicator-three" class="form-progress-indicator three"></div>
  35.                                     </div>
  36.                                     <div class="animation-container">
  37.                                         {% include '@parcbundle/parcbundle/retirage/step1.html.twig' %}
  38.                                         {% include '@parcbundle/parcbundle/retirage/step2.html.twig' %}
  39.                                         {% include '@parcbundle/parcbundle/retirage/step3.html.twig' %}
  40.                                     </div>
  41.                                 </div>
  42.                             </div>
  43.                         </div>
  44.                     </div>
  45.                 </div>
  46.             </div>
  47.         </div>
  48.     </section>
  49. {% endblock %}
  51. {% block javascripts %}
  52.     {{ parent() }}
  53.     {{ encore_entry_script_tags('ajaxRetirage', null, 'parc_build') }}
  54.     <script>
  55.             const ACCESS_TOKEN = 'pk.eyJ1IjoidWJwaG90b2dyYXBoaWVzbWFwYm94IiwiYSI6ImNsZ3l3a3A2azBkcWozaHBieTB0dW9mZ24ifQ.QxsobmSzs_LjqxdCTsOiXw';
  56.             const script = document.getElementById('search-js');
  57.             script.onload = () => {
  58.             const elements = document.querySelectorAll('mapbox-address-autofill');
  59.                 for (const autofill of elements) {
  60.                 autofill.accessToken = ACCESS_TOKEN,
  61.                 autofill.options = {
  62.                 country: 'fr'
  63.                     }
  64.                 }
  65.             };
  66.     </script>
  68. {% endblock %}