mirror of
https://github.com/GSA/notifications-admin.git
synced 2026-08-04 13:41:38 -04:00
cbcac14e7c
Having a grid in the click target stops the hint and status text being clickable. This removes it in favour using flexbox to position the elements in a similar way. Includes fallback styles for browsers that don't support flexbox that positions the child elements inline, laid out justified, to mimic the flexbox positioning of justify-content: space-between. Note: display is overriden on child items under flexbox so setting display: inline-block is ignored.
47 lines
1.9 KiB
HTML
47 lines
1.9 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 file-list--sectioned 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>
|
|
<span class="file-list-hint-large govuk-!-margin-bottom-2">
|
|
{{ item.content }}
|
|
</span>
|
|
{% if item.status == 'pending-approval' %}
|
|
<p class="govuk-body govuk-hint file-list-status">
|
|
Waiting for approval
|
|
</p>
|
|
{% elif item.status == 'rejected' %}
|
|
<p class="govuk-body govuk-hint file-list-status">
|
|
{{ item.updated_at|format_date_human|title }} at {{ item.updated_at|format_time }}
|
|
</p>
|
|
{% elif item.status == 'broadcasting' %}
|
|
<p class="govuk-body live-broadcast file-list-status">
|
|
Live since {{ item.starts_at|format_datetime_relative }}
|
|
</p>
|
|
{% else %}
|
|
<p class="govuk-body govuk-hint file-list-status">
|
|
{{ item.starts_at|format_date_human|title }} at {{ item.starts_at|format_time }}
|
|
</p>
|
|
{% endif %}
|
|
<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>
|