Skip to content

Instantly share code, notes, and snippets.

@yashvekaria

yashvekaria/email.html

Last active November 5, 2019 06:28
Show Gist options
  • Save yashvekaria/9f5068c45d38d6072dd06b3ae3f4dfdb to your computer and use it in GitHub Desktop.
Save yashvekaria/9f5068c45d38d6072dd06b3ae3f4dfdb to your computer and use it in GitHub Desktop.
Download ZIP
Sendgrid - email template - invitation
Raw
email.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" data-dnd="true">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1" />
<!--[if !mso]><!-->
<meta http-equiv="X-UA-Compatible" content="IE=Edge" />
<!--<![endif]-->
<!--[if (gte mso 9)|(IE)]><style type="text/css">
table {border-collapse: collapse;}
table, td {mso-table-lspace: 0pt;mso-table-rspace: 0pt;}
img {-ms-interpolation-mode: bicubic;}
</style>
<![endif]-->
<!-- <link href="https://fonts.googleapis.com/css?family=Open+Sans" rel="stylesheet"> -->
<style type="text/css">
@import url('https://fonts.googleapis.com/css?family=Open+Sans');
body {
color: #696969;
}
body a {
color: #ee826d;
text-decoration: none;
}
p {
margin: 0;
padding: 0;
}
p {
display: block;
-webkit-margin-before: 0em;
-webkit-margin-after: 0em;
-webkit-margin-start: 0px;
-webkit-margin-end: 0px;
}
table[class="wrapper"] {
width: 100% !important;
table-layout: fixed;
-webkit-font-smoothing: antialiased;
-webkit-text-size-adjust: 100%;
-moz-text-size-adjust: 100%;
-ms-text-size-adjust: 100%;
}
img[class="max-width"] {
max-width: 100% !important;
}
@media screen and (max-width:480px) {
.preheader .rightColumnContent,
.footer .rightColumnContent {
text-align: left !important;
}
.preheader .rightColumnContent div,
.preheader .rightColumnContent span,
.footer .rightColumnContent div,
.footer .rightColumnContent span {
text-align: left !important;
}
.preheader .rightColumnContent,
.preheader .leftColumnContent {
font-size: 80% !important;
padding: 5px 0;
}
table[class="wrapper-mobile"] {
width: 100% !important;
table-layout: fixed;
}
img[class="max-width"] {
height: auto !important;
}
a[class="bulletproof-button"] {
display: block !important;
width: auto !important;
font-size: 80%;
padding-left: 0 !important;
padding-right: 0 !important;
} // 2 columns
#templateColumns {
width: 100% !important;
}
.templateColumnContainer {
display: block !important;
width: 100% !important;
padding-left: 0 !important;
padding-right: 0 !important;
}
}
</style>
<style>
body,
p,
div {
font-family: Open Sans, sans-serif;
}
</style>
<style>
body,
p,
div {
font-size: 14px;
}
</style>
</head>
<body yahoofix="true" style="min-width: 100%; margin: 0; padding: 0; font-size: 14px; font-family: Open Sans, arial,sans-serif; background-color: #FFFFFF; color: #013950;" data-attributes='%7B%22dropped%22%3Atrue%2C%22bodybackground%22%3A%22%23FFFFFF%22%2C%22bodyfontname%22%3A%22arial%2Csans-serif%22%2C%22bodytextcolor%22%3A%22%23696969%22%2C%22bodylinkcolor%22%3A%22%23EE826D%22%2C%22bodyfontsize%22%3A14%7D'>
<center class="wrapper">
<div class="webkit">
<table cellpadding="0" cellspacing="0" border="0" width="100%" class="wrapper" bgcolor="#FFFFFF">
<tr>
<td valign="top" bgcolor="#FFFFFF" width="100%">
<table width="100%" role="content-container" class="outer" data-attributes='%7B%22dropped%22%3Atrue%2C%22containerpadding%22%3A%220%2C0%2C0%2C0%22%2C%22containerwidth%22%3A600%2C%22containerbackground%22%3A%22%239DD9CF%22%7D' align="center" cellpadding="0" cellspacing="0" border="0">
<tr>
<td width="100%">
<table width="100%" cellpadding="0" cellspacing="0" border="0">
<tr>
<td>
<!--[if (gte mso 9)|(IE)]>
<table width="600" align="center" cellpadding="0" cellspacing="0" border="0">
<tr>
<td>
<![endif]-->
<table width="100%" cellpadding="0" cellspacing="0" border="0" style="width: 100%; max-width:650px; padding: 25px 25px; background-color: #E0F2F1;" align="center">
<tr>
<td role="modules-container" style="padding: 0px 0px 0px 0px; color: #696969; text-align: left;" bgcolor="#E0F2F1" width="100%" align="left">
<table border="0" cellpadding="0" cellspacing="0" align="center" width="100%" style="display:none !important; visibility:hidden; opacity:0; color:transparent; height:0; width:0;" class="module preheader preheader-hide" role="module" data-type="preheader">
<tr>
<td role="module-content">
<div></div>
</td>
</tr>
</table>
<table class="module" role="module" data-type="wysiwyg" border="0" cellpadding="0" cellspacing="0" width="100%" style="table-layout: fixed;" data-attributes='%7B%22dropped%22%3Atrue%2C%22padding%22%3A%220%2C0%2C0%2C0%22%2C%22containerbackground%22%3A%22%23ffffff%22%7D'>
<tr>
<td role="module-content" style="padding: 0px 0px 0px 0px;" bgcolor="#ffffff">
<div>
</div>
</td>
</tr>
</table>
<table class="module" role="module" data-type="text" border="0" cellpadding="0" cellspacing="0" width="100%" style="table-layout: fixed;" data-attributes='%7B%22dropped%22%3Atrue%2C%22child%22%3Afalse%2C%22padding%22%3A%220%2C0%2C0%2C0%22%2C%22containerbackground%22%3A%22%239DD9CF%22%7D'>
<tr>
<td role="module-content" valign="top" height="100%" style="padding: 0px 0px 0px 0px;border-top-right-radius: 10px;border-top-left-radius: 10px;" bgcolor="#009688">
<h1 style="text-align: center;"><span style="font-family:Open Sans,sans-serif; color: #FFFFFF; letter-spacing: 1px;">XXXXX XXXXXX</span></h1></td>
</tr>
</table>
<table class="module" role="module" data-type="text" border="0" cellpadding="0" cellspacing="0" width="100%" style="table-layout: fixed;" data-attributes='%7B%22dropped%22%3Atrue%2C%22child%22%3Afalse%2C%22padding%22%3A%2245%2C15%2C45%2C15%22%2C%22containerbackground%22%3A%22%23ee826d%22%7D'>
<tr>
<td role="module-content" valign="top" height="100%" style="padding: 25px 0px;" bgcolor="#FFFFFF">
<div style="text-align: center;"><span style="font-family:Open Sans,sans-serif; color:#696969; font-size:28px;">XXXXXXX Invitation</span></div>
</td>
</tr>
</table>
<table class="module" role="module" data-type="text" border="0" cellpadding="0" cellspacing="0" width="100%" style="table-layout: fixed;" data-attributes='%7B%22dropped%22%3Atrue%2C%22child%22%3Afalse%2C%22padding%22%3A%2230%2C30%2C30%2C30%22%2C%22containerbackground%22%3A%22%23F1F8E9%22%7D'>
<tr>
<td role="module-content" valign="top" height="100%" style="padding: 30px 30px 30px 30px;" bgcolor="#FFFFFF">
<div><span style="font-size:14px;">Hello %VAR2% (%VAR1%),</span></div>
<div>&nbsp;</div>
<div><span style="font-size:14px; line-height:1.4em;">We would like to inform you that, you can now begin the digital assessment of answersheet of <strong style="color:#444444;">%VAR4%</strong>&nbsp;(<strong>%VAR5%</strong>) under <strong>%VAR3%</strong> programme. You are kindly requested to evalute the answersheet of your respective subject from the Digital Assessment Desktop Application (software).</span></div>
<div>&nbsp;</div>
<div><span style="font-size:14px; line-height:1.4em;">Faculty can evaluate maximum <strong style="color:#444444;">%VAR6%</strong> answersheets per day.</span></div>
<div>&nbsp;</div>
<div>&nbsp;</div>
<div><strong><span style="font-size:12px;">What if any of credentials is wrong?</span></strong></div>
<div><span style="font-size:12px;">Don&#39;t worry, our support team is always there for you. You can email us at&nbsp;<strong><em><a href="#">support@xxxxxxx.xxx</a></em></strong></span>.</div>
<div>&nbsp;</div>
<div><strong><span style="font-size:12px;">Where can I ask questions?</span></strong></div>
<div><span style="font-size:12px;">Check out our helpline number <strong>+91-99XXXXXXXX</strong> to know more about it.</span>
</div>
</td>
</tr>
</table>
<table class="module" role="module" data-type="divider" border="0" cellpadding="0" cellspacing="0" width="100%" style="table-layout: fixed;" data-attributes='%7B%22dropped%22%3Atrue%2C%22padding%22%3A%220%2C0%2C0%2C0%22%2C%22containerbackground%22%3A%22%239DD9CF%22%2C%22linecolor%22%3A%22%239DD9CF%22%2C%22height%22%3A1%7D'>
<tr>
<td role="module-content" style="padding: 0px 0px 0px 0px;" bgcolor="#ee826d">
<table border="0" cellpadding="0" cellspacing="0" align="center" width="100%" height="1" style="font-size: 1px; line-height: 1px;">
<tr>
<td bgcolor="#ee826d">&nbsp;</td>
</tr>
</table>
</td>
</tr>
</table>
<table class="module" role="module" data-type="text" border="0" cellpadding="0" cellspacing="0" width="100%" style="table-layout: fixed;" data-attributes='%7B%22dropped%22%3Atrue%2C%22child%22%3Afalse%2C%22padding%22%3A%2215%2C15%2C15%2C15%22%2C%22containerbackground%22%3A%22%23F1F8E9%22%7D'>
<tr>
<td role="module-content" valign="top" height="100%" style="padding: 15px 15px 15px 15px; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px;" bgcolor="#FFFFFF">
<div><span style="color:#696969;"><span style="font-family: arial, sans-serif; font-size: 12px; font-style: italic; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: normal;">Important Note: Digital Assessment&nbsp;never ask for your password. Please do not share your password. This is a System generated automatic E-Mail Message. Please do not reply.</span></span>
</div>
</td>
</tr>
</table>
</tr>
</td>
</table>
<!--[if (gte mso 9)|(IE)]>
</td>
</td>
</table>
<![endif]-->
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
</div>
</center>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment