{% extends "withnav_template.html" %}
{% from "components/radios.html" import radios %}
{% from "components/live-search.html" import live_search %}
{% from "components/page-header.html" import page_header %}
{% from "components/page-footer.html" import page_footer %}
{% from "components/form.html" import form_wrapper %}

{% set page_title = "Set letter branding" %}

{% block service_page_title %}
  {{ page_title }}
{% endblock %}

{% block maincolumn_content %}

  {{ page_header(
    page_title,
    back_link=url_for('.service_settings', service_id=current_service.id)
  ) }}
  {% call form_wrapper(data_kwargs={'preview-type': 'letter'}) %}
    <div class="govuk-grid-row">
      <div class="govuk-grid-column-full preview-pane">
      </div>
    </div>
    <div class="govuk-grid-row">
      <div class="govuk-grid-column-full">
        {{ live_search(
          target_selector='.multiple-choice',
          show=True,
          form=search_form,
          label='Search by name',
          autofocus=True
        ) }}
        {{ radios(form.branding_style, hide_legend=True) }}
      </div>
    </div>
    <div class="js-stick-at-bottom-when-scrolling">
      {{ page_footer('Preview') }}
    </div>
  {% endcall %}

{% endblock %}

{% extends "withnav_template.html" %}
{% from "components/live-search.html" import live_search %}
{% from "components/page-header.html" import page_header %}
{% from "components/page-footer.html" import page_footer %}
{% from "components/form.html" import form_wrapper %}

{% set page_title = "Set letter branding" %}

{% block service_page_title %}
  {{ page_title }}
{% endblock %}

{% block maincolumn_content %}

  {{ page_header(
    page_title,
    back_link=url_for('.service_settings', service_id=current_service.id)
  ) }}
  {% call form_wrapper(data_kwargs={'preview-type': 'letter'}) %}
    <div class="govuk-grid-row">
      <div class="govuk-grid-column-full preview-pane">
      </div>
    </div>
    <div class="govuk-grid-row">
      <div class="govuk-grid-column-full">
        {{ live_search(
          target_selector='.multiple-choice',
          show=True,
          form=search_form,
          label='Search by name',
          autofocus=True
        ) }}
        {{ form.branding_style }}
      </div>
    </div>
    <div class="js-stick-at-bottom-when-scrolling">
      {{ page_footer('Preview') }}
    </div>
  {% endcall %}

{% endblock %}

Convert radios on set letter branding page
Convert radios on set letter branding page
