storj/web/satellite/static/emails/Forgot.html
Jeremy Wharton 3720afb81b web/satellite: Update emails to be consistent with deployed code
Update the forgot password, invite, and welcome emails to be
cosistent with deployed code. This change is part of an ongoing
effort to remove code from the branding repo.

Change-Id: I6edb6811904552c1cf7761b96bc9aa879c2eb154
2021-07-26 22:49:28 +00:00

663 lines
32 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional //EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<!--[if IE]><html xmlns="http://www.w3.org/1999/xhtml" class="ie"><![endif]--><!--[if !IE]><!-->
<html style="margin: 0;padding: 0;" xmlns="http://www.w3.org/1999/xhtml"><!--<![endif]--><head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<!--[if !mso]><!--><meta http-equiv="X-UA-Compatible" content="IE=edge" /><!--<![endif]-->
<meta name="viewport" content="width=device-width" /><style type="text/css">
@media only screen and (min-width: 620px) {
.wrapper {
min-width: 600px !important
}
.wrapper h1 {}
.wrapper h1 {
font-size: 64px !important;
line-height: 63px !important
}
.wrapper h2 {}
.wrapper h2 {
font-size: 30px !important;
line-height: 38px !important
}
.wrapper h3 {}
.wrapper h3 {
font-size: 22px !important;
line-height: 31px !important
}
.wrapper .size-10 {
font-size: 10px !important;
line-height: 18px !important
}
.wrapper .size-12 {
font-size: 12px !important;
line-height: 19px !important
}
.wrapper .size-16 {
font-size: 16px !important;
line-height: 24px !important
}
.wrapper .size-20 {
font-size: 20px !important;
line-height: 28px !important
}
.wrapper .size-40 {
font-size: 40px !important;
line-height: 47px !important
}
}
</style>
<style type="text/css">
body {
margin: 0;
padding: 0;
}
table {
border-collapse: collapse;
table-layout: fixed;
}
* {
line-height: inherit;
}
[x-apple-data-detectors],
[href^="tel"],
[href^="sms"] {
color: inherit !important;
text-decoration: none !important;
}
.wrapper .footer__share-button a:hover,
.wrapper .footer__share-button a:focus {
color: #ffffff !important;
}
.btn a:hover,
.btn a:focus,
.footer__share-button a:hover,
.footer__share-button a:focus,
.email-footer__links a:hover,
.email-footer__links a:focus {
opacity: 0.8;
}
.layout,
.column {
transition: width 0.25s ease-in-out, max-width 0.25s ease-in-out;
}
.preheader td {
padding-bottom: 8px;
}
.layout {
max-width: 400px !important;
-fallback-width: 95% !important;
width: calc(100% - 20px) !important;
}
.column {
max-width: 400px !important;
width: 100% !important;
}
.ie {
width: 100%;
}
[owa] .column div,
[owa] .column button {
display: block !important;
}
.ie .column,
[owa] .column,
.ie {
display: table-cell;
float: none !important;
vertical-align: top;
}
.ie .layout,
[owa] .layout,
.ie .one-col .column,
[owa] .one-col .column {
max-width: 600px !important;
width: 600px !important;
}
.ie .two-col .column,
[owa] .two-col .column {
max-width: 300px !important;
width: 300px !important;
}
.ie .three-col .column,
[owa] .three-col .column {
max-width: 200px !important;
width: 200px !important;
}
.ie .two-col.has-gutter .column,
[owa] .two-col.x_has-gutter .column {
max-width: 290px !important;
width: 290px !important;
}
.ie .three-col.has-gutter .column,
[owa] .three-col.x_has-gutter .column {
max-width: 188px !important;
width: 188px !important;
}
.ie .has-gutter .wide,
[owa] .has-gutter .wide {
max-width: 394px !important;
width: 394px !important;
}
.ie .two-col.has-gutter.has-border .column,
[owa] .two-col.x_has-gutter.x_has-border .column {
max-width: 292px !important;
width: 292px !important;
}
.ie .three-col.has-gutter.has-border .column,
[owa] .three-col.x_has-gutter.x_has-border .column,
.ie .has-gutter.has-border .narrow,
[owa] .has-gutter.x_has-border .narrow {
max-width: 190px !important;
width: 190px !important;
}
.ie .has-gutter.has-border .wide,
[owa] .has-gutter.x_has-border .wide {
max-width: 396px !important;
width: 396px !important;
}
.ie .fixed-width .layout__inner {
border-left: 0 none white !important;
border-right: 0 none white !important;
}
.layout-fixed-width,
.mso .layout-full-width {
background-color: #ffffff;
}
@media only screen and (min-width: 620px) {
.column {
display: table-cell;
Float: none !important;
vertical-align: top;
}
.layout,
.one-col .column {
max-width: 600px !important;
width: 600px !important;
}
.two-col .column {
max-width: 300px !important;
width: 300px !important;
}
.three-col .column,
.column.narrow {
max-width: 200px !important;
width: 200px !important;
}
.column.wide {
width: 400px !important;
}
.two-col.has-gutter .column,
.two-col.ecxhas-gutter .column {
max-width: 290px !important;
width: 290px !important;
}
.three-col.has-gutter .column,
.three-col.ecxhas-gutter .column,
.has-gutter .narrow {
max-width: 188px !important;
width: 188px !important;
}
.has-gutter .wide {
max-width: 394px !important;
width: 394px !important;
}
.two-col.has-gutter.has-border .column,
.two-col.ecxhas-gutter.ecxhas-border .column {
max-width: 292px !important;
width: 292px !important;
}
.three-col.has-gutter.has-border .column,
.three-col.ecxhas-gutter.ecxhas-border .column,
.has-gutter.has-border .narrow,
.has-gutter.ecxhas-border .narrow {
max-width: 190px !important;
width: 190px !important;
}
.has-gutter.has-border .wide,
.has-gutter.ecxhas-border .wide {
max-width: 396px !important;
width: 396px !important;
}
}
@media (max-width: 321px) {
.fixed-width.has-border .layout__inner {
border-width: 1px 0 !important;
}
.layout,
.column {
min-width: 320px !important;
width: 320px !important;
}
}
.mso div {
border: 0 none white !important;
}
.mso .w560 .divider {
Margin-left: 260px !important;
Margin-right: 260px !important;
}
.mso .w360 .divider {
Margin-left: 160px !important;
Margin-right: 160px !important;
}
.mso .w260 .divider {
Margin-left: 110px !important;
Margin-right: 110px !important;
}
.mso .w160 .divider {
Margin-left: 60px !important;
Margin-right: 60px !important;
}
.mso .w354 .divider {
Margin-left: 157px !important;
Margin-right: 157px !important;
}
.mso .w250 .divider {
Margin-left: 105px !important;
Margin-right: 105px !important;
}
.mso .w148 .divider {
Margin-left: 54px !important;
Margin-right: 54px !important;
}
.mso .size-10,
.ie .size-10 {
font-size: 10px !important;
line-height: 18px !important;
}
.mso .size-12,
.ie .size-12 {
font-size: 12px !important;
line-height: 19px !important;
}
.mso .size-16,
.ie .size-16 {
font-size: 16px !important;
line-height: 24px !important;
}
.mso .size-20,
.ie .size-20 {
font-size: 20px !important;
line-height: 28px !important;
}
.mso .size-40,
.ie .size-40 {
font-size: 40px !important;
line-height: 47px !important;
}
</style>
<!--[if !mso]><!-->
<style type="text/css">
@import url(https://fonts.googleapis.com/css?family=Montserrat:400,700,400italic);
</style>
<link href="https://fonts.googleapis.com/css?family=Montserrat:400,700,400italic" rel="stylesheet" type="text/css" />
<!--<![endif]-->
<style type="text/css">
body {
background-color: #fff
}
.logo a:hover,
.logo a:focus {
color: #859bb1 !important
}
.mso h1,
.ie h1 {}
.mso h1,
.ie h1 {
font-size: 64px !important;
line-height: 63px !important
}
.mso h2,
.ie h2 {}
.mso h2,
.ie h2 {
font-size: 30px !important;
line-height: 38px !important
}
.mso h3,
.ie h3 {}
.mso h3,
.ie h3 {
font-size: 22px !important;
line-height: 31px !important
}
.mso .footer__share-button p {}
.mso .footer__share-button p {
font-family: sans-serif
}
</style>
<meta name="robots" content="noindex,nofollow" />
<meta property="og:title" content="My First Campaign" />
</head>
<!--[if mso]>
<body class="mso">
<![endif]-->
<!--[if !mso]><!-->
<body class="half-padding" style="margin: 0;padding: 0;-webkit-text-size-adjust: 100%;">
<!--<![endif]-->
<table class="wrapper" style="border-collapse: collapse;table-layout: fixed;min-width: 320px;width: 100%;background-color: #fff;" cellpadding="0" cellspacing="0" role="presentation">
<tbody>
<tr>
<td>
<div role="section">
<div class="layout one-col fixed-width"
style="margin: 0 auto;max-width: 600px;min-width: 320px; width: calc(28000% - 167400px);
overflow-wrap: break-word;word-wrap: break-word;word-break: break-word;">
<div class="layout__inner"
style="border-collapse: collapse;display: table;width: 100%;
background-color: #fff;">
<!--[if (mso)|(IE)]>
<table align="center" cellpadding="0" cellspacing="0" role="presentation">
<tr class="layout-fixed-width" style="background-color: #fff;">
<td style="width: 600px" class="w560">
<![endif]-->
<div class="column"
style="text-align: left;color: #8e959c;font-size: 14px;line-height: 21px;
font-family: sans-serif;max-width: 600px;min-width: 320px;width: calc(28000% - 167400px);">
<div style="margin: 12px 20px">
<div style="mso-line-height-rule: exactly;mso-text-raise: 4px;">
<h1 class="size-40"
style="Margin-top: 0;Margin-bottom: 0;font-style: normal;font-weight: normal;
color: #000;font-size: 32px;line-height: 40px;
font-family: montserrat,dejavu sans,verdana,sans-serif;" lang="x-size-40">
<span class="font-montserrat">
<strong>You have requested to reset your password</strong>
</span>
</h1>
</div>
</div>
</div>
<!--[if (mso)|(IE)]></td></tr></table><![endif]-->
</div>
</div>
<div style="mso-line-height-rule: exactly;line-height: 20px;font-size: 20px;">&nbsp;</div>
<div class="layout one-col fixed-width"
style="Margin: 0 auto;max-width: 600px;min-width: 320px;width: calc(28000% - 167400px);
overflow-wrap: break-word;word-wrap: break-word;word-break: break-word;">
<div class="layout__inner"
style="border-collapse: collapse;display: table;width: 100%; background-color: #fff;">
<!--[if (mso)|(IE)]>
<table align="center" cellpadding="0" cellspacing="0" role="presentation">
<tr class="layout-fixed-width" style="background-color: #fff;">
<td style="width: 600px" class="w560">
<![endif]-->
<div class="column"
style="text-align: left;color: #8e959c;font-size: 14px;line-height: 21px;
font-family: sans-serif;max-width: 600px;min-width: 320px;width: calc(28000% - 167400px);">
<div style="margin: 12px 20px">
<div style="mso-line-height-rule: exactly;mso-text-raise: 4px;">
<p class="size-20"
style="Margin-top: 0;Margin-bottom: 0;
font-family: montserrat,dejavu sans,verdana,sans-serif;font-size: 17px;
line-height: 26px;" lang="x-size-20">
<span class="font-montserrat">Hi {{ .UserName }},</span>
</p>
<p class="size-20"
style="Margin-top: 5px;Margin-bottom: 0;
font-family: montserrat,dejavu sans,verdana,sans-serif;font-size: 17px;
line-height: 26px;" lang="x-size-20">
<span class="font-montserrat">We received a request to reset your Satellite
Account password. To reset your password, click the following link and
follow the instructions.
</span>
</p>
</div>
</div>
</div>
<!--[if (mso)|(IE)]></td></tr></table><![endif]-->
</div>
</div>
<div style="mso-line-height-rule: exactly;line-height: 20px;font-size: 20px;">&nbsp;</div>
<div class="layout one-col fixed-width"
style="Margin: 0 auto;max-width: 600px;min-width: 320px;width: calc(28000% - 167400px);
overflow-wrap: break-word;word-wrap: break-word;word-break: break-word;">
<div class="layout__inner"
style="border-collapse: collapse;display: table;width: 100%;background-color: #fff;">
<!--[if (mso)|(IE)]>
<table align="center" cellpadding="0" cellspacing="0" role="presentation">
<tr class="layout-fixed-width" style="background-color: #fff;">
<td style="width: 600px" class="w560">
<![endif]-->
<div class="column"
style="text-align: left;color: #8e959c;font-size: 14px;line-height: 21px;
font-family: sans-serif;max-width: 600px;min-width: 320px;width: calc(28000% - 167400px);">
<div style="margin: 12px 20px">
<div class="btn btn--flat btn--large" style="text-align:left;">
<a style="border-radius: 4px;display: inline-block;font-size: 14px;font-weight: bold;
line-height: 24px;padding: 12px 24px;text-align: center;
text-decoration: none !important;transition: opacity 0.1s ease-in;
color: #ffffff !important;background-color: #2683ff;
font-family: Montserrat, DejaVu Sans, Verdana, sans-serif;"
href="{{ .ResetLink }}">Reset Password
</a>
<!--[if mso]>
<p style="line-height:0;margin:0;"></p>
<v:roundrect xmlns:v="urn:schemas-microsoft-com:vml"
href="{{ .ResetLink }}" style="width:191px" arcsize="9%" fillcolor="#2683FF"
stroke="f">
<v:textbox style="mso-fit-shape-to-text:t" inset="0px,11px,0px,11px">
<center style="font-size:14px;line-height:24px;color:#FFFFFF;
font-family:Montserrat,DejaVu Sans,Verdana,sans-serif;font-weight:bold;
mso-line-height-rule:exactly;mso-text-raise:4px">Reset Password
</center>
</v:textbox>
</v:roundrect>
<![endif]-->
</div>
</div>
</div>
<!--[if (mso)|(IE)]></td></tr></table><![endif]-->
</div>
</div>
<div style="mso-line-height-rule: exactly;line-height: 20px;font-size: 20px;">&nbsp;</div>
<div class="layout one-col fixed-width"
style="Margin: 0 auto;max-width: 600px;min-width: 320px;width: calc(28000% - 167400px);
overflow-wrap: break-word;word-wrap: break-word;word-break: break-word;">
<div class="layout__inner"
style="border-collapse: collapse;display: table;width: 100%;background-color: #fff;">
<!--[if (mso)|(IE)]>
<table align="center" cellpadding="0" cellspacing="0" role="presentation">
<tr class="layout-fixed-width" style="background-color: #fff;">
<td style="width: 600px" class="w560">
<![endif]-->
<div class="column"
style="text-align: left;color: #8e959c;font-size: 14px;line-height: 21px;
font-family: sans-serif;max-width: 600px;min-width: 320px;width: calc(28000% - 167400px);">
<div style="margin: 12px 20px">
<div style="mso-line-height-rule: exactly;mso-text-raise: 4px;">
<p class="size-16"
style="Margin-top: 0;Margin-bottom: 0;
font-family: montserrat,dejavu sans,verdana,sans-serif;
font-size: 16px;line-height: 24px;" lang="x-size-16">
<span class="font-montserrat">Didnt request this change?<br/></span>
</p>
<p class="size-16"
style="Margin-top: 0;Margin-bottom: 0;
font-family: montserrat,dejavu sans,verdana,sans-serif;font-size: 16px;
line-height: 24px;" lang="x-size-16">
<span class="font-montserrat">If you didnt request a new password
<a href="mailto:support@storj.io"
style="color: #2683ff; text-decoration: none; font-weight: bold">let us know
</a><br />
</span>
</p>
<p style="Margin-top: 0;Margin-bottom: 0;
font-family: montserrat,dejavu sans,verdana,sans-serif;font-size: 12px;
line-height: 24px;" lang="x-size-16">
<span class="font-montserrat">Please Note: After clicking on «Let us Know» we
will automatically deactivate this reset password link and redirect you to
our Support Desk.<br/>
</span>
</p>
</div>
</div>
</div>
<!--[if (mso)|(IE)]></td></tr></table><![endif]-->
</div>
</div>
<div style="mso-line-height-rule: exactly;line-height: 20px;font-size: 20px;">&nbsp;</div>
<div class="layout one-col fixed-width"
style="Margin: 0 auto;max-width: 600px;min-width: 320px;width: calc(28000% - 167400px);
overflow-wrap: break-word;word-wrap: break-word;word-break: break-word;">
<div class="layout__inner"
style="border-collapse: collapse;display: table;width: 100%;background-color: #fff;">
<!--[if (mso)|(IE)]>
<table align="center" cellpadding="0" cellspacing="0" role="presentation">
<tr class="layout-fixed-width" style="background-color: #fff;">
<td style="width: 600px" class="w560">
<![endif]-->
<div class="column"
style="text-align: left;color: #8e959c;font-size: 14px;line-height: 21px;
font-family: sans-serif;max-width: 600px;min-width: 320px; width: calc(28000% - 167400px);">
<div style="Margin-left: 20px;Margin-right: 20px;Margin-top: 12px;">
<div class="divider"
style="display: block;font-size: 2px;line-height: 1px;Margin-left: auto;
Margin-right: auto;width: 100%;background-color: #ccc;Margin-bottom: 20px;">&nbsp;
</div>
</div>
</div>
<!--[if (mso)|(IE)]></td></tr></table><![endif]-->
</div>
</div>
<div style="mso-line-height-rule: exactly;line-height: 20px;font-size: 20px;">&nbsp;</div>
<div class="layout one-col fixed-width"
style="Margin: 0 auto;max-width: 600px;min-width: 320px; width: calc(28000% - 167400px);
overflow-wrap: break-word;word-wrap: break-word;word-break: break-word;">
<div class="layout__inner"
style="border-collapse: collapse;display: table;width: 100%;background-color: #fff;">
<!--[if (mso)|(IE)]>
<table align="center" cellpadding="0" cellspacing="0" role="presentation">
<tr class="layout-fixed-width" style="background-color: #fff;">
<td style="width: 600px" class="w560">
<![endif]-->
<div class="column"
style="text-align: left;color: #8e959c;font-size: 14px;line-height: 21px;
font-family: sans-serif;max-width: 600px;min-width: 320px;width: calc(28000% - 167400px);">
<div style="margin: 12px 20px">
<div style="mso-line-height-rule: exactly;mso-text-raise: 4px;">
<p class="size-12" style="Margin-top: 0;Margin-bottom: 0;font-family: montserrat,dejavu sans,verdana,sans-serif;font-size: 12px;line-height: 19px;" lang="x-size-12">
<span class="font-montserrat">Please do not reply to this email.<br />
1450 W. Peachtree St. NW #200, PMB 75268, Atlanta, GA 30309-2955, United States
</span>
</p>
</div>
</div>
</div>
<!--[if (mso)|(IE)]></td></tr></table><![endif]-->
</div>
</div>
<div style="mso-line-height-rule: exactly;line-height: 20px;font-size: 20px;">&nbsp;</div>
<div class="layout three-col fixed-width"
style="Margin: 0 auto;max-width: 600px;min-width: 320px;width: calc(28000% - 167400px);
overflow-wrap: break-word;word-wrap: break-word;word-break: break-word;">
<div class="layout__inner"
style="border-collapse: collapse;display: table;width: 100%;background-color: #fff;">
<!--[if (mso)|(IE)]>
<table align="center" cellpadding="0" cellspacing="0" role="presentation">
<tr class="layout-fixed-width" style="background-color: #fff;">
<td style="width: 200px" valign="top" class="w160">
<![endif]-->
<div class="column"
style="text-align: left;color: #8e959c;font-size: 14px;line-height: 21px;
font-family: sans-serif;Float: left;max-width: 320px;min-width: 200px;width: calc(72200px - 12000%);">
<div style="margin: 0 20px">
<div style="mso-line-height-rule: exactly;mso-text-raise: 4px;">
<a href="https://supportdcs.storj.io/hc/en-us" style="text-decoration: none; color: #66686C;">
<p class="size-12"
style="Margin-top: 0;Margin-bottom: 0;
font-family: montserrat,dejavu sans,verdana,sans-serif;font-size: 12px;
line-height: 19px;" lang="x-size-12">
<span class="font-montserrat">
<strong>Help</strong>
</span>
</p>
</a>
</div>
</div>
</div>
<!--[if (mso)|(IE)]></td><td style="width: 200px" valign="top" class="w160"><![endif]-->
<div class="column"
style="text-align: left;color: #8e959c;font-size: 14px;line-height: 21px;
font-family: sans-serif;Float: left;max-width: 320px;min-width: 200px;width: calc(72200px - 12000%);">
<div style="margin: 0 20px;">
<div style="mso-line-height-rule: exactly;mso-text-raise: 4px;">
<a href="{{ .ContactInfoURL }}" style="text-decoration: none; color: #66686C;">
<p class="size-12" style="Margin-top: 0;Margin-bottom: 0;font-family: montserrat,dejavu sans,verdana,sans-serif;font-size: 12px;line-height: 19px;" lang="x-size-12">
<span class="font-montserrat">
<strong>Contact</strong>
</span>
</p>
</a>
</div>
</div>
</div>
<!--[if (mso)|(IE)]></td><td style="width: 100px" valign="top" class="w160"><![endif]-->
<div class="column"
style="text-align: left;color: #8e959c;font-size: 14px;line-height: 21px;
font-family: sans-serif;Float: left;max-width: 150px;min-width: 100px;
width: calc(72200px - 12000%);">
<div style="margin: 0 20px">
<div style="mso-line-height-rule: exactly;mso-text-raise: 4px;">
<a href="https://tardigrade.io/terms-of-service/" style="text-decoration: none; color: #66686C;">
<p class="size-12"
style="Margin-top: 0;Margin-bottom: 0;
font-family: montserrat,dejavu sans,verdana,sans-serif;font-size: 12px;
line-height: 19px;" lang="x-size-12">
<span class="font-montserrat">
<strong>Terms of Service</strong><br />
</span>
</p>
</a>
</div>
</div>
</div>
<!--[if (mso)|(IE)]></td></tr></table><![endif]-->
</div>
</div>
<div class="layout one-col fixed-width"
style="Margin: 0 auto;max-width: 600px;min-width: 320px; width: calc(28000% - 167400px);
overflow-wrap: break-word;word-wrap: break-word;word-break: break-word;">
<div class="layout__inner" style="border-collapse: collapse;display: table;width: 100%;
background-color: #fff;">
<!--[if (mso)|(IE)]>
<table align="center" cellpadding="0" cellspacing="0" role="presentation">
<tr class="layout-fixed-width" style="background-color: #fff;">
<td style="width: 600px" class="w560">
<![endif]-->
<div class="column"
style="text-align: left;color: #8e959c;font-size: 14px;line-height: 21px;
font-family: sans-serif;max-width: 600px;min-width: 320px;width: calc(28000% - 167400px);">
<div style="margin: 0 20px 12px 20px">
<div style="mso-line-height-rule: exactly;mso-text-raise: 4px;">
<p class="size-10"
style="Margin-top: 0;Margin-bottom: 0;
font-family: montserrat,dejavu sans,verdana,sans-serif;font-size: 10px;
line-height: 18px;" lang="x-size-10">
<span class="font-montserrat">Storj Labs Inc 2019.<br /></span>
</p>
</div>
</div>
</div>
<!--[if (mso)|(IE)]></td></tr></table><![endif]-->
</div>
</div>
</div>
</td>
</tr>
</tbody>
</table>
</body>
</html>