darkhelm/notifications-admin
1
0
Fork 0
mirror of https://github.com/GSA/notifications-admin.git synced 2026-08-24 16:24:08 -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"> <p class="govuk-body">
To put a heading in your template, use a hash: To put a heading in your template, use a hash:
</p> </p>
<div> {{ govukInsetText({
{{ govukInsetText({ "text": "# This is a heading",
"text": "# This is a heading", "classes": "govuk-!-margin-top-0 govuk-!-margin-bottom-3"})
"classes": "govuk-!-margin-top-0 govuk-!-margin-bottom-3"}) }}
}}
</div>
<p class="govuk-body"> <p class="govuk-body">
To make bullet points, use asterisks: To make bullet points, use asterisks:
</p> </p>
<div> {{ govukInsetText({
{{ govukInsetText({ "html": "* point 1<br/>
"html": "* point 1<br/> * point 2<br/>
* point 2<br/> * point 3<br/>",
* point 3<br/>", "classes": "govuk-!-margin-top-0 govuk-!-margin-bottom-3"})
"classes": "govuk-!-margin-top-0 govuk-!-margin-bottom-3"}) }}
}}
</div>
<p class="govuk-body"> <p class="govuk-body">
To insert a page break, use three asterisks: To insert a page break, use three asterisks:
</p> </p>
<div> {{ govukInsetText({
{{ govukInsetText({ "html": "Content on page 1<br/>
"html": "Content on page 1<br/> <br/>
<br/> ***<br/>
***<br/> <br/>
<br/> Content on page 2<br/>",
Content on page 2<br/>", "classes": "govuk-!-margin-top-0 govuk-!-margin-bottom-3"})
"classes": "govuk-!-margin-top-0 govuk-!-margin-bottom-3"}) }}
}}
</div>

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

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

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

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

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 For example if you only want to show something to people who are under
18: 18:
</p> </p>
<div> {{ govukInsetText({
{{ govukInsetText({ "text": "((under18??Please get your application signed by a parent or
"text": "((under18??Please get your application signed by a parent or guardian.))",
guardian.))", "classes": "govuk-!-margin-top-0 govuk-!-margin-bottom-3"})
"classes": "govuk-!-margin-top-0 govuk-!-margin-bottom-3"}) }}
}}
</div>
<p class="govuk-body"> <p class="govuk-body">
For each person you send this message to, specify ‘yes’ or ‘no’ to For each person you send this message to, specify ‘yes’ or ‘no’ to
show or hide this content. 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"> <p class="bottom-gutter-1-3">
Use double brackets to personalise your message: Use double brackets to personalise your message:
</p> </p>
<div> {{ govukInsetText({
{{ govukInsetText({ "text": "Hello ((first name)), your reference is ((ref number))",
"text": "Hello ((first name)), your reference is ((ref number))", "classes": "govuk-!-margin-top-0"})
"classes": "govuk-!-margin-top-0"}) }}
}}
</div>

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

@@ -6,10 +6,9 @@
<p class="govuk-body"> <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. Use double brackets to add a placeholder field to your template. This will contain a secure link to download the document.
</p> </p>
<div> {{ govukInsetText({
{{ govukInsetText({ "text": "Download your document at: ((link_to_file))",
"text": "Download your document at: ((link_to_file))", "classes": "govuk-!-margin-top-0 govuk-!-margin-bottom-3"})
"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>.
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>.