templates/themes/theme/enquiry/enquiry.html.twig line 1

Open in your IDE?
  1. {% block stylesheets %}
  2.     <script src="https://www.google.com/recaptcha/api.js" async defer></script>
  3.     <script>
  4.         function onSubmit(token) {
  5.             document.getElementById("enquiry_form").submit();
  6.         }
  8.         {% if error or success %}
  9.         setTimeout(() => {
  10.             const id = 'enquiry_form';
  11.             const yOffset = {{ error ? -200 : 0 }};
  12.             const element = document.getElementById(id);
  13.             const y = element.getBoundingClientRect().top + window.scrollY + yOffset;
  15.             window.scrollTo({top: y, behavior: 'smooth'});
  16.         }, 1000);
  17.         {% endif %}
  18.     </script>
  19. {% endblock %}
  21. <div class="row">
  22.     <div class="col-12">
  23.         <h2 class="text-center mb-6">Contact</h2>
  24.         <div class="text-xl md:text-2xl lg:text-3xl mb-12">
  25.             {{ forceRenderHtmlBlock('Contact Text')|raw }}
  26.         </div>
  27.     </div>
  28. </div>
  30. {% if error %}
  31.     <p class="error-message !mb-12">{{errorMessage}}</p>
  32. {% endif %}
  34. {% if success %}
  35.     <p id="enquiry_form" class="success-message !mb-12">Thank you for your enquiry.</p>
  37. {% else %}
  38.     <form method="post" id="enquiry_form">
  40.         {# Set recaptcha keys (public/site and secret) in config.yml #}
  41.         {# Generate a new key (remember to add live domain to the list) here https://www.google.com/recaptcha/admin#list #}
  43.             <div class="row"> <div class="md:col-6">
  44.                 <div class="form-group">
  45.                     {{ form_widget(form.name, { attr : { 'placeholder' : ' ' }}) }}
  46.                     {{ form_label(form.name) }}
  47.                     {{ form_errors(form.name) }}
  48.                 </div>
  49.             </div>
  50.             <div class="md:col-6">
  51.                 <div class="form-group">
  52.                     {{ form_widget(form.email, { attr : { 'placeholder' : ' ' }}) }}
  53.                     {{ form_label(form.email) }}
  54.                     {{ form_errors(form.email) }}
  55.                 </div>
  56.             </div>
  57.         </div>
  58.         <div class="row">
  59.             <div class="md:col-6">
  60.                 <div class="form-group">
  61.                     {{ form_widget(form.contactNumber, { attr : { 'placeholder' : ' ' }}) }}
  62.                     {{ form_label(form.contactNumber) }}
  63.                 </div>
  64.             </div>
  65.             <div class="md:col-6">
  66.                 <div class="form-group">
  67.                     {{ form_widget(form.businessName, { attr : { 'placeholder' : ' ' }}) }}
  68.                     {{ form_label(form.businessName) }}
  69.                 </div>
  70.             </div>
  71.         </div>
  72.         <div class="row">
  73.             <div class="col-12">
  74.                 <div class="form-group">
  75.                     {{ form_widget(form.message, { attr : { 'placeholder' : ' ' }}) }}
  76.                     {{ form_label(form.message) }}
  77.                     {{ form_errors(form.message) }}
  78.                 </div>
  79.             </div>
  80.         </div>
  82.         {{ form_rest(form) }}
  84.         <button type="submit" class="block p-4 w-full font-bold uppercase bg-primary text-white text-center hover:bg-black hover:text-primary g-recaptcha" data-sitekey="{{ recaptcha_public }}" data-callback='onSubmit'>Send</button>
  86.     </form>
  87. {% endif %}
  89. {% block javascript %}{% endblock %}