mirror of
https://github.com/GSA/notifications-admin.git
synced 2026-07-28 03:39:29 -04:00
This commit copies the same ARIA attributes that are added to the character count component[1] in the GOV.UK Design System. This means that screen reader users will hear the count message when they stop typing. 1. https://design-system.service.gov.uk/components/character-count/
50 lines
2.0 KiB
HTML
50 lines
2.0 KiB
HTML
{% extends "withnav_template.html" %}
|
|
{% from "components/textbox.html" import textbox %}
|
|
{% from "components/page-header.html" import page_header %}
|
|
{% from "components/page-footer.html" import page_footer %}
|
|
{% from "components/form.html" import form_wrapper %}
|
|
|
|
{% block service_page_title %}
|
|
{{ heading_action }} text message template
|
|
{% endblock %}
|
|
|
|
{% block maincolumn_content %}
|
|
|
|
{{ page_header(
|
|
'{} text message template'.format(heading_action),
|
|
back_link=url_for('main.view_template', service_id=current_service.id, template_id=template.id) if template else url_for('main.choose_template', service_id=current_service.id, template_folder_id=template_folder_id)
|
|
) }}
|
|
|
|
{% 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"}
|
|
}) }}
|
|
{{ textbox(form.template_content, highlight_placeholders=True, width='1-1', rows=5) }}
|
|
{% if current_user.platform_admin %}
|
|
{{ form.process_type }}
|
|
{% endif %}
|
|
</div>
|
|
<div class="govuk-grid-column-full">
|
|
<div class="js-stick-at-bottom-when-scrolling">
|
|
{{ page_footer('Save') }}
|
|
<span class="template-list-selected-counter">
|
|
<div data-module="update-status" data-target="template_content" data-updates-url="{{ url_for('.count_content_length', service_id=current_service.id, template_type='sms') }}" aria-live="polite">
|
|
</div>
|
|
</span>
|
|
</div>
|
|
</div>
|
|
<aside class="govuk-grid-column-full">
|
|
{% include "partials/templates/guidance-personalisation.html" %}
|
|
{% include "partials/templates/guidance-optional-content.html" %}
|
|
{% include "partials/templates/guidance-links.html" %}
|
|
{% include "partials/templates/guidance-character-count.html" %}
|
|
</aside>
|
|
</div>
|
|
{% endcall %}
|
|
|
|
|
|
{% endblock %}
|