darkhelm/notifications-admin
1
0
Fork 0
mirror of https://github.com/GSA/notifications-admin.git synced 2026-08-11 17:38:50 -04:00
Code Issues Packages Projects Releases Wiki Activity

Get rid of unecessary <div> and use the correct gutter class

Browse Source 
* We don't need the inset text to be inside `<div>` tags because the
component adds its own
* Replaced `bottom-gutter` with `govuk-!-margin-bottom-6` since this
change will be needed across the app at some point.
This commit is contained in:
Katie Smith
2021-02-23 13:14:07 +00:00
parent 9ee2c3946a
commit 792860085e
6 changed files with 46 additions and 61 deletions
Download Patch File Download Diff File Expand all files Collapse all files

42
app/templates/partials/templates/guidance-formatting-letters.html
View File

@@ -4,33 +4,27 @@
<p class="govuk-body">
To put a heading in your template, use a hash:
</p>
<div>
{{ govukInsetText({
"text": "# This is a heading",
"classes": "govuk-!-margin-top-0 govuk-!-margin-bottom-3"})
}}
</div>
{{ govukInsetText({
"text": "# This is a heading",
"classes": "govuk-!-margin-top-0 govuk-!-margin-bottom-3"})
}}
<p class="govuk-body">
To make bullet points, use asterisks:
</p>
<div>
{{ govukInsetText({
"html": "* point 1<br/>
* point 2<br/>
* point 3<br/>",
"classes": "govuk-!-margin-top-0 govuk-!-margin-bottom-3"})
}}
</div>
{{ govukInsetText({
"html": "* point 1<br/>
* point 2<br/>
* point 3<br/>",
"classes": "govuk-!-margin-top-0 govuk-!-margin-bottom-3"})
}}
<p class="govuk-body">
To insert a page break, use three asterisks:
</p>
<div>
{{ govukInsetText({
"html": "Content on page 1<br/>
<br/>
***<br/>
<br/>
Content on page 2<br/>",
"classes": "govuk-!-margin-top-0 govuk-!-margin-bottom-3"})
}}
</div>
{{ govukInsetText({
"html": "Content on page 1<br/>
<br/>
***<br/>
<br/>
Content on page 2<br/>",
"classes": "govuk-!-margin-top-0 govuk-!-margin-bottom-3"})
}}

20
app/templates/partials/templates/guidance-formatting.html
View File

@@ -4,13 +4,13 @@
<p class="bottom-gutter-1-3">
To put a title in your template, use a hash:
</p>
<div class="bottom-gutter">
<div class="govuk-!-margin-bottom-6">
{{ govukInsetText({"text": "# This is a title", "classes": "govuk-!-margin-top-0"})}}
</div>
<p class="bottom-gutter-1-3">
To make bullet points, use asterisks:
</p>
<div class="bottom-gutter">
<div class="govuk-!-margin-bottom-6">
{{ govukInsetText({
"html": "* point 1<br/>
* point 2<br/>
@@ -21,17 +21,15 @@
<p class="bottom-gutter-1-3">
To add inset text, use a caret:
</p>
<div class="bottom-gutter">
<div class="govuk-!-margin-bottom-6">
{{ govukInsetText({"text": "^ You must tell us if your circumstances change", "classes": "govuk-!-margin-top-0"})}}
</div>
<p class="bottom-gutter-1-3">
To add a horizontal line, use three dashes:
</p>
<div>
{{ govukInsetText({
"html": '<p class="govuk-body">First paragraph</p>
<p class="govuk-body" style="letter-spacing: 1px;">---</p>
<p class="govuk-body">Second paragraph</p>',
"classes": "govuk-!-margin-top-0"})
}}
</div>
{{ govukInsetText({
"html": '<p class="govuk-body">First paragraph</p>
<p class="govuk-body" style="letter-spacing: 1px;">---</p>
<p class="govuk-body">Second paragraph</p>',
"classes": "govuk-!-margin-top-0"})
}}

10
app/templates/partials/templates/guidance-links.html
View File

@@ -4,9 +4,7 @@
<p class="bottom-gutter-1-3">
Always use full URLs, starting with https://
</p>
<div>
{{ govukInsetText({
"text": "Apply now at https://www.gov.uk/example",
"classes": "govuk-!-margin-top-0"})
}}
</div>
{{ govukInsetText({
"text": "Apply now at https://www.gov.uk/example",
"classes": "govuk-!-margin-top-0"})
}}

12
app/templates/partials/templates/guidance-optional-content.html
View File

@@ -10,13 +10,11 @@
For example if you only want to show something to people who are under
18:
</p>
<div>
{{ govukInsetText({
"text": "((under18??Please get your application signed by a parent or
guardian.))",
"classes": "govuk-!-margin-top-0 govuk-!-margin-bottom-3"})
}}
</div>
{{ govukInsetText({
"text": "((under18??Please get your application signed by a parent or
guardian.))",
"classes": "govuk-!-margin-top-0 govuk-!-margin-bottom-3"})
}}
<p class="govuk-body">
For each person you send this message to, specify ‘yes’ or ‘no’ to
show or hide this content.

10
app/templates/partials/templates/guidance-personalisation.html
View File

@@ -6,9 +6,7 @@
<p class="bottom-gutter-1-3">
Use double brackets to personalise your message:
</p>
<div>
{{ govukInsetText({
"text": "Hello ((first name)), your reference is ((ref number))",
"classes": "govuk-!-margin-top-0"})
}}
</div>
{{ govukInsetText({
"text": "Hello ((first name)), your reference is ((ref number))",
"classes": "govuk-!-margin-top-0"})
}}

13
app/templates/partials/templates/guidance-send-a-document.html
View File

@@ -6,10 +6,9 @@
<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>
{{ 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>.
{{ govukInsetText({
"text": "Download your document at: ((link_to_file))",
"classes": "govuk-!-margin-top-0 govuk-!-margin-bottom-3"})
}}
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>.