Localize notification_utils to the API

This changeset pulls in all of the notification_utils code directly into the API and removes it as an external dependency.  We are doing this to cut down on operational maintenance of the project and will begin removing parts of it no longer needed for the API.

Signed-off-by: Carlo Costino <carlo.costino@gsa.gov>
This commit is contained in:
Carlo Costino
2024-05-16 10:17:45 -04:00
parent 4cdf8b2cb2
commit 99edc88197
129 changed files with 49913 additions and 263 deletions

View File

@@ -0,0 +1,12 @@
<div class="broadcast-message-wrapper">
<h2 class="broadcast-message-heading">
<svg class="broadcast-message-heading__icon" xmlns="http://www.w3.org/2000/svg" width="22" height="18.23" viewBox="0 0 17.5 14.5" aria-hidden="true">
<path fill-rule="evenodd"
fill="currentcolor"
d="M8.6 0L0 14.5h17.5L8.6 0zm.2 10.3c-.8 0-1.5.7-1.5 1.5s.7 1.5 1.5 1.5 1.5-.7 1.5-1.5c-.1-.8-.7-1.5-1.5-1.5zm1.3-4.5c.1.8-.3 3.2-.3 3.2h-2s-.5-2.3-.5-3c0 0 0-1.6 1.4-1.6s1.4 1.4 1.4 1.4z"
/>
</svg>
Emergency alert
</h2>
{{ body }}
</div>

View File

@@ -0,0 +1,39 @@
<div class="email-message">
<table class="email-message-meta">
<tbody>
{% if show_recipient %}
{% if from_name %}
<tr>
<th scope="row">From</th>
<td>
{{ from_name }}
</td>
</tr>
{% endif %}
{% if reply_to %}
<tr>
<th scope="row">Reply&nbsp;to</th>
<td>
{{ reply_to }}
</td>
</tr>
{% endif %}
<tr>
<th scope="row">To</th>
<td>
{{ recipient }}
</td>
</tr>
{% endif %}
<tr class="email-message-meta">
<th scope="row">Subject</th>
<td>
{{ subject }}
</td>
</tr>
</tbody>
</table>
<div class="email-message-body">
{{ body }}
</div>
</div>

View File

