digest tpl

src/views/emails/digest.tpl

@@ -1,9 +1,30 @@
-<p>[[email:greeting_with_name, {username}]],</p>
+<!-- IMPORT emails/partials/header.tpl -->
 
-<!-- IF notifications.length -->
-<p>[[email:digest.notifications, {site_title}]]</p>
+<!-- Email Body : BEGIN -->
+<table role="presentation" cellspacing="0" cellpadding="0" border="0" align="center" width="100%" style="max-width: 600px;">
 
-<ul>
+	<!-- Hero Image, Flush : BEGIN -->
+	<tr>
+		<td bgcolor="#efeff0" style="text-align: center; background-image: url({url}/assets/images/emails/triangularbackground.png); background-size: cover; background-repeat: no-repeat;">
+			<img src="{url}/assets/images/emails/digestheader.png" width="750" height="304" border="0" align="center" style="width: 750px; height: 304px; max-width: 300px; height: auto; font-family: sans-serif; font-size: 15px; line-height: 20px; color: #555555;" class="g-img">
+		</td>
+	</tr>
+	<!-- Hero Image, Flush : END -->
+
+	<!-- 1 Column Text + Button : BEGIN -->
+	<tr>
+		<td bgcolor="#efeff0">
+			<table role="presentation" cellspacing="0" cellpadding="0" border="0" width="100%">
+				<tr>
+					<td style="padding: 40px; font-family: sans-serif; font-size: 15px; line-height: 20px; color: #555555;">
+						<h1 style="margin: 0 0 10px 0; font-family: sans-serif; font-size: 24px; line-height: 27px; color: #333333; font-weight: normal;">[[email:greeting_with_name, {username}]],</h1>
+					</td>
+				</tr>
+				<!-- IF notifications.length -->
+				<tr>
+					<td style="padding: 40px; font-family: sans-serif; font-size: 15px; line-height: 20px; color: #555555;">
+						<p style="margin: 0;">[[email:digest.notifications, {site_title}]]</p>
+						<ul>
 							<!-- BEGIN notifications -->
 							<li style="text-decoration: none; list-style-type: none; padding-bottom: 0.5em;">
 								<a href="{url}{notifications.path}">
@@ -16,13 +37,14 @@
 								</a>
 							</li>
 							<!-- END notifications -->
-</ul>
-
-<hr />
-<!-- ENDIF notifications.length -->
-
-<p>[[email:digest.latest_topics, {site_title}]]</p>
-<ul>
+						</ul>
+					</td>
+				</tr>
+				<!-- ENDIF notifications.length -->
+				<tr>
+					<td style="padding: 40px; font-family: sans-serif; font-size: 15px; line-height: 20px; color: #555555;">
+						<p style="margin: 0;">[[email:digest.latest_topics, {site_title}]]</p>
+						<ul>
 							<!-- IF recent.length -->
 							<!-- BEGIN recent -->
 							<li style="text-decoration: none; list-style-type: none; padding-bottom: 0.5em;">
@@ -36,15 +58,36 @@
 								[[email:digest.no_topics, [[email:digest.{interval}]]]]
 							</li>
 							<!-- ENDIF recent.length -->
-</ul>
+						</ul>
+					</td>
+				</tr>
+				<tr>
+					<td style="padding: 0 40px; font-family: sans-serif; font-size: 15px; line-height: 20px; color: #555555;">
+						<!-- Button : BEGIN -->
+						<table role="presentation" cellspacing="0" cellpadding="0" border="0" align="center" style="margin: auto;">
+							<tr>
+								<td style="border-radius: 3px; background: #222222; text-align: center;" class="button-td">
+									<a href="{url}" style="background: #222222; border: 15px solid #222222; font-family: sans-serif; font-size: 13px; line-height: 1.1; text-align: center; text-decoration: none; display: block; border-radius: 3px; font-weight: bold;" class="button-a">
+										<span style="color:#ffffff;" class="button-link">&nbsp;&nbsp;&nbsp;&nbsp;[[email:digest.cta, {site_title}]]&nbsp;&nbsp;&nbsp;&nbsp;</span>
+									</a>
+								</td>
+							</tr>
+						</table>
+						<!-- Button : END -->
+					</td>
+				</tr>
+				<tr>
+					<td style="padding: 40px; font-family: sans-serif; font-size: 15px; line-height: 20px; color: #555555;">
+						<h2 style="margin: 0 0 10px 0; font-family: sans-serif; font-size: 18px; line-height: 21px; color: #333333; font-weight: bold;">[[email:closing]]</h2>
+						<p style="margin: 0;">{site_title}</p>
+					</td>
+				</tr>
+			</table>
+		</td>
+	</tr>
+	<!-- 1 Column Text + Button : END -->
 
-<p>
-	<a href="{url}">[[email:digest.cta, {site_title}]]</a>
-</p>
+</table>
+<!-- Email Body : END -->
 
 <!-- IMPORT emails/partials/footer.tpl -->
-
-<hr />
-<p>
-	[[email:digest.unsub.info]] <a href="{url}/user/{userslug}/settings">[[email:unsub.cta]]</a>.
-</p>