Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

MPP-3119: complaint notification disables mask #5045

Merged
19 changes: 19 additions & 0 deletions emails/templates/emails/direct_email_footer.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,19 @@
{% comment %}
Note that Django only loads strings from some Fluent files.
See privaterelay/ftl_bundles.py.
{% endcomment %}
{% load ftl %}
<!-- temporary footer -->
<table id="relay-email-footer" width="100%" bgcolor="#3D3D3D" style="max-width: 1200px; background: #3D3D3D; padding-top: 12px; padding-right: 12px; padding-left: 12px; padding-bottom:12px; margin-top: 30px; margin-bottom: 30px; width: 96%; border-radius: 6px;" align="center">
<tr>
<td width="40%" class="footer-block" style="line-height: 150%;" align="left">
<img width="155" src="{{ SITE_ORIGIN }}/static/images/email-images/relay-logo-emails-dark-bg.png" style="margin: 0 5px;" alt="warning icon"/>
</td>
<td class="footer-block" width="60%" style="line-height: 150%;" align="right">
<a class="container-link" href="{{ SITE_ORIGIN|add:"/premium/?utm_campaign=email_replies&utm_source=email&utm_medium=email" }}" style="margin-right: 30px; color: white;">{% ftlmsg 'upgrade-to-premium' %}</a>
<a class="container-link" href="{{ SITE_ORIGIN|add:"/accounts/profile/?utm_campaign=email_replies&utm_source=email&utm_medium=email" }}" style="color: white;">{% ftlmsg 'manage-your-masks' %}</a>
</td>
</tr>
</table>
</body>
</html>
173 changes: 173 additions & 0 deletions emails/templates/emails/direct_email_header.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,173 @@
{% comment %}
Note that Django only loads strings from some Fluent files.
See privaterelay/ftl_bundles.py.
{% endcomment %}
{% load ftl %}
<!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" lang="{{ request.LANGUAGE_CODE }}" dir="ltr">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width"/>
<style>
@font-face {
font-family: 'inter';
font-style: normal;
font-weight: 500;
src: local('Inter Regular'), local('Inter-Regular'), url(https://relay.firefox.com/fonts/Inter/Inter-Regular.4232a675a077.woff2?v=3.18) format('woff');
}
@font-face {
font-family: 'inter medium';
font-style: bold;
font-weight: 600;
src: local('Inter Medium'), local('Inter-Medium'), url(https://relay.firefox.com/fonts/Inter/Inter-Medium.027d14e7d35b.woff2?v=3.18) format('woff');
}
* {
box-sizing: border-box;
}
body {
font-family: 'inter', Arial, system-ui, sans-serif !important;
color: #3D3D3D;
}
a {
color: #0060DF;
text-decoration: underline !important;
}
a.container-link:hover,
a.container-link:focus,
a.container-link:active {
transition: all 0.2s ease;
}
a.container-link {
color: #FFFFFF;
font-size: 14px;
}

@media screen and (max-width: 1024px) {
.footer-block a {
display: block;
margin-right: 0 !important;
}
}

@media screen and (max-width: 768px) {
.footer-block {
display: block;
width: 100% !important;
text-align: left !important;
}
.footer-block a {
display: block;
}
img {
margin: 0 !important;
}
}

@media screen and (max-width: 480px) {
.header-block {
display: block;
width: 100% !important;
text-align: left !important;
}

.container-link {
margin-right: 0 !important;
}
}
</style>
</head>

<body id="relay-email" style="padding: 0; margin: 0;">
<!-- Yahoo mail won't render this stylesheet unless its under the body -->
<style>
@font-face {
font-family: 'inter';
font-style: normal;
font-weight: 500;
src: local('Inter Regular'), local('Inter-Regular'), url(https://relay.firefox.com/fonts/Inter/Inter-Regular.4232a675a077.woff2?v=3.18) format('woff');
}
@font-face {
font-family: 'inter medium';
font-style: bold;
font-weight: 600;
src: local('Inter Medium'), local('Inter-Medium'), url(https://relay.firefox.com/fonts/Inter/Inter-Medium.027d14e7d35b.woff2?v=3.18) format('woff');
}
* {
box-sizing: border-box;
}
body {
font-family: 'inter', Arial, system-ui, sans-serif !important;
color: #3D3D3D;
}
a {
color: #0060DF;
text-decoration: underline !important;
}
a.container-link:hover,
a.container-link:focus,
a.container-link:active {
transition: all 0.2s ease;
}
a.container-link {
color: #FFFFFF;
font-size: 14px;
}
/* AOL mail inserts weird div's with borders with this class name */
.qtd-body {
display: none !important;
}
.header-block .qtd-body {
padding: 0;
margin: 0;
border: none;
}

.footer-block .qtd-body {
display: none;
}

@media screen and (max-width: 1024px) {
.footer-block a {
display: block;
margin-right: 0 !important;
}
}

@media screen and (max-width: 768px) {
.footer-block {
display: block;
width: 100% !important;
text-align: left !important;
}
.footer-block a {
display: block;
}
img {
margin: 0 !important;
}
}

@media screen and (max-width: 480px) {
.header-block {
display: block;
width: 100% !important;
text-align: left !important;
}

.container-link {
margin-right: 0 !important;
}
}
</style>

<!-- temporary header -->
<table id="relay-email-header" width="100%" bgcolor="#3D3D3D" style="background: #3D3D3D; padding: 12px; margin-bottom: 30px; margin-top: 30px; width: 96%; border-radius: 6px; max-width: 1200px;" align="center">
<tr>
<td width="50%" class="header-block" style="line-height: 150%;" align="left">
<img width="155" src="{{ SITE_ORIGIN }}/static/images/email-images/relay-logo-emails-dark-bg.png" style="margin: 0 5px;" alt="warning icon"/>
</td>
<td width="50%" class="header-block" align="right">
<a class="container-link" href="{{ SITE_ORIGIN|add:"/premium/?utm_campaign=email_replies&utm_source=email&utm_medium=email" }}" style="color: white;">{% ftlmsg 'upgrade-for-more-protection' %}</a>
</td>
</tr>
</table>
32 changes: 32 additions & 0 deletions emails/templates/emails/disabled_mask_for_spam.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,32 @@
{% comment %}
Note that Django only loads strings from some Fluent files.
See privaterelay/ftl_bundles.py.
{% endcomment %}
{% load ftl %}
{% load email_extras %}
{% withftl bundle='privaterelay.ftl_bundles.main' language=language %}

{% include "emails/direct_email_header.html" %}

<table role="presentation" border="0" cellpadding="0" cellspacing="10px" style="padding: 60px 30px 120px 30px;" align="center">
<tr>
<td style="max-width:850px; padding-top: 0px; padding-bottom: 0px; text-align: center;">
{% with mask|striptags|urlencode as mask_url %}
jwhitlock marked this conversation as resolved.
Show resolved Hide resolved
<h2 style="font-family: inter medium, Arial, system-ui, sans-serif;">
<img width="18" src="{{ SITE_ORIGIN }}/static/images/email-images/warning.png" style="margin: 0 5px;" alt="warning icon"/>
{% ftlmsg 'relay-disabled-your-mask' %}
</h2>
<p style="line-height: 200%; margin-bottom: 30px; padding: 20px 60px 20px 60px">
{% ftlmsg 'relay-received-spam-complaint-html' mask=mask %} {% ftlmsg 'relay-disabled-your-mask-detail-html' mask=mask %}
</p>
<a href="{{ SITE_ORIGIN }}/accounts/profile/#{{ mask_url }}">
{% ftlmsg 're-enable-your-mask' %}
</a>
{% endwith %}
</td>
</tr>
</table>

{% include "emails/direct_email_footer.html" %}

{% endwithftl %}
11 changes: 11 additions & 0 deletions emails/templates/emails/disabled_mask_for_spam.txt
Original file line number Diff line number Diff line change
@@ -0,0 +1,11 @@
{% load ftl %}
{% load email_extras %}
{% withftl bundle='privaterelay.ftl_bundles.main' language=language %}
{% ftlmsg 'relay-disabled-your-mask' %}

{% ftlmsg 'relay-received-spam-complaint' mask=mask %} {% ftlmsg 'relay-disabled-your-mask-detail' mask=mask %}
{% with mask|striptags|urlencode as mask_url %}
{% ftlmsg 're-enable-your-mask' %}
{{ SITE_ORIGIN }}/accounts/profile/#{{ mask_url }}
{% endwith %}
{% endwithftl %}
Loading