mirror of
https://github.com/GSA/notifications-admin.git
synced 2026-07-09 02:44:10 -04:00
The Design System has standardised on back links being at the top of the page, decorated with a small text-coloured arrow. I think this makes more sense than having them at the bottom, because it suggests, in some way, being able to go back before commiting to any of the forms on the page. Whereas the things at the bottom of the page should be performing actions on what’s in the page. The reason for making this change now is that it de-clutters the area around the green buttons. This was presenting a design challenge where multiple levels of interaction were happening in the same form. Moving these back links to the top of the page should mean that, in these complicated forms, there’s one fewer thing to compete for the user’s attention. I’ve componentised this into a `page_header` macro so that the change is easier to roll out and maintain.
109 lines
4.5 KiB
HTML
109 lines
4.5 KiB
HTML
{% extends "withnav_template.html" %}
|
||
{% from "components/banner.html" import banner %}
|
||
{% from "components/ajax-block.html" import ajax_block %}
|
||
{% from "components/message-count-label.html" import message_count_label %}
|
||
{% from "components/page-header.html" import page_header %}
|
||
{% from "components/page-footer.html" import page_footer %}
|
||
|
||
{% block service_page_title %}
|
||
{{ message_count_label(1, template.template_type, suffix='') | capitalize }}
|
||
{% endblock %}
|
||
|
||
{% block maincolumn_content %}
|
||
|
||
{{ page_header(
|
||
message_count_label(1, template.template_type, suffix='') | capitalize,
|
||
back_link=None if request.args.get('help') == '0' else url_for('main.view_notifications', service_id=current_service.id, message_type=template.template_type)
|
||
) }}
|
||
|
||
<p>
|
||
{% if is_precompiled_letter %}
|
||
Provided as PDF
|
||
{% else %}
|
||
{% if help %}
|
||
‘{{ template.name }}’
|
||
{% else %}
|
||
<a href="{{ url_for('.view_template', service_id=current_service.id, template_id=template.id) }}">‘{{ template.name }}’</a>
|
||
{% endif %}
|
||
was sent
|
||
{% endif %}
|
||
{% if job and job.original_file_name != 'Report' %}
|
||
{% set destination =
|
||
{'letter': 'an address', 'email': 'an email address', 'sms': 'a phone number'} %}
|
||
to {{ destination[template.template_type] }} from
|
||
<a href="{{ url_for('.view_job', service_id=current_service.id, job_id=job.id) }}">{{ job.original_file_name }}</a>
|
||
{% elif created_by %}
|
||
by {{ created_by.name }}
|
||
{% endif %}
|
||
on {{ created_at|format_datetime_short }}
|
||
</p>
|
||
|
||
{% if template.template_type == 'letter' %}
|
||
{% if notification_status in ('permanent-failure', 'cancelled') %}
|
||
<p class="notification-status-cancelled">
|
||
Cancelled {{ updated_at|format_datetime_short }}
|
||
</p>
|
||
{% elif notification_status == 'validation-failed' %}
|
||
<p class="notification-status-cancelled">
|
||
Validation failed – content is outside the printable area
|
||
</p>
|
||
{% elif notification_status == 'technical-failure' %}
|
||
<p class="notification-status-cancelled">
|
||
Technical failure – Notify will resend once the team have
|
||
fixed the problem
|
||
</p>
|
||
{% else %}
|
||
{% if sent_with_test_key %}
|
||
{% if is_precompiled_letter %}
|
||
<p>
|
||
This letter passed our checks, but we will not print it because you used a test key.
|
||
</p>
|
||
{% else %}
|
||
<p>
|
||
We will not print this letter because you used a test key.
|
||
</p>
|
||
{% endif %}
|
||
{% else %}
|
||
<p>
|
||
{{ letter_print_day }}
|
||
</p>
|
||
<p>
|
||
Estimated delivery date: {{ estimated_letter_delivery_date|string|format_date_short }}
|
||
</p>
|
||
{% endif %}
|
||
{% endif %}
|
||
{% endif %}
|
||
|
||
<div class="{{ 'letter-sent' if template.template_type == 'letter' else '' }}">
|
||
{{ template|string }}
|
||
</div>
|
||
|
||
{% if template.template_type == 'letter' %}
|
||
<div class="js-stick-at-bottom-when-scrolling">
|
||
<div class="page-footer">
|
||
{% if show_cancel_button %}
|
||
<span class="page-footer-delete-link page-footer-delete-link-without-button">
|
||
<a href="{{ url_for('main.cancel_letter', service_id=current_service.id, notification_id=notification_id) }}">Cancel sending this letter</a>
|
||
</span>
|
||
{% else %}
|
||
<div> </div>
|
||
{% endif %}
|
||
<a class="page-footer-right-aligned-link" href="{{ url_for('main.view_letter_notification_as_preview', service_id=current_service.id, notification_id=notification_id, filetype='pdf') }}" download>Download as a PDF</a>
|
||
</div>
|
||
</div>
|
||
{% elif template.template_type == 'email' %}
|
||
<div class="js-stick-at-bottom-when-scrolling">
|
||
{{ ajax_block(partials, updates_url, 'status', finished=finished) }}
|
||
</div>
|
||
{% elif template.template_type == 'sms' %}
|
||
{{ ajax_block(partials, updates_url, 'status', finished=finished) }}
|
||
{% endif %}
|
||
|
||
{% if current_user.has_permissions('send_messages') and current_user.has_permissions('view_activity') and template.template_type == 'sms' and can_receive_inbound %}
|
||
<p>
|
||
<a href="{{ url_for('.conversation', service_id=current_service.id, notification_id=notification_id, _anchor='n{}'.format(notification_id)) }}">See all text messages sent to this phone number</a>
|
||
</p>
|
||
{% endif %}
|
||
|
||
{% endblock %}
|