@@ -0,0 +1,252 @@
{% if complete_html %}
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta content="telephone=no" name="format-detection" /> <!-- need to add formatting for real phone numbers -->
<meta name="viewport" content="width=device-width" />
<title>{{ subject }}</title>
<style type="text/css">
@media only screen and (min-device-width: 581px) {
.content {
width: 580px !important;
}
}
body { margin:0 !important; }
div[style*="margin: 16px 0"] { margin:0 !important; }
</style>
<!--[if gte mso 9]>
<style type="text/css">
li {
margin-left: 4px !important;
}
table {
mso-table-lspace: 0pt;
mso-table-rspace: 0pt;
}
</style>
<![endif]-->
</head>
<body style="font-family: Helvetica, Arial, sans-serif;font-size: 16px;margin: 0;color:#0b0c0c;">
{% endif %}
<span style="display: none;font-size: 1px;color: #fff; max-height: 0;">{{ preheader }}…</span>
{% if govuk_banner %}
<table role="presentation" width="100%" style="border-collapse: collapse;min-width: 100%;width: 100% !important;" cellpadding="0" cellspacing="0" border="0">
<tr>
<td width="100%" height="53">
<!--[if (gte mso 9)|(IE)]>
<table role="presentation" width="580" align="center" cellpadding="0" cellspacing="0" border="0" style="border-collapse: collapse;width: 580px;">
<tr>
<td>
<![endif]-->
<table role="presentation" width="100%" style="border-collapse: collapse;max-width: 580px;" cellpadding="0" cellspacing="0" border="0" align="center">
<tr>
<td width="70" valign="middle">
<a href="https://beta.notify.gov" title="Go to the beta.notify.gov homepage" style="text-decoration: none;">
<table role="presentation" cellpadding="0" cellspacing="0" border="0" style="border-collapse: collapse;">
<tr>
<td style="font-size: 28px; line-height: 1.315789474; Margin-top: 4px; padding-left: 10px;">
<span style="
font-family: Public Sans Web,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;
font-weight: 600;
color:#0b0c0c;
text-decoration: none;
vertical-align:top;
display: inline-block;
">Notify.gov</span>
</td>
</tr>
</table>
</a>
</td>
</tr>
</table>
<!--[if (gte mso 9)|(IE)]>
</td>
</tr>
</table>
<![endif]-->
</td>
</tr>
</table>
<table
role="presentation"
class="content"
align="center"
cellpadding="0"
cellspacing="0"
border="0"
style="border-collapse: collapse;max-width: 580px; width: 100% !important;"
width="100%"
>
<tr>
<td width="10" height="10" valign="middle"></td>
<td>
<!--[if (gte mso 9)|(IE)]>
<table role="presentation" width="560" align="center" cellpadding="0" cellspacing="0" border="0" style="border-collapse: collapse;width: 560px;">
<tr>
<td height="10">
<![endif]-->
<table role="presentation" width="100%" cellpadding="0" cellspacing="0" border="0" style="border-collapse: collapse;">
<tr>
<td bgcolor="#1D70B8" width="100%" height="10"></td>
</tr>
</table>
<!--[if (gte mso 9)|(IE)]>
</td>
</tr>
</table>
<![endif]-->
</td>
<td width="10" valign="middle" height="10"></td>
</tr>
</table>
{% endif %}
{% if brand_banner %}
{% set brand_colour = brand_colour if brand_colour else '#0b0c0c' %}
<table role="presentation" width="100%" style="border-collapse: collapse;min-width: 100%;width: 100% !important;" cellpadding="0" cellspacing="0" border="0">
<tr>
<td width="100%" height="53" bgcolor="{{brand_colour}}">
<!--[if (gte mso 9)|(IE)]>
<table role="presentation" width="580" align="center" cellpadding="0" cellspacing="0" border="0" style="border-collapse: collapse;width: 580px;">
<tr>
<td>
<![endif]-->
<table role="presentation" width="100%" style="border-collapse: collapse;max-width: 580px;" cellpadding="0" cellspacing="0" border="0" align="center">
<tr>
{% if brand_logo %}
<td
width="70"
height="{% if brand_text -%} 27 {%- else -%} 54 {%- endif %}"
bgcolor="{{brand_colour}}"
valign="middle"
style="padding: 10px 0px 12px 10px"
>
<img
src="{{ brand_logo }}"
border="0"
style="display: block; border: 0;"
height="{% if brand_text -%} 27 {%- else -%} 54 {%- endif %}"
alt="{% if brand_text %}{% else -%}{{ brand_name }}{%- endif %}"
/>
</td>
{% endif %}
{% if brand_text %}
<td width="100%" bgcolor="{{brand_colour}}" valign="middle" align="left" style="padding: 14px 0 14px 10px">
<span style="
display: block;
font-family: Helvetica, Arial, sans-serif;
font-weight: 700;
font-size: 19px;
color: #ffffff;
line-height: 25px;
">
{{ brand_text }}
</span>
</td>
{% endif %}
</tr>
</table>
<!--[if (gte mso 9)|(IE)]>
</td>
</tr>
</table>
<![endif]-->
</td>
</tr>
</table>
{% endif %}
{% if brand_logo and not brand_banner %}
<table
role="presentation"
class="content"
align="center"
cellpadding="0"
cellspacing="0"
border="0"
style="border-collapse: collapse;max-width: 580px; width: 100% !important;"
width="100%"
>
<tr>
<td width="10" height="10" valign="middle"></td>
<td>
<!--[if (gte mso 9)|(IE)]>
<table role="presentation" width="560" align="center" cellpadding="0" cellspacing="0" border="0" style="border-collapse: collapse;width: 560px;">
<tr>
<td height="10">
<![endif]-->
<table role="presentation" width="100%" cellpadding="0" cellspacing="0" border="0" style="border-collapse: collapse">
<tr>
<td height="24" width="100%" colspan="2"><br /></td>
</tr>
<tr>
<td>
<table role="presentation" cellpadding="0" cellspacing="0" border="0" style="border-collapse: collapse">
<tr>
<td style="padding: 0 5px 0{% if brand_colour %} 7px; border-left: solid 2px {{ brand_colour }}{% else %} 0{% endif %}">
<img src="{{ brand_logo }}" style="display: block; border: 0" height="{% if brand_text -%} 27 {%- else -%} 54 {%- endif %}"
alt="{% if brand_text %}{% else -%}{{ brand_name }}{%- endif %}" />
</td>
<td width="100%" style="font-family: Helvetica, Arial, sans-serif; font-size: 18px; line-height: 23px;" valign="center">
{% if brand_text %}
{{ brand_text }}
{% endif %}
</td>
</tr>
</table>
</td>
</tr>
</table>
<!--[if (gte mso 9)|(IE)]>
</td>
</tr>
</table>
<![endif]-->
</td>
<td width="10" valign="middle" height="10"></td>
</tr>
</table>
{% endif %}
<table
role="presentation"
class="content"
align="center"
cellpadding="0"
cellspacing="0"
border="0"
style="border-collapse: collapse;max-width: 580px; width: 100% !important;"
width="100%"
>
<tr>
<td height="30"><br /></td>
</tr>
<tr>
<td width="10" valign="middle"><br /></td>
<td style="font-family: Helvetica, Arial, sans-serif; font-size: 19px; line-height: 1.315789474; max-width: 560px;">
<!--[if (gte mso 9)|(IE)]>
<table role="presentation" width="560" align="center" cellpadding="0" cellspacing="0" border="0" style="border-collapse: collapse;width: 560px;">
<tr>
<td style="font-family: Helvetica, Arial, sans-serif; font-size: 19px; line-height: 1.315789474;">
<![endif]-->
{{ body|safe }}
<!--[if (gte mso 9)|(IE)]>
</td>
</tr>
</table>
<![endif]-->
</td>
<td width="10" valign="middle"><br /></td>
</tr>
<tr>
<td height="30"><br /></td>
</tr>
</table>
{% if complete_html %}
</body>
</html>
{% endif %}

