Skip to content

Instantly share code, notes, and snippets.

@bionicpill

bionicpill/email.html

Forked from anonymous/-
Last active August 29, 2015 13:57
Show Gist options
  • Save bionicpill/9538443 to your computer and use it in GitHub Desktop.
Save bionicpill/9538443 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
email.html
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type">
<meta content="width=device-width" name="viewport">
<style data-immutable="true">
@media only screen and (max-width: 600px) {
table[class="body"] img {
width: auto !important;
height: auto !important;
}
table[class="body"] .container {
width: 95% !important;
}
table[class="body"] .row {
width: 100% !important;
display: block !important;
}
table[class="body"] .wrapper {
display: block !important;
padding-right: 0 !important;
}
table[class="body"] .columns,
table[class="body"] .column {
table-layout: fixed !important;
float: none !important;
width: 100% !important;
padding-right: 0px !important;
padding-left: 0px !important;
display: block !important;
}
table[class="body"] .wrapper.first .columns,
table[class="body"] .wrapper.first .column {
display: table !important;
}
table[class="body"] table.columns td,
table[class="body"] table.column td {
width: 100%;
}
table[class="body"] td.offset-by-one,
table[class="body"] td.offset-by-two,
table[class="body"] td.offset-by-three,
table[class="body"] td.offset-by-four,
table[class="body"] td.offset-by-five,
table[class="body"] td.offset-by-six,
table[class="body"] td.offset-by-seven,
table[class="body"] td.offset-by-eight,
table[class="body"] td.offset-by-nine,
table[class="body"] td.offset-by-ten,
table[class="body"] td.offset-by-eleven {
padding-left: 0 !important;
}
table[class="body"] .expander {
width: 9999px !important;
}
table[class="body"] .hide-for-small,
table[class="body"] .show-for-desktop {
display: none !important;
}
table[class="body"] .show-for-small,
table[class="body"] .hide-for-desktop {
display: inherit !important;
}
.pad--p {
padding-top: 20px !important;
padding-bottom: 10px !important;
}
.logo {
margin-left: auto; //centers logo
margin-right: auto;
float: none;
}
.header td.six { // allows logo to expand full width in mobile
width: 100% !important;
}
.header .pad {
padding-top: 20px !important;
padding-bottom: 10px !important;
}
.header .social-nav{
display: none;
}
.hero .p {
font-size: 18px;
}
.hero-link {
font-size: 18px;
}
.sidebar {
padding-top: 0 !important;
padding-bottom: 20px !important;
margin-top: -20px; // pushes up into pad--p of article
}
table[class="body"] .article img { // allows article images to have a max width
max-width: 350px;
width: 100% !important;
height: auto !important;
}
}
</style>
</head>
<body style='-webkit-text-size-adjust:100%;-webkit-font-smoothing:antialiased;-ms-text-size-adjust:100%;color:#303336;display:block;font-size:14px;font-weight:normal;padding:0;margin:0;text-align:left;line-height:1.3;font-family:"Helvetica", "Arial", sans-serif;width:100% !important'>
<table class="body" style="vertical-align:top;border-spacing:0;border-collapse:collapse;padding:0;text-align:left;background:#eaf6fc;height:100%;width:100%">
<tr style="padding:0;vertical-align:top;text-align:left">
<td align="center" class="center" valign="top" style="vertical-align:top;word-break:break-word;-webkit-hyphens:auto;-moz-hyphens:auto;padding:0;hyphens:auto;text-align:center;border-collapse:collapse !important">
<center style="width:100%">
<table class="row header" style="vertical-align:top;text-align:left;border-spacing:0;border-collapse:collapse;background:white;border-bottom:1px solid #b1b1b1;width:100%;padding:0px;position:relative">
<tr style="padding:0;vertical-align:top;text-align:left">
<td align="center" class="center" style="vertical-align:top;word-break:break-word;-webkit-hyphens:auto;-moz-hyphens:auto;padding:0;hyphens:auto;text-align:center;border-collapse:collapse !important">
<center style="width:100%">
<table class="container" style="border-spacing:0;border-collapse:collapse;padding:0;vertical-align:top;width:580px;margin:0 auto;text-align:inherit">
<tr style="padding:0;vertical-align:top;text-align:left">
<td class="wrapper last" style="word-break:break-word;-webkit-hyphens:auto;-moz-hyphens:auto;hyphens:auto;text-align:left;vertical-align:top;position:relative;padding:10px 20px 0px 0px;padding-right:0px;border-collapse:collapse !important">
<table class="twelve columns" style="border-spacing:0;border-collapse:collapse;padding:0;text-align:left;vertical-align:top;margin:0 auto;width:580px">
<tr style="padding:0;vertical-align:top;text-align:left">
<td class="four sub-columns logo-tp" style="word-break:break-word;-webkit-hyphens:auto;-moz-hyphens:auto;hyphens:auto;text-align:left;vertical-align:top;padding:0px 0px 10px;padding-right:3.448276%;border-collapse:collapse !important;width:33.333333% !important">
<a href="" style="color:#ea7531;font-weight:600;text-decoration:none !important">
</a><a href="http://tinypulse-staging.herokuapp.com/" style="color:#ea7531;font-weight:600;text-decoration:none !important"><img alt="Pulselogo" src="http://tinypulse-staging.herokuapp.com/assets/pulseLogo.png" style="outline:none;text-decoration:none;-ms-interpolation-mode:bicubic;width:auto;float:left;display:block;clear:both;border:none;max-height:50px;max-width:160px;margin-top:5px"></a>
</td>
<td class="eight sub-columns last" style="word-break:break-word;-webkit-hyphens:auto;-moz-hyphens:auto;hyphens:auto;text-align:left;vertical-align:top;padding:0px 0px 10px;padding-right:0px;border-collapse:collapse !important;width:66.666666% !important;text-align:right; vertical-align:middle;">
</td>
</tr>
</table>
</td>
</tr>
</table>
</center>
</td>
</tr>
</table>
<table class="container" style="border-spacing:0;border-collapse:collapse;padding:0;vertical-align:top;width:580px;margin:0 auto;text-align:inherit">
<tr style="padding:0;vertical-align:top;text-align:left">
<td style="word-break:break-word;-webkit-hyphens:auto;-moz-hyphens:auto;hyphens:auto;vertical-align:top;padding:0;text-align:left;border-collapse:collapse !important">
<table class="row" style="border-spacing:0;border-collapse:collapse;vertical-align:top;text-align:left;padding:0px;width:100%;position:relative;display:block">
<tr style="padding:0;vertical-align:top;text-align:left">
<td class="wrapper last" style="word-break:break-word;-webkit-hyphens:auto;-moz-hyphens:auto;hyphens:auto;text-align:left;vertical-align:top;position:relative;padding:10px 20px 0px 0px;padding-right:0px;border-collapse:collapse !important">
<table class="twelve columns content" style="border-spacing:0;border-collapse:collapse;vertical-align:top;text-align:left;padding:0 20px;box-sizing:border-box;display:block;width:580px;margin:0 auto">
<tr class="content-row" style="padding:0;vertical-align:top;text-align:left">
<td style="word-break:break-word;-webkit-hyphens:auto;-moz-hyphens:auto;hyphens:auto;text-align:left;vertical-align:top;padding:0px 0px 10px;border-collapse:collapse !important">
<p style='color:#303336;display:block;font-family:"Helvetica", "Arial", sans-serif;font-weight:normal;padding:0;margin:0;text-align:left;font-size:14px;line-height:19px;margin-bottom:10px'>
Hi,
</p>
<p style='color:#303336;display:block;font-family:"Helvetica", "Arial", sans-serif;font-weight:normal;padding:0;margin:0;text-align:left;font-size:14px;line-height:19px;margin-bottom:10px'>
This week's TINYpulse question is here and hot off the presses. Be heard:
</p>
<table class="row" style="border-spacing:0;border-collapse:collapse;vertical-align:top;text-align:left;padding:0px;width:100%;position:relative;display:block">
<tr style="padding:0;vertical-align:top;text-align:left">
<td class="wrapper button-wrap" style="word-break:break-word;-webkit-hyphens:auto;-moz-hyphens:auto;hyphens:auto;text-align:left;vertical-align:top;position:relative;border-collapse:collapse !important;padding:0px 0 0 0 !important">
<table class="six columns" style="border-spacing:0;border-collapse:collapse;padding:0;text-align:left;vertical-align:top;margin:0 auto;width:280px">
<tr style="padding:0;vertical-align:top;text-align:left">
<td style="word-break:break-word;-webkit-hyphens:auto;-moz-hyphens:auto;hyphens:auto;text-align:left;vertical-align:top;padding:0px 0px 10px;border-collapse:collapse !important">
<div class="button">
<table style="border-spacing:0;border-collapse:collapse;padding:0;text-align:left;vertical-align:top;width:100%;overflow:hidden">
<tbody>
<tr style="padding:0;vertical-align:top;text-align:left">
<td style='word-break:break-word;-webkit-hyphens:auto;-moz-hyphens:auto;hyphens:auto;vertical-align:top;text-align:center;display:block;font-size:16px;padding:8px 15px;font-weight:bold;text-decoration:none;font-family:"Helvetica", "Arial", sans-serif;-moz-border-radius:2px;background:#ea7531;border-radius:2px;-webkit-border-radius:2px;color:#ffffff;border-collapse:collapse !important;width:auto !important'>
<a href="http://tinypulse-staging.herokuapp.com/surveys/respond?response_token=a45bf7063f60ed5f85febc" style='font-weight:600;font-family:"Helvetica", "Arial", sans-serif;text-decoration:none !important;color:#ffffff !important'>
<span style="color: #FFFFFF; text-decoration:none;">
Respond now »
</span>
</a>
</td>
</tr>
</tbody>
</table>
</div>
</td>
<td class="expander" style="word-break:break-word;-webkit-hyphens:auto;-moz-hyphens:auto;hyphens:auto;text-align:left;vertical-align:top;visibility:hidden;width:0px;border-collapse:collapse !important;padding:0 !important"></td>
</tr>
</table>
</td>
</tr>
</table>
<p style='color:#303336;display:block;font-family:"Helvetica", "Arial", sans-serif;font-weight:normal;padding:0;margin:0;text-align:left;font-size:14px;line-height:19px;margin-bottom:10px'>
In addition, the previous week's TINYpulse results are ready to Share. Login and click on Share in the top nav to create a customized Share view for your organization.
<br>
<a href="http://tinypulse-staging.herokuapp.com/surveys/share" style="color:#ea7531;font-weight:600;text-decoration:none !important">http://tinypulse-staging.herokuapp.com/surveys/share</a>
</p>
<p style='color:#303336;display:block;font-family:"Helvetica", "Arial", sans-serif;font-weight:normal;padding:0;margin:0;text-align:left;font-size:14px;line-height:19px;margin-bottom:10px'>
You can always come back and click on this link if you want to provide more Cheers for Peers recognition even after you submit your response. Of course your responses are anonymous and thanks in advance!
</p>
<p style='color:#303336;display:block;font-family:"Helvetica", "Arial", sans-serif;font-weight:normal;padding:0;margin:0;text-align:left;font-size:14px;line-height:19px;margin-bottom:10px'>
To happier employees,
</p>
<p class="signature" style='display:block;font-family:"Helvetica", "Arial", sans-serif;font-weight:normal;padding:0;margin-bottom:10px;text-align:left;font-size:14px;line-height:19px;margin:0;color:#888888'>
<strong>TINYpulse Team</strong>
<br>
[email protected]
<br>
@TINYpulse (Twitter)
<br>
<a href="http://tinypulse-staging.herokuapp.com/" style="color:#ea7531;font-weight:600;text-decoration:none !important">www.TINYpulse.com</a>
</p>
</td>
</tr>
<tr class="signature-row" style="padding:0;vertical-align:top;text-align:left">
<td style="word-break:break-word;-webkit-hyphens:auto;-moz-hyphens:auto;hyphens:auto;text-align:left;vertical-align:top;padding:0px 0px 10px;border-collapse:collapse !important">
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
<!-- container end below -->
<table class="row footer" style="text-align:left;vertical-align:top;border-spacing:0;border-collapse:collapse;background:#eeeeee;border-top:1px solid #b1b1b1;padding:0px;width:100%;position:relative">
<td align="center" class="center" style="vertical-align:top;word-break:break-word;-webkit-hyphens:auto;-moz-hyphens:auto;padding:0;hyphens:auto;text-align:center;border-collapse:collapse !important">
<center style="width:100%">
<table class="container" style="border-spacing:0;border-collapse:collapse;padding:0;vertical-align:top;width:580px;margin:0 auto;text-align:inherit">
<tr style="padding:0;vertical-align:top;text-align:left">
<td class="wrapper sent-by" style="word-break:break-word;-webkit-hyphens:auto;-moz-hyphens:auto;hyphens:auto;text-align:left;vertical-align:top;position:relative;padding:10px 20px 0px 0px;border-collapse:collapse !important">
<table class="seven columns" style="border-spacing:0;border-collapse:collapse;padding:0;text-align:left;vertical-align:top;margin:0 auto;width:530px">
<tr style="padding:0;vertical-align:top;text-align:left">
<td class="last right-text-pad" style="word-break:break-word;-webkit-hyphens:auto;-moz-hyphens:auto;hyphens:auto;text-align:left;vertical-align:top;padding:0px 0px 10px;padding-right:0px;border-collapse:collapse !important">
<p style='margin:0 0 0 10px;display:block;font-family:"Helvetica", "Arial", sans-serif;font-weight:normal;padding:0;margin-bottom:10px;text-align:left;line-height:19px;font-size:12px;color:#888888'>
<strong>Sent By:</strong>
<br>
TINYpulse
<br>
920 Elliot Avenue West
<br>
Seattle, Wa 98119
</p>
<p style='margin:0 0 0 10px;display:block;font-family:"Helvetica", "Arial", sans-serif;font-weight:normal;padding:0;margin-bottom:10px;text-align:left;line-height:19px;font-size:12px;color:#888888'>
<a href="http://tinypulse-staging.herokuapp.com/terms-of-use" style="color:#ea7531;text-decoration:none !important;font-weight:normal !important">Terms</a>
|
<a href="http://tinypulse-staging.herokuapp.com/privacy-policy" style="color:#ea7531;text-decoration:none !important;font-weight:normal !important">Privacy</a>
|
<a href="http://tinypulse-staging.herokuapp.com/n/u?mt=73d5f5741d088864855833" style="color:#ea7531;text-decoration:none !important;font-weight:normal !important">Unsubscribe</a>
</p>
</td>
<td class="expander" style="word-break:break-word;-webkit-hyphens:auto;-moz-hyphens:auto;hyphens:auto;text-align:left;vertical-align:top;visibility:hidden;width:0px;border-collapse:collapse !important;padding:0 !important"></td>
</tr>
</table>
</td>
<td class="wrapper last" style="word-break:break-word;-webkit-hyphens:auto;-moz-hyphens:auto;hyphens:auto;text-align:left;vertical-align:top;position:relative;padding:10px 20px 0px 0px;padding-right:0px;border-collapse:collapse !important">
<table class="five columns" style="border-spacing:0;border-collapse:collapse;padding:0;text-align:left;vertical-align:top;margin:0 auto;width:30px">
<tr style="padding:0;vertical-align:top;text-align:left">
<td class="left-text-pad" style="word-break:break-word;-webkit-hyphens:auto;-moz-hyphens:auto;hyphens:auto;text-align:left;vertical-align:top;padding:0px 0px 10px;border-collapse:collapse !important">
<div>
<table style="border-spacing:0;border-collapse:collapse;padding:0;vertical-align:top;text-align:left">
<tr style="padding:0;vertical-align:top;text-align:left">
<td style="word-break:break-word;-webkit-hyphens:auto;-moz-hyphens:auto;hyphens:auto;text-align:left;vertical-align:top;padding:0px 0px 10px;border-collapse:collapse !important">
<a href="https://www.facebook.com/TINYpulse" style="color:#ea7531;font-weight:600;text-decoration:none !important">
<img alt="Like TINYpulse on Facebook" src="http://tinypulse-staging.herokuapp.com/assets/email/facebook.png" style="outline:none;text-decoration:none;-ms-interpolation-mode:bicubic;width:auto;display:block;float:left;clear:both;max-width:100%;border:none">
</a>
</td>
</tr>
</table>
</div>
<div>
<table style="border-spacing:0;border-collapse:collapse;padding:0;vertical-align:top;text-align:left">
<tr style="padding:0;vertical-align:top;text-align:left">
<td style="word-break:break-word;-webkit-hyphens:auto;-moz-hyphens:auto;hyphens:auto;text-align:left;vertical-align:top;padding:0px 0px 10px;border-collapse:collapse !important">
<a href="https://twitter.com/TINYpulse" style="color:#ea7531;font-weight:600;text-decoration:none !important">
<img alt="Follow TINYpulse on Twitter" src="http://tinypulse-staging.herokuapp.com/assets/email/twitter.png" style="outline:none;text-decoration:none;-ms-interpolation-mode:bicubic;width:auto;display:block;float:left;clear:both;max-width:100%;border:none">
</a>
</td>
</tr>
</table>
</div>
</td>
<td class="expander" style="word-break:break-word;-webkit-hyphens:auto;-moz-hyphens:auto;hyphens:auto;text-align:left;vertical-align:top;visibility:hidden;width:0px;border-collapse:collapse !important;padding:0 !important"></td>
</tr>
</table>
</td>
</tr>
</table>
</center>
</td>
</table>
</center>
</td>
</tr>
</table>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment