darkhelm/notifications-admin
1
0
Fork 0
mirror of https://github.com/GSA/notifications-admin.git synced 2026-02-23 11:51:05 -05:00
Code Issues Packages Projects Releases Wiki Activity
Files
a088409dfeba315d3719e9e6d147ddf96cd75b0f
notifications-admin/app/templates/views/send.html

61 lines
2.2 KiB
HTML
Raw Normal View History

Added main nav to logged in pages
2015-12-14 16:53:07 +00:00
{% extends "withnav_template.html" %}
Add GOV.UK Design System style back links 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.
2019-04-29 11:44:05 +01:00
{% from "components/page-header.html" import page_header %}
Rename `submit_form` component to `page_footer` Submit form was - a confusing name in itself - not descriptive, because it also has an optional ‘back’ link This commit also puts this component in as many pages as possible, stripping out any hard-coded buttons and links. It replaces any usage of buttons for ‘back’, because these are links, not buttons (ie they don’t change any data).
2016-01-07 20:11:22 +00:00
{% from "components/page-footer.html" import page_footer %}
Add custom file upload to the send SMS page This is the only place we’re doing file upload at the moment.
2016-02-03 13:00:26 +00:00
{% from "components/file-upload.html" import file_upload %}
Add row numbers to tables When a table is showing the contents of a CSV file, it should look something like a spreadsheet. The minimally skeuomorphic way to do this is by adding row numbers. This commit doesn’t - make the row numbers monospace (it’s barely noticeable and doesn’t reflect what actual spreadsheets do) - make the first column heading ‘Row’ (again, doesn’t reflect how actual spreadsheets work, and takes up more valuable space)
2016-04-05 11:16:29 +01:00
{% from "components/table.html" import list_table, text_field, index_field, index_field_heading %}
Committing before merge
2023-08-30 11:07:38 -04:00
{% from "components/components/back-link/macro.njk" import usaBackLink %}
add a call on the send page as well
2024-08-26 09:02:39 -07:00
<script type="text/javascript" src="{{ asset_url('js/setTimezone.js') }}"></script>
Shell page for sending text messages
2015-11-30 14:17:54 +00:00
Include service name in page `<title>` In pages specific to a service (e.g. dashboard and sub pages) the title needs to distinguish which service it applies to. This is mainly to give context to screen reader users who could be managing multiple services. Implementing this uses template inheritance: `page_title` includes `per_page_title` includes `service_page_title` ‘GOV.UK Notify’ is inserted into every page title. Pages that set `service_page_title` get the service name inserted too.
2017-02-13 10:45:15 +00:00
{% block service_page_title %}
Replace recipient macros with formatters We prefer formatters now. Removing uses of the aliasing macro lets remove it entirely.
2021-01-06 13:02:09 +00:00
Upload a list of {{ 999|recipient_count_label(template.template_type) }}
Shell page for sending text messages
2015-11-30 14:17:54 +00:00
{% endblock %}
Move back link outside of main where it was used in the page header The page_header macro includes an optional back link. Since the page_header is always used inside `<main>`, where the back link should not be, this stops setting the back link in the page header and instead sets it in the new `backLink` block.
2021-07-30 18:23:12 +01:00
{% block backLink %}
Committing before merge
2023-08-30 11:07:38 -04:00
{{ usaBackLink({ "href": url_for('main.send_one_off', service_id=current_service.id, template_id=template.id) }) }}
Move back link outside of main where it was used in the page header The page_header macro includes an optional back link. Since the page_header is always used inside `<main>`, where the back link should not be, this stops setting the back link in the page header and instead sets it in the new `backLink` block.
2021-07-30 18:23:12 +01:00
{% endblock %}
Added main nav to logged in pages
2015-12-14 16:53:07 +00:00
{% block maincolumn_content %}
Updates to display of jobs This commit: - adds the template to the jobs page (and puts it at the top of the send SMS page) so that it consistently appears in the same place throughout the journey - put the real data about a job on the jobs page and on the dashboard
2016-02-03 14:43:16 +00:00
Move back link outside of main where it was used in the page header The page_header macro includes an optional back link. Since the page_header is always used inside `<main>`, where the back link should not be, this stops setting the back link in the page header and instead sets it in the new `backLink` block.
2021-07-30 18:23:12 +01:00
{{ page_header('Upload a list of {}'.format(999|recipient_count_label(template.template_type))) }}
Make the flow of using templates better For users who: - want to send messages from a template - want to edit templates For developers: - who need to get the ID of a template This commit mainly cleans up the choose template page so there are less options, and the options that are there are less wordy. This means: - moving ‘send yourself a test’ onto the send messages page, and making it button - stripping a lot of stuff out of the ‘send from API’ page, so it’s more obvious what the template ID is
2016-04-18 11:10:47 +01:00
Make send a test teach you how placeholders work This commit does two main things: - adds textboxes to the send yourself a test page, so you can replace ((name)) with ‘Chris’, or whatever your name is - rejigs the send page a bit to make it clearer what the CSV upload is for and how to use it The idea being that, since most users go into ‘send yourself a test’ first, it teaches them about how placeholders work by making them do the replacing themselves.
2016-05-05 08:39:36 +01:00
<div class="page-footer bottom-gutter">
{{file_upload(
form.file,
Remove set-to-string conversion from upload code Also changes the allowed_spreadsheet_file_extensions variable to allowed_file_extensions for consistency.
2020-12-17 10:47:52 +00:00
allowed_file_extensions=allowed_file_extensions,
Show flash instead of inline upload errors This has several advantages: - It gives us more room to explain the error and actions. This will be useful for upcoming work we want to do, which will add yet more validations for CSV uploads. - We already use a flash to show certain kinds of errors on these pages (just above). This is more consistent. - It's potentially more accessible. Previously the error and the button text used to be read out as a single sentence. Now the page reloads and reads the flash error alone. In theory we should show an error in both places, but this can be confusing on pages where there's only a single form control, and especially if the error is long.
2021-12-03 18:14:02 +00:00
button_text='Choose a file',
show_errors=False
Make send a test teach you how placeholders work This commit does two main things: - adds textboxes to the send yourself a test page, so you can replace ((name)) with ‘Chris’, or whatever your name is - rejigs the send page a bit to make it clearer what the CSV upload is for and how to use it The idea being that, since most users go into ‘send yourself a test’ first, it teaches them about how placeholders work by making them do the replacing themselves.
2016-05-05 08:39:36 +01:00
)}}
Make the flow of using templates better For users who: - want to send messages from a template - want to edit templates For developers: - who need to get the ID of a template This commit mainly cleans up the choose template page so there are less options, and the options that are there are less wordy. This means: - moving ‘send yourself a test’ onto the send messages page, and making it button - stripping a lot of stuff out of the ‘send from API’ page, so it’s more obvious what the template ID is
2016-04-18 11:10:47 +01:00
</div>
Consolidate page templates for emails + texts Use one page template for each of: - choosing a message template - adding recipients - checking an email message - looking at a job This commit consolidates the two templates into one, and adds logic to show the SMS message pattern or the email message pattern depending on the type of template. It also gives email templates a bit more width, because the body and the from address tend to be quite long.
2016-02-25 16:37:39 +00:00
Updating site to use USWDS styles (#509) * Updated header and footer * Updated fonts * Moved files around and updated gulpfile to correct the build process when it goes to production * Adjusted grid templating * Added images to assets * Update app/templates/components/uk_components/footer/template.njk Co-authored-by: Steven Reilly <stvnrlly@users.noreply.github.com>
2023-06-06 15:28:24 -04:00
<h2 class="font-body-lg">Your file needs to look like this example</h2>
Make the file type info take less space It doesn’t need to be a bullet point for each format. We tested this in research with DWP staff yesterday and it didn’t cause any problems. I also think it’s nicer for the UI to tell you what you need to do, rather than tell you what it can “accept”.
2017-05-11 12:19:38 +01:00
<p class="hint">
Save your file as a
<acronym title="Comma Separated Values">CSV</acronym>,
<acronym title="Tab Separated Values">TSV</acronym>,
<acronym title="Open Document Spreadsheet">ODS</acronym>,
or Microsoft Excel spreadsheet
</p>
Make the example spreadsheet scroll horizontally This replicates how we let large spreadsheets scroll horizontally. Pro: this looks nicer and is more usable Con: the code for this feels a bit fragile, especially the calling of `.maintainWidth` twice, ie as many times as a it takes to get stuff to render properly.
2018-11-01 15:31:14 +00:00
<div class="spreadsheet" data-module="fullscreen-table">
Don’t hide the example on the send page People missed this example because it was hidden in a `<details>` element. Perhaps the wording of the link wasn’t ideal, but we’ve tried two different varations of it (https://github.com/alphagov/notifications-admin/pull/640) Better not to hide things, than try to think of some text which will make people want to show them. Also adds some headings to chunk up this page a bit.
2016-07-01 07:08:55 +01:00
{% call(item, row_number) list_table(
example,
caption="Example",
caption_visible=False,
field_headings=[''] + column_headings
) %}
{{ index_field(row_number - 1) }}
{% for column in item %}
{{ text_field(column) }}
{% endfor %}
{% endcall %}
</div>
<p class="table-show-more-link">
Update dashboard and template flow (#514) * Updated header and footer * Moved files around and updated gulpfile to correct the build process when it goes to production * Updated fonts * Adjusted grid templating * Adding images to assets * Updated account pages, dashboard, and pages in message sending flow * Updated the styling for the landing pages in the account section once logged in
2023-06-08 13:12:00 -04:00
<a class="usa-link" href="{{ url_for('.get_example_csv', service_id=current_service.id, template_id=template.id) }}" download>Download this example (<abbr title="Comma separated values">CSV</abbr>)</a>
Don’t hide the example on the send page People missed this example because it was hidden in a `<details>` element. Perhaps the wording of the link wasn’t ideal, but we’ve tried two different varations of it (https://github.com/alphagov/notifications-admin/pull/640) Better not to hide things, than try to think of some text which will make people want to show them. Also adds some headings to chunk up this page a bit.
2016-07-01 07:08:55 +01:00
</p>
Show an example of a CSV on the ‘send’ page This should help: - understanding of what the CSV should contain - understanding what ‘download example’ will do
2016-04-01 15:36:35 +01:00
Fixing styling issues on the send message flow
2023-09-15 12:26:31 -04:00
<h2 class="font-body-lg margin-bottom-1">Your file will populate this template:<br><span class="font-body-lg">({{ template.name }})</span></h2>
Move the template preview to the bottom Having to scroll past the template preview is fine for a short text message, but annoying and confusing for a long letter. We even have people completely missing what the page is for, because they don’t go all the way to the bottom. This change makes more sense now that we have a page for previewing a template (not one long page with all the templates). You’re already pretty confident that you’re using the right template on this page. It’s just there as a double-check, and to help people understand where the columns in the example file are coming from.
2017-05-11 12:20:26 +01:00
{{ template|string }}
Fix incorrect heading on send page Accidentally reverted here: https://github.com/alphagov/notifications-admin/commit/f84797e6d538d1aec15c0ce324c8b76563236df7#diff-f7abe60b3b6c55859d983b3e19008838L14 Matches the link on the choose template page.
2016-04-05 11:20:52 +01:00
{% endblock %}
Reference in New Issue Copy Permalink