Back to all articles

Original Source Code for Email Template: SupervisorAlerts

Below is the original Source Code for the Email Template: SupervisorAlerts.

This can be copied and pasted to replace an edited template when you wish to revert back to the original.

---------------------------------------------------------------------

<!--<![endif]--><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><!--[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: 36px !important;
line-height: 43px !important
}
.wrapper h2 {}
.wrapper h2 {
font-size: 22px !important;
line-height: 31px !important
}
.wrapper h3 {}
.wrapper h3 {
font-size: 18px !important;
line-height: 26px !important
}
.column p,
.column ol,
.column ul {}
.wrapper .size-8 {
font-size: 8px !important;
line-height: 14px !important
}
.wrapper .size-9 {
font-size: 9px !important;
line-height: 16px !important
}
.wrapper .size-10 {
font-size: 10px !important;
line-height: 18px !important
}
.wrapper .size-11 {
font-size: 11px !important;
line-height: 19px !important
}
.wrapper .size-12 {
font-size: 12px !important;
line-height: 19px !important
}
.wrapper .size-13 {
font-size: 13px !important;
line-height: 21px !important
}
.wrapper .size-14 {
font-size: 14px !important;
line-height: 21px !important
}
.wrapper .size-15 {
font-size: 15px !important;
line-height: 23px !important
}
.wrapper .size-16 {
font-size: 16px !important;
line-height: 24px !important
}
.wrapper .size-17 {
font-size: 17px !important;
line-height: 26px !important
}
.wrapper .size-18 {
font-size: 18px !important;
line-height: 26px !important
}
.wrapper .size-20 {
font-size: 20px !important;
line-height: 28px !important
}
.wrapper .size-22 {
font-size: 22px !important;
line-height: 31px !important
}
.wrapper .size-24 {
font-size: 24px !important;
line-height: 32px !important
}
.wrapper .size-26 {
font-size: 26px !important;
line-height: 34px !important
}
.wrapper .size-28 {
font-size: 28px !important;
line-height: 36px !important
}
.wrapper .size-30 {
font-size: 30px !important;
line-height: 38px !important
}
.wrapper .size-32 {
font-size: 32px !important;
line-height: 40px !important
}
.wrapper .size-34 {
font-size: 34px !important;
line-height: 43px !important
}
.wrapper .size-36 {
font-size: 36px !important;
line-height: 43px !important
}
.wrapper .size-40 {
font-size: 40px !important;
line-height: 47px !important
}
.wrapper .size-44 {
font-size: 44px !important;
line-height: 50px !important
}
.wrapper .size-48 {
font-size: 48px !important;
line-height: 54px !important
}
.wrapper .size-56 {
font-size: 56px !important;
line-height: 60px !important
}
.wrapper .size-64 {
font-size: 64px !important;
line-height: 63px !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;
}

.preheader,
.header,
.layout,
.column {
transition: width 0.25s ease-in-out, max-width 0.25s ease-in-out;
}

.layout,
.header {
max-width: 400px !important;
-fallback-width: 95% !important;
width: calc(100% - 20px) !important;
}

div.preheader {
max-width: 360px !important;
-fallback-width: 90% !important;
width: calc(100% - 60px) !important;
}

.snippet,
.webversion {
Float: none !important;
}

.column {
max-width: 400px !important;
width: 100% !important;
}

.fixed-width.has-border {
max-width: 402px !important;
}

.fixed-width.has-border .layout__inner {
box-sizing: border-box;
}

.snippet,
.webversion {
width: 50% !important;
}

.ie .btn {
width: 100%;
}

.ie .column,
[owa] .column,
.ie .gutter,
[owa] .gutter {
display: table-cell;
float: none !important;
vertical-align: top;
}

.ie div.preheader,
[owa] div.preheader,
.ie .email-footer,
[owa] .email-footer {
max-width: 560px !important;
width: 560px !important;
}

.ie .snippet,
[owa] .snippet,
.ie .webversion,
[owa] .webversion {
width: 280px !important;
}

.ie .header,
[owa] .header,
.ie .layout,
[owa] .layout,
.ie .one-col .column,
[owa] .one-col .column {
max-width: 600px !important;
width: 600px !important;
}

.ie .fixed-width.has-border,
[owa] .fixed-width.has-border,
.ie .has-gutter.has-border,
[owa] .has-gutter.has-border {
max-width: 602px !important;
width: 602px !important;
}

.ie .two-col .column,
[owa] .two-col .column {
max-width: 300px !important;
width: 300px !important;
}

.ie .three-col .column,
[owa] .three-col .column,
.ie .narrow,
[owa] .narrow {
max-width: 200px !important;
width: 200px !important;
}

