basic, full html responsive email
This commit is contained in:
Dan Mindru
parent
092af0b177
commit
4ab2085673
|
|
@ -0,0 +1,5 @@
|
|||
/vendor/
|
||||
/node_modules/
|
||||
/build/
|
||||
/application/
|
||||
.DS_Store
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 2.9 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.7 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 3.2 KiB |
Binary file not shown.
Binary file not shown.
Binary file not shown.
|
After Width: | Height: | Size: 1.9 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 73 KiB |
|
|
@ -0,0 +1,189 @@
|
|||
<!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">
|
||||
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
||||
<title>A Simple Responsive HTML Email</title>
|
||||
<style type="text/css">
|
||||
body {margin: 0; padding: 0; min-width: 100%!important;}
|
||||
img {height: auto;}
|
||||
.content {width: 100%; max-width: 760px;}
|
||||
.header {padding: 40px 30px 20px 30px;}
|
||||
.innerpadding {padding: 30px 30px 30px 30px;}
|
||||
.borderbottom {border-bottom: 1px solid #f2eeed;}
|
||||
.subhead {font-size: 14px; color: #888888; font-family: sans-serif;}
|
||||
.h1, .h2, .bodycopy {color: #153643; font-family: sans-serif;}
|
||||
.h1 {font-size: 24px; line-height: 38px; font-weight: normal; color:#888888;}
|
||||
.h2 {padding: 0 0 15px 0; font-size: 24px; line-height: 28px; font-weight: bold;}
|
||||
.bodycopy {font-size: 16px; line-height: 22px;}
|
||||
.button {text-align: center; font-size: 16px; font-family: sans-serif; font-weight: bold; padding: 0 30px 0 30px;}
|
||||
.button a {color: #888888; text-decoration: none;}
|
||||
.footer {padding: 20px 30px 15px 30px; color: #888888;}
|
||||
.footercopy {font-family: sans-serif; font-size: 14px; color: #888888;}
|
||||
.footercopy a {color: #888888; text-decoration: underline;}
|
||||
|
||||
@media only screen and (max-width: 550px), screen and (max-device-width: 550px) {
|
||||
body[yahoo] .hide {display: none!important;}
|
||||
body[yahoo] .buttonwrapper {background-color: transparent!important;}
|
||||
body[yahoo] .button {padding: 0px!important;}
|
||||
body[yahoo] .button a {background-color: #E4E4E4; padding: 15px 15px 13px!important;}
|
||||
body[yahoo] .unsubscribe {display: block; margin-top: 20px; padding: 10px 50px; background: #2f3942; border-radius: 5px; text-decoration: none!important; font-weight: bold;}
|
||||
}
|
||||
|
||||
/*@media only screen and (min-device-width: 601px) {
|
||||
.content {width: 760px !important;}
|
||||
.col585 {width: 585px!important;}
|
||||
.col700 {width: 700px!important;}
|
||||
}*/
|
||||
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body yahoo bgcolor="#f5f5f5">
|
||||
<table width="100%" bgcolor="#f5f5f5" border="0" cellpadding="0" cellspacing="0">
|
||||
<tr>
|
||||
<td>
|
||||
<!--[if (gte mso 9)|(IE)]>
|
||||
<table width="600" align="center" cellpadding="0" cellspacing="0" border="0">
|
||||
<tr>
|
||||
<td>
|
||||
<![endif]-->
|
||||
<table bgcolor="#ffffff" class="content" align="center" cellpadding="0" cellspacing="0" border="0">
|
||||
<tr>
|
||||
<td bgcolor="#E4E4E4" class="header">
|
||||
<!--[if (gte mso 9)|(IE)]>
|
||||
<table width="585" align="left" cellpadding="0" cellspacing="0" border="0">
|
||||
<tr>
|
||||
<td>
|
||||
<![endif]-->
|
||||
<table class="col585" align="left" border="0" cellpadding="0" cellspacing="0" style="width: 100%; max-width: 585px;">
|
||||
<tr>
|
||||
<td height="90">
|
||||
<table width="100%" border="0" cellspacing="0" cellpadding="0">
|
||||
<tr>
|
||||
<td class="subhead" style="padding: 0 0 0 3px;">
|
||||
We hope your day is going great
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="h1" style="padding: 0px 0 10px 0;">
|
||||
You got a new email
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
<!--[if (gte mso 9)|(IE)]>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
<![endif]-->
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="innerpadding borderbottom">
|
||||
<table width="100%" border="0" cellspacing="0" cellpadding="0">
|
||||
<tr>
|
||||
<td class="h2">
|
||||
Hi there,
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="bodycopy">
|
||||
This is a reply to your previous email. Uniquely conceptualize corporate alignments whereas resource-leveling users. Proactively unleash high-payoff technology vis-a-vis effective users. Assertively innovate performance based meta-services vis-a-vis exceptional sources. Intrinsicly provide access to covalent best practices rather than bleeding-edge manufactured products. Authoritatively leverage other's resource-leveling opportunities without sticky resources.
|
||||
<br/><br/>
|
||||
Competently coordinate highly efficient initiatives for robust manufactured products. Authoritatively reconceptualize interdependent expertise whereas e-business infomediaries. Dramatically procrastinate real-time experiences rather than resource-leveling convergence.
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="innerpadding borderbottom">
|
||||
<!--[if (gte mso 9)|(IE)]>
|
||||
<table width="700" align="left" cellpadding="0" cellspacing="0" border="0">
|
||||
<tr>
|
||||
<td>
|
||||
<![endif]-->
|
||||
<table class="col700" align="left" border="0" cellpadding="0" cellspacing="0" style="width: 100%; max-width: 700px;">
|
||||
<tr>
|
||||
<td>
|
||||
<table width="100%" border="0" cellspacing="0" cellpadding="0">
|
||||
<tr>
|
||||
<td class="bodycopy">
|
||||
Holisticly productize mission-critical applications with transparent methods of empowerment. Assertively administrate cost effective portals whereas enabled results. Monotonectally create timely vortals vis-a-vis premier.
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td style="padding: 20px 0 0 0;">
|
||||
<table class="buttonwrapper" bgcolor="#E4E4E4" border="0" cellspacing="0" cellpadding="0">
|
||||
<tr>
|
||||
<td class="button" height="45">
|
||||
<a href="#">View a file we sent</a>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
<!--[if (gte mso 9)|(IE)]>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
<![endif]-->
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="innerpadding borderbottom">
|
||||
<img class="fix" src="images/wide.png" width="100%" border="0" alt="" />
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="innerpadding bodycopy">
|
||||
Dramatically incubate compelling results and magnetic e-tailers. Holisticly maximize standardized results rather than leveraged functionalities. Professionally conceptualize fully tested solutions and diverse networks.
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="footer" bgcolor="#E4E4E4">
|
||||
<table width="100%" border="0" cellspacing="0" cellpadding="0">
|
||||
<tr>
|
||||
<td align="left" class="footercopy">
|
||||
<strong><a href="http://fadeit.dk" target="_blank" style="text-decoration:none;">fadeit.dk</a></strong>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td width="100%">
|
||||
<hr style="border-bottom:1px solid #C3C3C3; border-top:none; margin-bottom:20px;" />
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<table width="50%" align="left" border="0" cellpadding="0" cellspacing="0" style="margin-bottom:30px;">
|
||||
<td align="left" class="footercopy">
|
||||
<strong>Call 81100200 or email us at <a href="mailto:info@fadeit.dk" target="_blank" style="text-decoration:none;">info@fadeit.dk</a></strong><br/>
|
||||
Anelystparken 31D, 8381 Tilst, Aarhus, Denmark<br/>
|
||||
</td>
|
||||
</table>
|
||||
<table width="50%" align="right" border="0" cellpadding="0" cellspacing="0">
|
||||
<td align="right" class="footercopy">
|
||||
<img class="fix" src="images/icon.gif" width="90" height="90" border="0" alt="" />
|
||||
</td>
|
||||
</table>
|
||||
</tr>
|
||||
</table>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
<!--[if (gte mso 9)|(IE)]>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
<![endif]-->
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</body>
|
||||
</html>
|
||||
Loading…
Reference in New Issue