templates/frontend/home/_join.html.twig line 1

  1. <div class="bg-brand-gray py-8" id="join">
  2.     <div class="lg:w-[1280px] lg:mx-auto">
  3.         <div class="flex space-x-6">
  4.             <div class=" w-2/3">
  5.                 <h5 class="uppercase text-brand-dark text-3xl font-light mx-8 mb-3">{{ 'join.title' | trans }}</h5>
  6.                 <p class="py-6 font-light indent-8">
  7.                     {{ 'join.description' | trans }}
  8.                 </p>
  9.                 <ul class="grid grid-cols-2 gap-6">
  10.                     <li>
  11.                         <a class="flex items-center space-x-3 p-3 transition ease-in-out rounded bg-brand text-white group"
  12.                            href="{{ path('app_intro', {'_fragment': 'documents'}) }}">
  13.                             <div class="fa-stack text-brand-green text-white text-2xl">
  14.                                 <i class="fa-regular fa-circle fa-stack-2x"></i>
  15.                                 <i class="fa-solid fa-clipboard fa-stack-1x text-white/80"></i>
  16.                             </div>
  17.                             <span>{{ 'join.buttons.rules' | trans }}</span>
  18.                         </a>
  19.                     </li>
  20.                     <li>
  21.                         <a class="flex items-center space-x-3 p-3 transition ease-in-out rounded bg-brand text-white group"
  22.                            href="{{ path('app_intro', {'_fragment': 'documents'}) }}">
  23.                             <div class="fa-stack text-brand-green text-white text-2xl">
  24.                                 <i class="fa-regular fa-circle fa-stack-2x"></i>
  25.                                 <i class="fa-solid fa-file-circle-question fa-stack-1x text-white/80"></i>
  26.                             </div>
  27.                             <span>{{ 'join.buttons.procedure' | trans }}</span>
  28.                         </a>
  29.                     </li>
  30.                     <li>
  31.                         <a class="flex items-center space-x-3 p-3 transition ease-in-out rounded bg-brand text-white group"
  32.                            href="{{ path('app_intro', {'_fragment': 'documents'}) }}">
  33.                             <div class="fa-stack text-brand-green text-white text-2xl">
  34.                                 <i class="fa-regular fa-circle fa-stack-2x"></i>
  35.                                 <i class="fa-solid fa-file-pen fa-stack-1x text-white/80"></i>
  36.                             </div>
  37.                             <span>{{ 'join.buttons.application' | trans }}</span>
  38.                         </a>
  39.                     </li>
  40.                     <li>
  41.                         <a class="flex items-center space-x-3 p-3 transition ease-in-out rounded bg-brand text-white group"
  42.                            href="{{ path('app_intro', {'_fragment': 'documents'}) }}">
  43.                             <div class="fa-stack text-brand-green text-white text-2xl">
  44.                                 <i class="fa-regular fa-circle fa-stack-2x"></i>
  45.                                 <i class="fa-solid fa-file-signature fa-stack-1x text-white/80"></i>
  46.                             </div>
  47.                             <span>{{ 'join.buttons.contract' | trans }}</span>
  48.                         </a>
  49.                     </li>
  50.                 </ul>
  51.             </div>
  52.             <div class="text-left p-6 bg-white rounded w-1/3 shadow">
  53.                 {% for label, messages in app.flashes %}
  54.                     {% for message in messages %}
  55.                         <div class="p-3 rounded bg-green-300 border border-green-500 mb-3 text-green-900">
  56.                             <i class="fa fa-circle-check mr-3"></i>{{ message }}
  57.                         </div>
  58.                     {% endfor %}
  59.                 {% endfor %}
  60.                 <form id="feedback" action="{{ path('app_user_feedback', {_locale: app.request.locale}) }}"
  61.                       method="post" name="feedback">
  62.                     <div class="mb-6">
  63.                         <input name="email" type="email"
  64.                                class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500"
  65.                                placeholder="{{ 'join.feedback.email' | trans }}" required>
  66.                     </div>
  67.                     <div class="mb-6">
  68.                         <input name="number" type="number"
  69.                                maxlength="8"
  70.                                class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500"
  71.                                placeholder="{{ 'join.feedback.phone' | trans }}" required>
  72.                     </div>
  73.                     <div class="mb-6">
  74.                         <textarea maxlength="500" name="body" rows="5"
  75.                                   class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500"
  76.                                   placeholder="{{ 'join.feedback.text' | trans }}" required></textarea>
  77.                     </div>
  78.                     <input name="token" type="hidden" value="{{ csrf_token('user-feedback') }}">
  79.                     <button type="submit"
  80.                             class="text-white bg-brand hover:bg-brand/80 font-medium rounded-lg text-sm w-full sm:w-auto px-5 py-2.5 text-center">
  81.                         <i class="fa fa-paper-plane mr-3"></i>{{ 'join.feedback.button' | trans }}
  82.                     </button>
  83.                 </form>
  84.                 <script>
  85.                     {# $(document).ready(function(){ #}
  86.                     {#    $("#feedback").submit(function(e){ #}
  87.                     {#        e.preventDefault(); #}
  88.                     {#        const form = $(this); #}
  89.                     {#        const email = $('#email').val(); #}
  90.                     {#        const number = $('#number').val(); #}
  91.                     {#        const feedback = $('#feedback-body').val(); #}
  92.                     {#        const token = $('#_csrf_token').val(); #}
  93.                     {#        $.ajax({ #}
  94.                     {#            type: 'POST', #}
  95.                     {#            url: '{{ path('app_user_feedback') }}', #}
  96.                     {#            data: {email : email, contact: number, feedback: feedback, token: token}, #}
  97.                     {#            dataType: 'json', #}
  98.                     {#            success: (response) => { #}
  99.                     {#                console.log(response); #}
  100.                     {#            } #}
  101.                     {#        }) #}
  102.                     {#    }); #}
  103.                     {# }); #}
  104.                 </script>
  105.             </div>
  106.         </div>
  107.     </div>
  108. </div>