.ie .wide,
[owa] .wide {
width: 400px !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,
.ie .has-gutter .narrow,
[owa] .has-gutter .narrow {
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;
}

.ie .layout__edges {
display: none;
}

.mso .layout__edges {
font-size: 0;
}

.layout-fixed-width,
.mso .layout-full-width {
background-color: #ffffff;
}

@media only screen and (min-width: 620px) {
.column,
.gutter {
display: table-cell;
Float: none !important;
vertical-align: top;
}
div.preheader,
.email-footer {
max-width: 560px !important;
width: 560px !important;
}
.snippet,
.webversion {
width: 280px !important;
}
.header,
.layout,
.one-col .column {
max-width: 600px !important;
width: 600px !important;
}
.fixed-width.has-border,
.fixed-width.ecxhas-border,
.has-gutter.has-border,
.has-gutter.ecxhas-border {
max-width: 602px !important;
width: 602px !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;
}
.border {
display: none;
}
}

.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 .font-avenir,
.mso .font-cabin,
.mso .font-open-sans,
.mso .font-ubuntu {
font-family: sans-serif !important;
}

.mso .font-bitter,
.mso .font-merriweather,
.mso .font-pt-serif {
font-family: Georgia, serif !important;
}

.mso .font-lato,
.mso .font-roboto {
font-family: Tahoma, sans-serif !important;
}

.mso .font-pt-sans {
font-family: "Trebuchet MS", sans-serif !important;
}

.mso .footer__share-button p {
margin: 0;
}

.mso .size-8,
.ie .size-8 {
font-size: 8px !important;
line-height: 14px !important;
}

.mso .size-9,
.ie .size-9 {
font-size: 9px !important;
line-height: 16px !important;
}

.mso .size-10,
.ie .size-10 {
font-size: 10px !important;
line-height: 18px !important;
}

.mso .size-11,
.ie .size-11 {
font-size: 11px !important;
line-height: 19px !important;
}

.mso .size-12,
.ie .size-12 {
font-size: 12px !important;
line-height: 19px !important;
}

.mso .size-13,
.ie .size-13 {
font-size: 13px !important;
line-height: 21px !important;
}

.mso .size-14,
.ie .size-14 {
font-size: 14px !important;
line-height: 21px !important;
}

.mso .size-15,
.ie .size-15 {
font-size: 15px !important;
line-height: 23px !important;
}

.mso .size-16,
.ie .size-16 {
font-size: 16px !important;
line-height: 24px !important;
}

.mso .size-17,
.ie .size-17 {
font-size: 17px !important;
line-height: 26px !important;
}

.mso .size-18,
.ie .size-18 {
font-size: 18px !important;
line-height: 26px !important;
}

.mso .size-20,
.ie .size-20 {
font-size: 20px !important;
line-height: 28px !important;
}

.mso .size-22,
.ie .size-22 {
font-size: 22px !important;
line-height: 31px !important;
}

.mso .size-24,
.ie .size-24 {
font-size: 24px !important;
line-height: 32px !important;
}

.mso .size-26,
.ie .size-26 {
font-size: 26px !important;
line-height: 34px !important;
}

.mso .size-28,
.ie .size-28 {
font-size: 28px !important;
line-height: 36px !important;
}

.mso .size-30,
.ie .size-30 {
font-size: 30px !important;
line-height: 38px !important;
}

.mso .size-32,
.ie .size-32 {
font-size: 32px !important;
line-height: 40px !important;
}

.mso .size-34,
.ie .size-34 {
font-size: 34px !important;
line-height: 43px !important;
}

.mso .size-36,
.ie .size-36 {
font-size: 36px !important;
line-height: 43px !important;
}

.mso .size-40,
.ie .size-40 {
font-size: 40px !important;
line-height: 47px !important;
}

.mso .size-44,
.ie .size-44 {
font-size: 44px !important;
line-height: 50px !important;
}

.mso .size-48,
.ie .size-48 {
font-size: 48px !important;
line-height: 54px !important;
}

.mso .size-56,
.ie .size-56 {
font-size: 56px !important;
line-height: 60px !important;
}

.mso .size-64,
.ie .size-64 {
font-size: 64px !important;
line-height: 63px !important;
}
</style>
<!--[if !mso]><!-->
<style type="text/css">@import url(https://fonts.googleapis.com/css?family=Roboto:400,700,400italic,700italic|Ubuntu:400,700,400italic,700italic);
</style>
<!--<![endif]-->
<style type="text/css">body {
background-color: #ffffff
}

.mso h1 {}

.mso h2 {}

.mso h3 {}

.mso .column,
.mso .column__background td {}

.mso .column,
.mso .column__background td {
font-family: Tahoma, sans-serif !important
}

.mso .btn a {}

.mso .btn a {
font-family: Tahoma, sans-serif !important
}

.mso .webversion,
.mso .snippet,
.mso .layout-email-footer td,
.mso .footer__share-button p {}

.mso .webversion,
.mso .snippet,
.mso .layout-email-footer td,
.mso .footer__share-button p {
font-family: sans-serif !important
}

.mso .logo {}

.mso .logo {
font-family: Tahoma, sans-serif !important
}

.logo a:hover,
.logo a:focus {
color: #859bb1 !important
}

.mso .layout-has-border {
border-top: 1px solid #9daec5;
border-bottom: 1px solid #9daec5
}

.mso .layout-has-bottom-border {
border-bottom: 1px solid #9daec5
}

.mso .border,
.ie .border {
background-color: #9daec5
}

.mso h1,
.ie h1 {}

.mso h1,
.ie h1 {
font-size: 36px !important;
line-height: 43px !important
}

.mso h2,
.ie h2 {}

.mso h2,
.ie h2 {
font-size: 22px !important;
line-height: 31px !important
}

.mso h3,
.ie h3 {}

.mso h3,
.ie h3 {
font-size: 18px !important;
line-height: 26px !important
}

.mso .layout__inner p,
.ie .layout__inner p,
.mso .layout__inner ol,
.ie .layout__inner ol,
.mso .layout__inner ul,
.ie .layout__inner ul {}
</style>
<meta name="robots" content="noindex,nofollow"><meta property="og:title" content="MyCompliance Cloud Email API"><!--[if mso]><body class="mso"><![endif]--><!--[if !mso]><!--><!--<![endif]-->
<table cellpadding="0" cellspacing="0" class="wrapper" role="presentation" style="border-collapse: collapse;table-layout: fixed;min-width: 320px;width: 100%;background-color: #ffffff;">
<tbody>
<tr>
<td>
<div role="banner">
<div class="header" id="emb-email-header-container" style="Margin: 0 auto;max-width: 600px;min-width: 320px; width: 320px;width: calc(28000% - 167400px);"><!--[if (mso)|(IE)]><table align="center" class="header" cellpadding="0" cellspacing="0" role="presentation"><tr><td style="width: 600px"><![endif]-->
<div align="center" class="logo emb-logo-margin-box" style="font-size: 26px;line-height: 32px;Margin-top: 20px;Margin-bottom: 20px;color: #c3ced9;font-family: Roboto,Tahoma,sans-serif;Margin-left: 20px;Margin-right: 20px;">
<div align="center" class="logo-center" id="emb-email-header"><img alt="" src="https://cdnmetacompliancelive.metacompliance.com/phishtemplate/MyComplianceLogo.png" style="border: 0;-ms-interpolation-mode: bicubic;display: block;max-width: 250px;" width="250" /></div>
</div>
<!--[if (mso)|(IE)]></td></tr></table><![endif]--></div>
</div>

<div role="section">
<div class="layout one-col fixed-width" style="Margin: 0 auto;max-width: 1000px;min-width: 1000px; width: 1000px;width: calc(28000% - 167400px);overflow-wrap: break-word;word-wrap: break-word;word-break: break-word;">
<div class="layout__inner" emb-background-style="" style="border-collapse: collapse;display: table;width: 100%;background-color: #ffffff;"><!--[if (mso)|(IE)]><table align="center" cellpadding="0" cellspacing="0" role="presentation"><tr class="layout-fixed-width" emb-background-style><td style="width: 600px" class="w560"><![endif]-->
<div class="column" style="text-align: left;color: #444f63;font-size: 16px;line-height: 24px;font-family: Roboto,Tahoma,sans-serif;max-width: 1000px;min-width: 1000px; width: 1000px;width: calc(28000% - 167400px);">
<div style="Margin-left: 20px;Margin-right: 20px;Margin-top: 24px;">
<div style="line-height:20px;font-size:1px">&nbsp;</div>
</div>

<div style="Margin-left: 20px;Margin-right: 20px;">
<h1 style="Margin-top: 0;Margin-bottom: 0;font-style: normal;font-weight: normal;color: #444f63;font-size: 30px;line-height: 38px;text-align: center;"><strong>Staff Compliance Report</strong></h1>

<p style="Margin-top: 20px;Margin-bottom: 0;">Please see below the list of staff members that you currently supervise, who have not yet completed all assigned content within the MyCompliance Platform. These users have either:</p>

<p>&bull; Received all email alerts to advise that this content is currently outstanding</p>

<p>&bull; Email alerts have not been enabled, however the content has been available to the users for a duration of at least 1 month.&nbsp;</p>
</div>

<div style="Margin-left: 20px;Margin-right: 20px;">
<div style="line-height:10px;font-size:1px">&nbsp;</div>
</div>

<center>[UnComplianceUserTable]</center>
</div>

<div style="Margin-left: 20px;Margin-right: 20px;">
<div style="line-height:10px;font-size:1px">&nbsp;</div>
</div>

<div style="Margin-left: 20px;Margin-right: 20px;Margin-bottom: 24px;">
<div style="line-height:5px;font-size:1px">&nbsp;</div>
</div>
</div>
<!--[if (mso)|(IE)]></td></tr></table><![endif]--></div>
</div>

<div style="line-height:10px;font-size:10px;">&nbsp;</div>

<div style="line-height:40px;font-size:40px;">&nbsp;</div>
</td>
</tr>
</tbody>
</table>

---------------------------------------------------------------------