app/views/_tailwind/devise/mailer/unlock_instructions.html.erb
<%# This template is generated automically by maizzle and should not be edited by hand! Go to "maizzle/src/templates". %>
<!DOCTYPE html>
<html lang="en" xmlns:v="urn:schemas-microsoft-com:vml">
<head>
<meta charset="utf-8">
<meta name="x-apple-disable-message-reformatting">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="format-detection" content="telephone=no, date=no, address=no, email=no, url=no">
<meta name="color-scheme" content="light dark">
<meta name="supported-color-schemes" content="light dark">
<!--[if mso]>
<noscript>
<xml>
<o:OfficeDocumentSettings xmlns:o="urn:schemas-microsoft-com:office:office">
<o:PixelsPerInch>96</o:PixelsPerInch>
</o:OfficeDocumentSettings>
</xml>
</noscript>
<style>
td,th,div,p,a,h1,h2,h3,h4,h5,h6 {font-family: "Segoe UI", sans-serif; mso-line-height-rule: exactly;}
a[x-apple-data-detectors] {
color: inherit !important;
text-decoration: none !important;
font-size: inherit !important;
font-family: inherit !important;
font-weight: inherit !important;
line-height: inherit !important;
}
</style>
<![endif]-->
<title>Unlock instructions</title>
<style>
img {
max-width: 100%;
vertical-align: middle;
line-height: 1;
border: 0
}
.hover-bg-dark-green:hover {
background-color: #054E4A !important
}
.hover-text-fuchsia-darker:hover {
color: #A6156F !important
}
.focus-bg-sun-yellow:focus {
background-color: #FFDC3E !important
}
.focus-outline:focus {
outline-style: solid !important
}
.focus-outline-sun-yellow:focus {
outline-color: #FFDC3E !important
}
@media (max-width: 600px) {
.sm-px-4 {
padding-left: 16px !important;
padding-right: 16px !important
}
}
@media (prefers-color-scheme: dark) {
.dark-mode-bg-_333 {
background-color: #333 !important
}
.dark-mode-text-white {
color: #ffffff !important
}
}
</style>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Fira+Sans:wght@100;200;300;400;500;600;700;800;900&family=Inter:wght@100;200;300;400;500;600;700;800;900&family=Merriweather:wght@300;400;500;700;900&display=fallback" rel="stylesheet">
</head>
<body class="dark-mode-bg-_333" style="margin: 0; width: 100%; background-color: #ffffff; padding: 0; -webkit-font-smoothing: antialiased; word-break: break-word">
<div style="display: none">
Your account has been locked due to an excessive number of unsuccessful sign in attempts.
 ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏
</div>
<div role="article" aria-roledescription="email" aria-label="Unlock instructions" lang="en">
<div class="sm-px-4 dark-mode-text-white" style="font-family: Fira Sans, ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif; font-size: 18px; color: #414860">
<table align="center" cellpadding="0" cellspacing="0" role="none">
<tr>
<td style="width: 552px; max-width: 100%">
<div style="text-align: center">
<h1 style="font-size: 36px">Oops. Seems like your account has been locked.</h1>
<div role="separator" style="line-height: 8px">‍</div>
<p>Your account has been locked due to an excessive number of unsuccessful sign in attempts.</p>
<div role="separator" style="line-height: 16px">‍</div>
<div>
<a href="<%= unlock_url(@resource, unlock_token: @token) %>" class="hover-bg-dark-green focus-outline-sun-yellow focus-outline" style="display: inline-block; background-color: #03827A; padding: 16px 32px; font-size: 18px; font-weight: 600; line-height: 1; color: #ffffff; text-decoration: none">
<!--[if mso]>
<i style="mso-font-width: -100%; letter-spacing: 32px; mso-text-raise: 30px" hidden> </i>
<![endif]-->
<span style="mso-text-raise: 16px">
Unlock my account
</span>
<!--[if mso]>
<i style="mso-font-width: -100%; letter-spacing: 32px;" hidden> </i>
<![endif]-->
</a>
</div>
<div role="separator" style="line-height: 64px">‍</div>
</div>
<div role="separator" style="background-color: #cbd5e1; height: 1px; line-height: 1px; margin: 24px 0">‍</div>
<p style="margin-top: 0">
This email was brought to you by the Planning Alerts team.
</p>
<p>
<strong>Planning Alerts</strong>
is a free service where anyone can find out what is being built and knocked down in their area.
</p>
<p>
The service
is run by the independent charity
<a href="https://www.oaf.org.au/" class="hover-text-fuchsia-darker focus-bg-sun-yellow" style="font-weight: 700; color: #CA3F94; text-decoration-line: underline">
OpenAustralia Foundation
</a>.
</p>
<p>
<a href="<%= documentation_contact_url %>" class="hover-text-fuchsia-darker focus-bg-sun-yellow" style="font-weight: 700; color: #CA3F94; text-decoration-line: underline;">
Contact us
</a>
if you have questions.
</p>
<div role="separator" style="line-height: 144px">‍</div>
</td>
</tr>
</table>
</div>
</div>
</body>
</html>