View File

@@ -0,0 +1,37 @@
{% for page_number in page_numbers %}
<div class="letter">
{% if loop.first and show_postage %}
<p class="letter-postage {{ postage_class_value }}">
Postage: {{ postage_description }}
</p>
{% endif %}
<img src="{{ image_url }}?page={{ page_number }}" alt="" loading="{{ 'eager' if loop.first else 'lazy' }}">
</div>
{% endfor %}
<div class="govuk-visually-hidden">
<h3>
Recipient address
</h3>
<ul>
{%- for line in address -%}
<li>{{ line }}</li>
{%- endfor -%}
</ul>
<h3>
Contact block
</h3>
<p>
{{ contact_block }}
</p>
<h3>
Content
</h3>
<p>
{{ date }}
</p>
<h3>
{{ subject }}
</h3>
{{ message }}
</div>

View File

@@ -0,0 +1,33 @@
</head>
<body>
<div id="logo">
{% if logo_file_name %}
<img src="{{admin_base_url}}/static/images/letter-template/{{logo_file_name}}" class="{{ logo_class }}"/>
{% endif %}
</div>
<div id="to">
<div id="mdi">
000_000_0000000_000000_0000_00000
</div>
<ul>
{%- for line in address -%}
<li>{{ line }}</li>
{%- endfor -%}
</ul>
</div>
<div id="barcode">
</div>
<div id="qrcode">
</div>
<div id="from">
{{ contact_block }}
</div>
<div id="content">
<p>
{{ date }}
</p>
<h1>{{ subject }}</h1>
{{ message }}
</div>
</body>
</html>

View File

@@ -0,0 +1,7 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>
Preview GOV.UK Notify
</title>

View File

