Use inset-text component for template formatting partials

This adds spacing classes from the design system where necessary to keep
the spacing looking the same.

It also replaces the `<aside>` elements with a `<div>` on the edit
template pages. The accessibility audit noted that these were inside a
`<main>` element, so screen readers may not be able to navigate the
elements correctly.
This commit is contained in:
Katie Smith
2021-02-23 13:02:50 +00:00
parent 79a0a14b38
commit 9ee2c3946a
10 changed files with 80 additions and 67 deletions
@@ -1,12 +1,15 @@
{% from "components/inset-text/macro.njk" import govukInsetText %}
<h2 class="heading-medium">
Send a document by email
</h2>
<p class="govuk-body">
Use double brackets to add a placeholder field to your template. This will contain a secure link to download the document.
</p>
<div class="panel panel-border-wide">
<p class="govuk-body">
Download your document at: ((link_to_file))
</p>
<div>
{{ govukInsetText({
"text": "Download your document at: ((link_to_file))",
"classes": "govuk-!-margin-top-0 govuk-!-margin-bottom-3"})
}}
</div>
Next, use the API to upload your document. Follow the instructions to send a document by email in the <a class="govuk-link govuk-link--no-visited-state" href="{{ url_for('main.documentation') }}">API documentation</a>.