feat: let teamers fill in and read their questionnaire

templates/forms.html.twig

@@ -173,6 +173,38 @@
     {%- endif -%}
 {%- endblock pickup_choice_widget -%}
 
+{#
+ # A section of a questionnaire (App\Form\QuestionnaireType): its title and its questions. The
+ # questions' rows carry data-question-key and, when conditional, data-show-if, which
+ # assets/controllers/questionnaire_controller.js reads to show and hide them.
+ #}
+{%- block questionnaire_section_row -%}
+    <fieldset class="pb-8">
+        {%- if label is not same as(false) -%}
+            <legend class="text-xl font-bold pb-4">{{ label }}</legend>
+        {%- endif -%}
+        <div class="flex flex-col gap-y-6">
+            {%- for child in form -%}
+                {{- form_row(child) -}}
+            {%- endfor -%}
+        </div>
+    </fieldset>
+{%- endblock questionnaire_section_row -%}
+
+{# A 1-5 rating as a row of buttons, the radios themselves hidden. #}
+{%- block questionnaire_rating_widget -%}
+    <div class="flex gap-x-2" role="radiogroup">
+        {%- for child in form -%}
+            <label class="cursor-pointer">
+                {{- form_widget(child, { attr: { class: 'peer sr-only' } }) -}}
+                <span class="{{ html_classes('flex h-10 w-10 items-center justify-center rounded-md text-sm font-bold ring-1 ring-inset peer-checked:bg-primary peer-checked:text-white peer-checked:ring-primary peer-focus-visible:ring-2', { 'ring-red-500 text-red-500': errors|length, 'ring-gray-300 text-gray-900': not errors|length }) }}">
+                    {{- child.vars.label -}}
+                </span>
+            </label>
+        {%- endfor -%}
+    </div>
+{%- endblock questionnaire_rating_widget -%}
+
 {%- block birthday_widget -%}
     <div class="grid grid-cols-3 gap-x-1">
         {{ form_widget(form.children['day']) }}