{% extends "withnav_template.html" %}
{% from "components/form.html" import form_wrapper %}
{% from "components/page-header.html" import page_header %}
{% from "components/page-footer.html" import page_footer %}
{% from "components/textbox.html" import textbox %}
{% from "components/back-link/macro.njk" import govukBackLink %}

{% block service_page_title %}
  New alert
{% endblock %}


{% block backLink %}
  {{ govukBackLink({ "href": url_for('.new_broadcast', service_id=current_service.id) }) }}
{% endblock %}

{% block maincolumn_content %}

  {{ page_header('New alert')}}

  {% call form_wrapper() %}
    <div class="govuk-grid-row">
      <div class="govuk-grid-column-two-thirds">
        {{ form.name(param_extensions={
          "classes": "govuk-!-width-full",
          "hint": {"text": "Your recipients will not see this"},
          "label": {"text": "Title"}
        }) }}
        {{ textbox(
          form.template_content,
          highlight_placeholders=False,
          autosize=True,
          width='1-1',
          rows=5,
          extra_form_group_classes='govuk-!-margin-bottom-2'
        ) }}
      </div>
      <div class="govuk-grid-column-full">
        <div class="template-content-count">
          <div data-module="update-status" data-target="template_content" data-updates-url="{{ url_for('.count_content_length', service_id=current_service.id, template_type='broadcast') }}" aria-live="polite">
            &nbsp;
          </div>
        </div>
        {{ page_footer('Continue') }}
      </div>
    </div>
  {% endcall %}

{% endblock %}