Mirror
/
app-MAIL-temp
mirror of https://github.com/simple-login/app.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Activation email: use base template, change wording.

This commit is contained in:
Son NK 2019-11-20 21:51:12 +01:00
parent 8176447d05
commit 019aae24f3
3 changed files with 17 additions and 259 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
app/email_utils.py
View File

@ -31,8 +31,12 @@ def send_activation_email(email, name, activation_link):
send_by_postfix(
email,
f"{name}, just one more step to join SimpleLogin",
_render("activation.txt", name=name, activation_link=activation_link),
_render("activation.html", name=name, activation_link=activation_link),
_render(
"activation.txt", name=name, activation_link=activation_link, email=email
),
_render(
"activation.html", name=name, activation_link=activation_link, email=email
),
)

254
templates/emails/activation.html
View File

@ -1,249 +1,9 @@
<!doctype html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0;">
<meta name="format-detection" content="telephone=no"/>
{% extends "base.html" %}
<!-- Responsive Mobile-First Email Template by Konstantin Savchenko, 2015.
https://github.com/konsav/email-templates/ -->
{% block content %}
{{ render_text("Hi " + name + ",") }}
{{ render_text("Thank you for choosing SimpleLogin.") }}
{{ render_text("To get started, please confirm that <b>" + email + "</b> is your email address by clicking on the button below or use this link " + activation_link + " within 1 hour.") }}
{{ render_button("Verify", activation_link) }}
{% endblock %}
<style>
/* Reset styles */
body { margin: 0; padding: 0; min-width: 100%; width: 100% !important; height: 100% !important;}
body, table, td, div, p, a { -webkit-font-smoothing: antialiased; text-size-adjust: 100%; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; line-height: 100%; }
table, td { mso-table-lspace: 0pt; mso-table-rspace: 0pt; border-collapse: collapse !important; border-spacing: 0; }
img { border: 0; line-height: 100%; outline: none; text-decoration: none; -ms-interpolation-mode: bicubic; }
#outlook a { padding: 0; }
.ReadMsgBody { width: 100%; } .ExternalClass { width: 100%; }
.ExternalClass, .ExternalClass p, .ExternalClass span, .ExternalClass font, .ExternalClass td, .ExternalClass div { line-height: 100%; }
/* Rounded corners for advanced mail clients only */
@media all and (min-width: 560px) {
.container { border-radius: 8px; -webkit-border-radius: 8px; -moz-border-radius: 8px; -khtml-border-radius: 8px;}
}
/* Set color for auto links (addresses, dates, etc.) */
a, a:hover {
color: #127DB3;
}
.footer a, .footer a:hover {
color: #999999;
}
</style>
<!-- MESSAGE SUBJECT -->
<title>SimpleLogin | One more step</title>
</head>
<!-- BODY -->
<!-- Set message background color (twice) and text color (twice) -->
<body topmargin="0" rightmargin="0" bottommargin="0" leftmargin="0" marginwidth="0" marginheight="0" width="100%" style="border-collapse: collapse; border-spacing: 0; margin: 0; padding: 0; width: 100%; height: 100%; -webkit-font-smoothing: antialiased; text-size-adjust: 100%; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; line-height: 100%;
background-color: #F0F0F0;
color: #000000;"
bgcolor="#F0F0F0"
text="#000000">
<!-- SECTION / BACKGROUND -->
<!-- Set message background color one again -->
<table width="100%" align="center" border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse; border-spacing: 0; margin: 0; padding: 0; width: 100%;" class="background"><tr><td align="center" valign="top" style="border-collapse: collapse; border-spacing: 0; margin: 0; padding: 0;"
bgcolor="#F0F0F0">
<!-- WRAPPER -->
<!-- Set wrapper width (twice) -->
<table border="0" cellpadding="0" cellspacing="0" align="center"
width="560" style="border-collapse: collapse; border-spacing: 0; padding: 0; width: inherit;
max-width: 560px;" class="wrapper">
<tr>
<td align="center" valign="top" style="border-collapse: collapse; border-spacing: 0; margin: 0; padding: 0; padding-left: 6.25%; padding-right: 6.25%; width: 87.5%;
padding-top: 20px;
padding-bottom: 20px;">
<!-- PREHEADER -->
<!-- Set text color to background color -->
<div style="display: none; visibility: hidden; overflow: hidden; opacity: 0; font-size: 1px; line-height: 1px; height: 0; max-height: 0; max-width: 0;
color: #F0F0F0;" class="preheader">
SimpleLogin is the solution to protect your online identity. SimpleLogin strives to offer a simple experience for both users and partners/developers.
</div>
<!-- LOGO -->
<!-- Image text color should be opposite to background color. Set your url, image src, alt and title. Alt text should fit the image size. Real image size should be x2. -->
<a target="_blank" style="text-decoration: none;"
href="https://simplelogin.io"><img border="0" vspace="0" hspace="0"
src="https://static.simplelogin.io/transparent.png"
width="100" height="100"
alt="Logo" title="Logo" style="
color: #000000;
font-size: 10px; margin: 0; padding: 0; outline: none; text-decoration: none; -ms-interpolation-mode: bicubic; border: none; display: block;" /></a>
</td>
</tr>
<!-- End of WRAPPER -->
</table>
<!-- WRAPPER / CONTEINER -->
<!-- Set conteiner background color -->
<table border="0" cellpadding="0" cellspacing="0" align="center"
bgcolor="#FFFFFF"
width="560" style="border-collapse: collapse; border-spacing: 0; padding: 0; width: inherit;
max-width: 560px;" class="container">
<tr>
<td align="left" valign="top" style="border-collapse: collapse; border-spacing: 0; margin: 0; padding: 0; padding-left: 6.25%; padding-right: 6.25%; width: 87.5%; font-size: 17px; font-weight: 400; line-height: 160%;
padding-top: 25px;
color: #000000;
font-family: sans-serif;" class="paragraph">
Hi {{name}}!
</td>
</tr>
<tr>
<td align="left" valign="top" style="border-collapse: collapse; border-spacing: 0; margin: 0; padding: 0; padding-left: 6.25%; padding-right: 6.25%; width: 87.5%; font-size: 17px; font-weight: 400; line-height: 160%;
padding-top: 25px;
color: #000000;
font-family: sans-serif;" class="paragraph">
Our mission is to protect our online identity. This should be *simple*.
</td>
</tr>
<tr>
<td align="left" valign="top" style="border-collapse: collapse; border-spacing: 0; margin: 0; padding: 0; padding-left: 6.25%; padding-right: 6.25%; width: 87.5%; font-size: 17px; font-weight: 400; line-height: 160%;
padding-top: 25px;
color: #000000;
font-family: sans-serif;" class="paragraph">
To get started, we need to confirm your email address, so please click this link
to finish creating your account.
</td>
</tr>
<!-- BUTTON -->
<!-- Set button background color at TD, link/text color at A and TD, font family ("sans-serif" or "Georgia, serif") at TD. For verification codes add "letter-spacing: 5px;". -->
<tr>
<td align="center" valign="top" style="border-collapse: collapse; border-spacing: 0; margin: 0; padding: 0; padding-left: 1.25%; padding-right: 1.25%; width: 100%;
padding-top: 25px;
padding-bottom: 5px;" class="button"><a
href="{{ activation_link }}" target="_blank" style="text-decoration: underline;">
<table border="0" cellpadding="0" cellspacing="0" align="center" style="max-width: 540px; min-width: 120px; border-collapse: collapse; border-spacing: 0; padding: 0;"><tr><td align="center" valign="middle" style="padding: 12px 24px; margin: 0; text-decoration: underline; border-collapse: collapse; border-spacing: 0; border-radius: 4px; -webkit-border-radius: 4px; -moz-border-radius: 4px; -khtml-border-radius: 4px;"
bgcolor="#E9703E"><a target="_blank" style="text-decoration: underline;
color: #FFFFFF; font-family: sans-serif; font-size: 17px; font-weight: 400; line-height: 120%;"
href="{{ activation_link }}">
Activate
</a>
</td></tr></table></a>
</td>
</tr>
<tr>
<td align="left" valign="top" style="border-collapse: collapse; border-spacing: 0; margin: 0; padding: 0; padding-left: 6.25%; padding-right: 6.25%; width: 87.5%; font-size: 17px; font-weight: 400; line-height: 160%;
padding-top: 25px;
color: #000000;
font-family: sans-serif;" class="paragraph">
Cheers. <br>
<a href="https://twitter.com/nguyenkims">Son</a> - SimpleLogin founder.
</td>
</tr>
<!-- LINE -->
<!-- Set line color -->
<tr>
<td align="center" valign="top" style="border-collapse: collapse; border-spacing: 0; margin: 0; padding: 0; padding-left: 6.25%; padding-right: 6.25%; width: 87.5%;
padding-top: 25px;" class="line"><hr
color="#E0E0E0" align="center" width="100%" size="1" noshade style="margin: 0; padding: 0;" />
</td>
</tr>
<!-- PARAGRAPH -->
<!-- Set text color and font family ("sans-serif" or "Georgia, serif"). Duplicate all text styles in links, including line-height -->
<tr>
<td align="center" valign="top" style="border-collapse: collapse; border-spacing: 0; margin: 0; padding: 0; padding-left: 6.25%; padding-right: 6.25%; width: 87.5%; font-size: 17px; font-weight: 400; line-height: 160%;
padding-top: 20px;
padding-bottom: 25px;
color: #000000;
font-family: sans-serif;" class="paragraph">
Have a&nbsp;question? <a href="mailto:son@simplelogin.io" target="_blank" style="color: #127DB3; font-family: sans-serif; font-size: 17px; font-weight: 400; line-height: 160%;">son@simplelogin.io</a>
</td>
</tr>
<!-- End of WRAPPER -->
</table>
<!-- WRAPPER -->
<!-- Set wrapper width (twice) -->
<table border="0" cellpadding="0" cellspacing="0" align="center"
width="560" style="border-collapse: collapse; border-spacing: 0; padding: 0; width: inherit;
max-width: 560px;" class="wrapper">
<!-- SOCIAL NETWORKS -->
<!-- Image text color should be opposite to background color. Set your url, image src, alt and title. Alt text should fit the image size. Real image size should be x2 -->
<tr>
<td align="center" valign="top" style="border-collapse: collapse; border-spacing: 0; margin: 0; padding: 0; padding-left: 6.25%; padding-right: 6.25%; width: 87.5%;
padding-top: 25px;" class="social-icons"><table
width="256" border="0" cellpadding="0" cellspacing="0" align="center" style="border-collapse: collapse; border-spacing: 0; padding: 0;">
<tr>
<!-- ICON 1 -->
<td align="center" valign="middle" style="margin: 0; padding: 0; padding-left: 10px; padding-right: 10px; border-collapse: collapse; border-spacing: 0;"><a target="_blank"
href="https://github.com/simple-login/"
style="text-decoration: none;"><img border="0" vspace="0" hspace="0" style="padding: 0; margin: 0; outline: none; text-decoration: none; -ms-interpolation-mode: bicubic; border: none; display: inline-block;
color: #000000;"
alt="F" title="Github"
width="44" height="44"
src="https://static.simplelogin.io/icons/github132.png"></a></td>
<!-- ICON 2 -->
<td align="center" valign="middle" style="margin: 0; padding: 0; padding-left: 10px; padding-right: 10px; border-collapse: collapse; border-spacing: 0;"><a target="_blank"
href="https://dev.to/simplelogin"
style="text-decoration: none;"><img border="0" vspace="0" hspace="0" style="padding: 0; margin: 0; outline: none; text-decoration: none; -ms-interpolation-mode: bicubic; border: none; display: inline-block;
color: #000000;"
alt="T" title="Dev.to"
width="44" height="44"
src="https://static.simplelogin.io/icons/dev.to132.png"></a></td>
<!-- ICON 3 -->
<td align="center" valign="middle" style="margin: 0; padding: 0; padding-left: 10px; padding-right: 10px; border-collapse: collapse; border-spacing: 0;"><a target="_blank"
href="https://simplelogin.io"
style="text-decoration: none;"><img border="0" vspace="0" hspace="0" style="padding: 0; margin: 0; outline: none; text-decoration: none; -ms-interpolation-mode: bicubic; border: none; display: inline-block;
color: #000000;"
alt="G" title="Website"
width="44" height="44"
src="https://static.simplelogin.io/icons/website132.png"></a></td>
<!-- ICON 4 -->
<td align="center" valign="middle" style="margin: 0; padding: 0; padding-left: 10px; padding-right: 10px; border-collapse: collapse; border-spacing: 0;"><a target="_blank"
href="https://docs.simplelogin.io/"
style="text-decoration: none;"><img border="0" vspace="0" hspace="0" style="padding: 0; margin: 0; outline: none; text-decoration: none; -ms-interpolation-mode: bicubic; border: none; display: inline-block;
color: #000000;"
alt="I" title="Docs"
width="44" height="44"
src="https://static.simplelogin.io/icons/documentation132.png"></a></td>
</tr>
</table>
</td>
</tr>
<!-- FOOTER -->
<!-- Set text color and font family ("sans-serif" or "Georgia, serif"). Duplicate all text styles in links, including line-height -->
<tr>
<td align="center" valign="top" style="border-collapse: collapse; border-spacing: 0; margin: 0; padding: 0; padding-left: 6.25%; padding-right: 6.25%; width: 87.5%; font-size: 13px; font-weight: 400; line-height: 150%;
padding-top: 20px;
padding-bottom: 20px;
color: #999999;
font-family: sans-serif;" class="footer">
© 2019 SimpleLogin, France.
</td>
</tr>
<!-- End of WRAPPER -->
</table>
<!-- End of SECTION / BACKGROUND -->
</td></tr></table>
</body>
</html>

14
templates/emails/activation.txt
View File

@ -1,14 +1,8 @@
Hi {{name}}!
Hi {{name}},
Our mission is to protect our online identity. This should be *simple*.
Thank you for choosing SimpleLogin.
To get started, we need to confirm your email address, so please click this link
to finish creating your account.
To get started, please confirm that {{email}} is your email address using this link {{activation_link}} within 1 hour.
{{activation_link}}
Your feedbacks are very important to us. Please feel free to reply to this email to let us know any
of your suggestion!
Thanks!
Cheers,
Son - SimpleLogin founder.