mirror of
https://github.com/GSA/notifications-admin.git
synced 2026-09-03 18:18:26 -04:00
21999f152a
The SVG used for the 'X' in the remove area button has 2 <g> (group) elements, one wrapping everything and one wrapping the two lines that make the cross. The first <g> isn't needed and means that the SVG ends up with 2 accessible names: 1. the <svg> element gets named with the text from the <title> because of it's aria-labelledby attribute referencing it 2. the first <g> gets named with the text from the <title> because the algorithm that gets the name looks for any descendent <title>s This removes the first <g> so only the accessible name for the <svg> gets announced.
72 lines
2.8 KiB
HTML
72 lines
2.8 KiB
HTML
{% extends "withnav_template.html" %}
|
|
{% from "components/button/macro.njk" import govukButton %}
|
|
{% from "components/page-header.html" import page_header %}
|
|
{% from "components/page-footer.html" import page_footer %}
|
|
{% from "views/broadcast/macros/area-map.html" import map %}
|
|
{% from "components/back-link/macro.njk" import govukBackLink %}
|
|
|
|
{% block service_page_title %}
|
|
Choose where to send this alert
|
|
{% endblock %}
|
|
|
|
{% block extra_stylesheets %}
|
|
{% include "views/broadcast/partials/area-map-stylesheets.html" %}
|
|
{% endblock %}
|
|
|
|
{% block extra_javascripts %}
|
|
{% include "views/broadcast/partials/area-map-javascripts.html" %}
|
|
{% endblock %}
|
|
|
|
{% block backLink %}
|
|
{{ govukBackLink({ "href": back_link }) }}
|
|
{% endblock %}
|
|
|
|
{% block maincolumn_content %}
|
|
|
|
{{ page_header("Choose where to send this alert") }}
|
|
|
|
{% for area in broadcast_message.areas %}
|
|
{% if loop.first %}
|
|
<ul class="area-list">
|
|
{% endif %}
|
|
<li class="area-list-item">
|
|
{{ area.name }}
|
|
<a class="area-list-item-remove govuk-button" data-module="govuk-button" role="button" href="{{ url_for('.remove_broadcast_area', service_id=current_service.id, broadcast_message_id=broadcast_message.id, area_slug=area.id) }}">
|
|
<svg id="area-list-item-remove__icon" width="11" height="11" viewbox="0 0 10 10" aria-labelledby="area__{{ loop.index }}" role="img" xmlns="http://www.w3.org/2000/svg">
|
|
<title id="area__{{ loop.index }}">Remove {{ area.name }}</title>
|
|
<g transform="rotate(45),translate(1, -6)">
|
|
<line stroke-width="1.75" id="svg_1" y2="0" x2="6" y1="12" x1="6" stroke="currentColor" fill="none"/>
|
|
<line stroke-width="1.75" id="svg_3" y2="6" x2="0" y1="6" x1="12" stroke="currentColor" fill="none"/>
|
|
</g>
|
|
</svg>
|
|
</a>
|
|
</li>
|
|
{% if loop.last %}
|
|
</ul>
|
|
{{ govukButton({
|
|
"element": "a",
|
|
"text": "Add another area",
|
|
"href": url_for('.choose_broadcast_library', service_id=current_service.id, broadcast_message_id=broadcast_message.id),
|
|
"classes": "govuk-button--secondary govuk-!-margin-bottom-5"
|
|
}) }}
|
|
{% endif %}
|
|
{% else %}
|
|
<p class="govuk-body">
|
|
{{ govukButton({
|
|
"element": "a",
|
|
"text": "Add broadcast areas",
|
|
"href": url_for('.choose_broadcast_library', service_id=current_service.id, broadcast_message_id=broadcast_message.id),
|
|
"classes": "govuk-button--secondary"
|
|
}) }}
|
|
</p>
|
|
{% endfor %}
|
|
|
|
{% if broadcast_message.areas %}
|
|
{{ map(broadcast_message) }}
|
|
<form action="{{ url_for('.preview_broadcast_message', service_id=current_service.id, broadcast_message_id=broadcast_message.id) }}" method="get" class="govuk-!-margin-top-1">
|
|
{{ page_footer('Preview this alert') }}
|
|
</form>
|
|
{% endif %}
|
|
|
|
{% endblock %}
|