{% extends "base.html" %}

{% import "macros/form.html" as Form %}
{% import "macros/element.html" as Element %}

{% set title = _('Before you contact Civil Legal Advice') %}
{% block page_title %}{{ title }} - {{ super() }}{% endblock %}

{% block inner_content %}
  <h1>{{ title }}</h1>
  <p class="subtitle">
    {% trans %}So we can improve this service, we'd like to understand why you want to contact <abbr title="Civil Legal Advice">CLA</abbr>.{% endtrans %}
  </p>

  <form method="POST" action="{{ url_for('.reasons_for_contacting') }}" class="reasons-for-contacting-form">
    {{ form.csrf_token }}
    {{ form.referrer }}

    {{ Form.handle_errors(form) }}

    {% call Form.fieldset(form.reasons) %}
        <ul class="form-option-list" role="group" aria-labelledby="field-label-reasons">
            {% for reason in form.reasons %}
                <li>
                    <label class="radio-inline" for="{{ reason.id }}">
                      {{ reason }}
                      {{ reason.label.text }}
                    </label>
                </li>
            {% endfor %}
        </ul>
    {% endcall %}

    {{ Form.honeypot(form) }}
    {{ Form.actions(_('Continue to contact CLA')) }}
  </form>
{% endblock %}

{% block javascripts %}
  {{ super() }}
  <script>
    {% if referrer %}
      ga('send', 'event', 'skip-to-contact-referrer', '{{ referrer }}');
    {% endif %}
  </script>
{% endblock %}

{% extends "base.html" %}

{% import "macros/form.html" as Form %}
{% import "macros/element.html" as Element %}

{% set title = _('Before you contact Civil Legal Advice') %}
{% block page_title %}{{ title }} - {{ super() }}{% endblock %}

{% block inner_content %}
  <h1>{{ title }}</h1>
  <p class="subtitle">
    {% trans %}So we can improve this service, we'd like to understand why you want to contact <abbr title="Civil Legal Advice">CLA</abbr>.{% endtrans %}
  </p>

  <form method="POST" action="{{ url_for('.reasons_for_contacting') }}" class="reasons-for-contacting-form">
    {{ form.csrf_token }}
    {{ form.referrer }}

    {{ Form.handle_errors(form) }}

    {% call Form.fieldset(form.reasons) %}
      {{ Form.option_list(form.reasons) }}
    {% endcall %}

    {{ Form.honeypot(form) }}
    {{ Form.actions(_('Continue to contact CLA')) }}
  </form>
{% endblock %}

{% block javascripts %}
  {{ super() }}
  <script>
    {% if referrer %}
      ga('send', 'event', 'skip-to-contact-referrer', '{{ referrer }}');
    {% endif %}
  </script>
{% endblock %}

Use `option_list` marco for Reasons for contacting
FE: Use `option_list` marco for Reasons for contacting
