[#789] Changed questionnaire markup to fieldset/legend

maykinmedia · Jan 9, 2023 · f6fe73a · f6fe73a
1 parent 11b582d
commit f6fe73a
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 2 deletions.
diff --git a/src/open_inwoner/scss/components/Questionnaire/Questionnaire.scss b/src/open_inwoner/scss/components/Questionnaire/Questionnaire.scss
@@ -1,4 +1,10 @@
 .questionnaire {
+  &__fieldset {
+    border: 0 solid transparent;
+    legend {
+      padding: 0;
+    }
+  }
   &__list {
     list-style: none;
     padding: var(--spacing-large) 0;

diff --git a/src/open_inwoner/templates/pages/questionnaire/questionnaire-step.html b/src/open_inwoner/templates/pages/questionnaire/questionnaire-step.html
@@ -17,7 +17,8 @@ <h1 class="h1" data-title="{{ form.instance.get_title }}" data-code="{{ form.ins
 
             {% step_indicator form.instance.depth form.instance.depth object_list=form.instance.get_tree_path object_list_str='question_subject' %}
 
-            <h4 class="h4" id="question">{{ form.instance.question }}</h4>
+            <fieldset class="questionnaire__fieldset">
+            <legend class="h4" id="question">{{ form.instance.question }}</legend>
 
             {% if form.instance.help_text %}
                 <p class="p p--compact">{{ form.instance.help_text }}</p>
@@ -53,7 +54,7 @@ <h4 class="h4" id="question">{{ form.instance.question }}</h4>
                     {% card_container products=form.instance.related_products.published small=True %}
                 {% endif %}
             {% endrender_form %}
-
+            </fieldset>
         {% endrender_column %}
     {% endrender_grid %}
 {% endblock %}