mirror of
https://github.com/GSA/notifications-admin.git
synced 2026-09-05 03:28:25 -04:00
d76648b67b
Includes: - JS to add a class to the heading when the link is focused - CSS to apply the enlarged focus style via a selector which uses that class - changes to the partial to hook in the JS to track focus on links and to tell the updateContent JS to persist the classes added between updates to the HTML
53 lines
2.1 KiB
HTML
53 lines
2.1 KiB
HTML
{% from "components/table.html" import list_table, field, right_aligned_field_heading, row_heading %}
|
|
|
|
<div class="ajax-block-container js-mark-focus-on-parent" data-classes-to-persist="js-child-has-focus">
|
|
{% for item in broadcasts|sort|reverse|list %}
|
|
<div class="keyline-block">
|
|
<div class="file-list govuk-!-margin-bottom-2">
|
|
<h2>
|
|
<a class="file-list-filename-large govuk-link govuk-link--no-visited-state" href="{{ url_for(view_broadcast_endpoint, service_id=current_service.id, broadcast_message_id=item.id) }}">{{ item.template.name }}</a>
|
|
</h2>
|
|
<div class="govuk-grid-row">
|
|
<div class="govuk-grid-column-one-half">
|
|
<span class="file-list-hint-large govuk-!-margin-bottom-2">
|
|
{{ item.content }}
|
|
</span>
|
|
</div>
|
|
<div class="govuk-grid-column-one-half file-list-status">
|
|
{% if item.status == 'pending-approval' %}
|
|
<p class="govuk-body govuk-!-margin-bottom-0 govuk-hint">
|
|
Waiting for approval
|
|
</p>
|
|
{% elif item.status == 'rejected' %}
|
|
<p class="govuk-body govuk-!-margin-bottom-0 govuk-hint">
|
|
{{ item.updated_at|format_date_human|title }} at {{ item.updated_at|format_time }}
|
|
</p>
|
|
{% elif item.status == 'broadcasting' %}
|
|
<p class="govuk-body govuk-!-margin-bottom-0 live-broadcast">
|
|
Live since {{ item.starts_at|format_datetime_relative }}
|
|
</p>
|
|
{% else %}
|
|
<p class="govuk-body govuk-!-margin-bottom-0 govuk-hint">
|
|
{{ item.starts_at|format_date_human|title }} at {{ item.starts_at|format_time }}
|
|
</p>
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
<ul class="area-list">
|
|
{% for area in item.areas %}
|
|
<li class="area-list-item area-list-item--unremoveable area-list-item--smaller">{{ area.name }}</li>
|
|
{% endfor %}
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
{% if loop.last %}
|
|
<div class="keyline-block">
|
|
</div>
|
|
{% endif %}
|
|
{% else %}
|
|
<p class="table-empty-message keyline-block govuk-!-padding-top-4">
|
|
{{ empty_message }}
|
|
</p>
|
|
{% endfor %}
|
|
</div>
|