app/Resources/BaitPollBundle/views/Poll/fragments/radio.html.twig line 1

Open in your IDE?
  1. {% if question.randomAnswerOrder %}
  2.     {% set items = array_shuffle(question.answers.values) %}
  3. {% else %}
  4.     {% set items = question.answers %}
  5. {% endif %}
  7. <div class="mid-section-pb container">
  8.     <div class="visual-input flex flex-wrap justify-center gap-15 lg:gap-24">
  9.         {% for answer in items if answer.type == 'radio' %}
  10.             <div class="flex flex-col items-center">
  11.                 {% include 'BaitPollBundle:Poll:fragments/photo.html.twig' with {
  12.                     'photo': answer.photo,
  13.                     'source': answer.photoSource,
  14.                     'link': answer.photoSourceLink
  15.                 } %}
  17.                 {% if answer.embed %}
  18.                     <div class="embed-responsive embed-responsive-16by9 mb-15">
  19.                         <iframe class="embed-responsive__item" width="560" src="{{ answer.embed }}" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe>
  20.                     </div>
  21.                 {% endif %}
  23.                 <div class="flex items-center gap-x-2 lg:gap-x-5 sm-text-card">
  24.                     <input
  25.                         type="radio"
  26.                         id="poll-{{poll.id}}-question-{{question.id}}-checkbox-{{loop.index}}"
  27.                         name="poll-{{poll.id}}-question-{{question.id}}-checkbox"
  28.                         value="{{answer.id}}"
  29.                         class="peer hidden"
  30.                         {% if answer.required %}required data-value-missing="Pred pokračovaním musíte zaškrtnúť toto pole."{% endif %}
  31.                     />
  32.                     <label
  33.                         for="poll-{{poll.id}}-question-{{question.id}}-checkbox-{{loop.index}}"
  34.                         class="flex items-center justify-center
  35.                                w-15 h-15 lg:w-25 lg:h-25
  36.                                border border-frDarkBlue
  37.                                rounded-full cursor-pointer bg-white
  38.                                peer-checked:border-frDarkBlue
  39.                                after:content-['']
  40.                                after:block
  41.                                after:w-9 after:h-9 lg:after:w-15 lg:after:h-15
  42.                                after:rounded-full after:bg-frMagenta
  43.                                after:scale-0 peer-checked:after:scale-100
  44.                                after:transition"
  45.                     ></label>
  46.                     <label
  47.                         for="poll-{{poll.id}}-question-{{question.id}}-checkbox-{{loop.index}}"
  48.                         class="cursor-pointer"
  49.                     >
  50.                         {{ answer.answer }}
  51.                     </label>
  52.                 </div>
  54.                 {% if answer.description %}
  55.                     <div class="mt-15 text-center sm-text-card">
  56.                         {{ answer.description|raw }}
  57.                     </div>
  58.                 {% endif %}
  59.             </div>
  60.         {% endfor %}
  61.     </div>
  62. </div>