Indent HTML for Checkboxes

alphagov · Feb 8, 2024 · 8b1b5aa · 8b1b5aa
1 parent 14d5521
commit 8b1b5aa
Showing 1 changed file with 12 additions and 11 deletions.
diff --git a/packages/govuk-frontend/src/govuk/components/checkboxes/template.njk b/packages/govuk-frontend/src/govuk/components/checkboxes/template.njk
@@ -26,20 +26,20 @@
   {% set conditionalId = "conditional-" + itemId %}
   {%- if item.divider %}
     <div class="govuk-checkboxes__divider">{{ item.divider }}</div>
-  {%- else %}
+  {% else %}
     {% set isChecked = item.checked | default((item.value in params.values and item.checked != false) if params.values else false, true) %}
     {% set hasHint = true if item.hint.text or item.hint.html %}
     {% set itemHintId = itemId + "-item-hint" if hasHint else "" %}
     {% set itemDescribedBy = describedBy if not hasFieldset else "" %}
     {% set itemDescribedBy = (itemDescribedBy + " " + itemHintId) | trim %}
     <div class="govuk-checkboxes__item">
       <input class="govuk-checkboxes__input" id="{{ itemId }}" name="{{ itemName }}" type="checkbox" value="{{ item.value }}"
-      {{-" checked" if isChecked }}
-      {{-" disabled" if item.disabled }}
-      {%- if item.conditional.html %} data-aria-controls="{{ conditionalId }}"{% endif -%}
-      {%- if item.behaviour %} data-behaviour="{{ item.behaviour }}"{% endif -%}
-      {%- if itemDescribedBy %} aria-describedby="{{ itemDescribedBy }}"{% endif -%}
-      {{- govukAttributes(item.attributes) }}>
+        {{-" checked" if isChecked }}
+        {{-" disabled" if item.disabled }}
+        {%- if item.conditional.html %} data-aria-controls="{{ conditionalId }}"{% endif -%}
+        {%- if item.behaviour %} data-behaviour="{{ item.behaviour }}"{% endif -%}
+        {%- if itemDescribedBy %} aria-describedby="{{ itemDescribedBy }}"{% endif -%}
+        {{- govukAttributes(item.attributes) }}>
       {{ govukLabel({
         html: item.html,
         text: item.text,
@@ -58,9 +58,9 @@
       {% endif %}
     </div>
     {% if item.conditional.html %}
-      <div class="govuk-checkboxes__conditional {%- if not isChecked %} govuk-checkboxes__conditional--hidden{% endif %}" id="{{ conditionalId }}">
-        {{ item.conditional.html | safe }}
-      </div>
+    <div class="govuk-checkboxes__conditional {%- if not isChecked %} govuk-checkboxes__conditional--hidden{% endif %}" id="{{ conditionalId }}">
+      {{ item.conditional.html | safe | trim | indent(6) }}
+    </div>
     {% endif %}
   {% endif %}
 {% endmacro -%}
@@ -106,7 +106,8 @@
   </div>
 {% endset -%}
 
-<div class="govuk-form-group {%- if params.errorMessage %} govuk-form-group--error{% endif %} {%- if params.formGroup.classes %} {{ params.formGroup.classes }}{% endif %}" {{- govukAttributes(params.formGroup.attributes) }}>
+<div class="govuk-form-group {%- if params.errorMessage %} govuk-form-group--error{% endif %} {%- if params.formGroup.classes %} {{ params.formGroup.classes }}{% endif %}"
+  {{- govukAttributes(params.formGroup.attributes) }}>
 {% if hasFieldset %}
   {{ govukFieldset({
     describedBy: describedBy,