@@ -0,0 +1,197 @@
{% set line_height = '16.0pt' %}
<style media="print">
@page {
size: A4 portrait;
margin: 15mm 10mm 15mm 15mm;
}
@page :first {
margin-top: 10mm;
}
@page {
@bottom-right {
content: "Page " counter(page) " of " counter(pages);
font-family: 'Nimbus Sans L';
font-size: 10pt;
text-align: right;
vertical-align: top;
}
}
body {
font-family: 'Nimbus Sans L', 'FreeSans', sans-serif;
font-size: 12.5pt;
line-height: {{ line_height }};
letter-spacing: 0.01em;
word-spacing: -0.04em;
margin: 0;
padding: 94mm 50mm 0 0;
}
#logo {
height: 18mm;
width: 70mm;
position: absolute;
top: 0;
left: 0;
}
#logo img.png {
display: block;
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
max-width: 100%;
max-height: 100%;
}
#logo img.svg {
display: block;
width: auto;
height: 100%;
max-width: 100%;
}
#to,
#from {
position: absolute;
}
#to {
width: 85mm;
max-height: 26.7mm;
left: 9.6mm;
bottom: 215.8mm;
font-size: 8pt;
line-height: 8.5pt;
text-transform: uppercase;
}
#to ul {
margin: 0;
padding: 0;
}
#to li {
display: block;
max-width: 100%;
overflow: hidden;
white-space: nowrap;
}
#from {
bottom: 199.8mm;
right: 0mm;
width: 71.2mm;
max-height: 132pt;
font-size: 10pt;
line-height: 12pt;
}
#mdi {
font-size: 6pt;
}
#barcode {
position: absolute;
top: 61mm;
left: 9.6mm;
width: 85mm; /* not width constrained */
height: 8.1mm;
background: url({{admin_base_url}}/static/images/letter-template/type29.png);
background-repeat: no-repeat;
background-size: auto 110%;
}
#qrcode {
position: absolute;
top: 26.9mm;
left: -10.6mm;
width: 6.7mm;
height: 6.7mm;
background: url({{admin_base_url}}/static/images/letter-template/qr1.png);
background-size: 100% 100%;
}
#content {
width: 137.5mm;
}
h1 {
font-size: 20pt;
line-height: 23.4pt;
font-weight: bold;
margin: 18.16pt 0 7.68pt 0;
}
h2 {
font-size: 14pt;
line-height: 17.4pt;
font-weight: bold;
margin: 0 0 {{ line_height }} 0;
}
h1 + h2 {
margin-top: 8.35pt;
}
p {
font-size: 12.5pt;
line-height: {{ line_height }};
margin: 0 0 {{ line_height }} 0;
orphans: 4;
}
#content ul,
#content ol {
font-size: 12.5pt;
line-height: {{ line_height }};
margin: 0 0 {{ line_height }} 0;
padding: 0 0 0 0.8em;
}
#content ol {
padding-left: 1.4em;
}
#content li {
margin: 0;
padding: 0;
}
#content ol ul,
#content ul ul {
margin: {{ line_height }} 0 0 0;
padding-left: 0;
list-style-type: disc;
}
#content ol ul {
margin-left: -0.6em;
}
#content *:last-child {
margin-bottom: 0;
}
.pagebreak {
page-break-after: always;
height: 0;
}
.placeholder {
display: inline;
background-color: #FD0;
background-image: url({{admin_base_url}}/static/images/letter-template/placeholder-mask-left.svg), url({{admin_base_url}}/static/images/letter-template/placeholder-mask-right.svg);
background-size: auto 150%, auto 150%;
background-position: 0 -0.17em, right -0.17em;
color: #000;
overflow-wrap: break-word;
word-wrap: break-word;
border-radius: 1.05em;
}
.placeholder-no-brackets {
display: inline;
background: #FD0;
color: #000;
overflow-wrap: break-word;
word-wrap: break-word;
padding-left: 3px;
padding-right: 3px;
border-radius: 1px;
text-transform: none;
}
.placeholder-conditional {
display: inline;
background: #FD0;
background-image: url({{admin_base_url}}/static/images/letter-template/placeholder-mask-left.svg), url({{admin_base_url}}/static/images/letter-template/placeholder-mask-right-conditional.svg);
background-size: auto 115%, 5mm 100%;
background-position: 0 -0.05em, right 0;
background-repeat: no-repeat, no-repeat;
color: #000;
overflow-wrap: break-word;
word-wrap: break-word;
border-radius: 1.05em;
}
</style>

View File

@@ -0,0 +1,17 @@
<style media="print">
#mdi,
#barcode,
#qrcode {
display: none;
}
@page :first {
@top-left-corner {
content: 'NOTIFY';
color: white;
font-family: 'arial';
font-size: 6pt;
}
}
</style>

View File

@@ -0,0 +1,3 @@
{% include 'letter_pdf/_head.jinja2' %}
{% include 'letter_pdf/_main_css.jinja2' %}
{% include 'letter_pdf/_body.jinja2' %}

View File

@@ -0,0 +1,4 @@
{% include 'letter_pdf/_head.jinja2' %}
{% include 'letter_pdf/_main_css.jinja2' %}
{% include 'letter_pdf/_print_only_css.jinja2' %}
{% include 'letter_pdf/_body.jinja2' %}

View File

@@ -0,0 +1,13 @@
{% if show_sender %}
<p class="sms-message-sender">
From: {{ sender }}
</p>
{% endif %}
{% if show_recipient %}
<p class="sms-message-recipient">
To: {{ recipient }}
</p>
{% endif %}
<div class="sms-message-wrapper">
{{ body }}
</div>