Further changes to the notification mails to improve mail client

compatibility
This commit is contained in:
Steffen Schaefer committed 2016-07-21 11:16:20 +02:00
1 parent 6c2f37ab97
commit b54fc14bbf
3 files changed
+66 -48

No files matched your search

@@ -1,34 +1,39 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" "http://www.w3.org/TR/REC-html40/loose.dtd">
<html>
<head>
<title>${title}</title>
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<style>
.linkButton:active{display:inline-block;background-color:#337ab7;border-radius:4px;color:#ffffff;border:1px solid #2e6da4;text-decoration:none}
.linkButton:visited{display:inline-block;background-color:#337ab7;border-radius:4px;color:#ffffff;border:1px solid #2e6da4;text-decoration:none}
.linkButton:hover{background-color:#2b618e;border:1px solid #204d74}
</style>
</head>
<body marginheight="0" topmargin="0" marginwidth="0" bgcolor="#e3e3e3" offset="0" leftmargin="0" style="background-color: #e3e3e3;">
<div class="body" style="background-color:#e3e3e3;color:black;padding:40px;max-width:800px;margin:0 auto;margin-bottom:100px;font-family:'Open Sans', sans-serif">
<div class="main" style="border:1px solid black">
<div class="headerWrapper" style="background-color:black;font-size:16px;border-bottom:.2em solid #efaa00;color:white">
<div class="header" style="border:10px solid black">
<img src="cid:saplogo" class="sapLogo" alt="SAP " style="height:30px;width:auto;vertical-align:middle"><span class="sailingAnalytics" style="display:inline-block;line-height:30px;vertical-align:middle">Sailing Analytics</span>
</div>
</div>
<div class="contentWrapper" style="background-color:white">
<div class="content" style="border:20px solid white;border-right:30px solid white;border-left:30px solid white;min-height:200px">
${content}
</div>
</div>
</div>
<div class="footer" style="margin:30px 10% 200px 10%;text-align:center;font-size:13px">
<p>${subscription_information}</p>
<p>${site}</p>
<p>${footer_links}</p>
</div>
</div>
</body>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" "http://www.w3.org/TR/REC-html40/loose.dtd">
<!--
use a css inliner tool like https://putsmail.com/inliner to inline css
-->
<html>
<head>
<title>${title}</title>
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<style>
.linkButton:active{display:inline-block;background-color:#337ab7;border-radius:4px;color:#ffffff;border:1px solid #2e6da4;text-decoration:none}
.linkButton:visited{display:inline-block;background-color:#337ab7;border-radius:4px;color:#ffffff;border:1px solid #2e6da4;text-decoration:none}
.linkButton:hover{background-color:#2b618e;border:1px solid #204d74}
</style>
</head>
<body marginheight="0" topmargin="0" marginwidth="0" bgcolor="#e3e3e3" offset="0" leftmargin="0" style="background-color: #e3e3e3;">
<div class="body" style="background-color:#e3e3e3;color:black;padding:40px;max-width:800px;margin:0 auto;margin-bottom:100px;font-family:'Open Sans', sans-serif">
<div class="main" style="border:1px solid black">
<div class="headerWrapper" style="background-color:black;font-size:16px;border-bottom:.2em solid #efaa00;color:white">
<div class="header" style="border:10px solid black">
<img src="cid:saplogo" class="sapLogo" alt="SAP" style="height:30px;width:auto;float:left"><span class="sailingAnalytics" style="display:inline-block;line-height:16px;border-top:7px solid black;border-bottom:7px solid black;border-left:5px solid black">Sailing Analytics</span>
<div class="clear" style="clear:both"></div>
</div>
</div>
<div class="contentWrapper" style="background-color:white">
<div class="content" style="border:20px solid white;border-right:30px solid white;border-left:30px solid white;min-height:200px">
${content}
</div>
<div class="clear" style="clear:both"></div>
</div>
</div>
<div class="footer" style="margin:30px 10% 200px 10%;text-align:center;font-size:13px">
<p>${subscription_information}</p>
<p>${site}</p>
<p>${footer_links}</p>
</div>
</div>
</body>
</html>
@@ -10,7 +10,7 @@
<meta name="viewport" content="width=device-width,initial-scale=1.0" />
<style type="text/css">
.buttonContainer {
display: inline-block;
float: left;
border-top: 10px solid white;
border-right: 10px solid white;
}
@@ -80,13 +80,24 @@
.sapLogo {
height: 30px;
width: auto;
vertical-align: middle;
float: left;
}
.sailingAnalytics {
display: inline-block;
line-height: 30px;
vertical-align: middle;
line-height: 16px;
border-top: 7px solid black;
border-bottom: 7px solid black;
border-left: 5px solid black;
}
.clear {
clear: both;
}
.paragraph {
border-top: 5px solid white;
border-bottom: 5px solid white;
}
</style>
</head>
@@ -94,14 +105,16 @@
<div class="body">
<div class="main">
<div class="headerWrapper">
<div class="header">
<img src="cid:saplogo" class="sapLogo" alt="SAP "/><span class="sailingAnalytics">Sailing Analytics</span>
</div>
<div class="header">
<img src="cid:saplogo" class="sapLogo" alt="SAP"/><span class="sailingAnalytics">Sailing Analytics</span>
<div class="clear"></div>
</div>
</div>
<div class="contentWrapper">
<div class="content">
${content}
</div>
<div class="content">
${content}
</div>
<div class="clear"></div>
</div>
</div>
<div class="footer">