From 065b3a3a0322e8c5e2a005964a53ecab322a7a53 Mon Sep 17 00:00:00 2001
From: Julian Lam <julian@nodebb.org>
Date: Fri, 14 Jul 2017 15:36:18 -0400
Subject: [PATCH] notif_chat tpl

---
 public/images/emails/newtopic.png | Bin 0 -> 5060 bytes
 src/topics/follow.js              |   1 +
 src/views/emails/notif_chat.tpl   |  63 +++++++++++++++++++++++++-----
 3 files changed, 55 insertions(+), 9 deletions(-)
 create mode 100644 public/images/emails/newtopic.png

diff --git a/public/images/emails/newtopic.png b/public/images/emails/newtopic.png
new file mode 100644
index 0000000000000000000000000000000000000000..bc5718563acf28586eafc8a2190cc73c6b6ee117
GIT binary patch
literal 5060
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

literal 0
HcmV?d00001

diff --git a/src/topics/follow.js b/src/topics/follow.js
index 55f88ef304..f607edd9c2 100644
--- a/src/topics/follow.js
+++ b/src/topics/follow.js
@@ -259,6 +259,7 @@ module.exports = function (Topics) {
 								subject: '[' + (meta.config.title || 'NodeBB') + '] ' + title,
 								intro: '[[notifications:user_posted_to, ' + postData.user.username + ', ' + titleEscaped + ']]',
 								postBody: postData.content.replace(/"\/\//g, '"https://'),
+								username: data.userData.username,
 								userslug: data.userData.userslug,
 								topicSlug: postData.topic.slug,
 								showUnsubscribe: true,
diff --git a/src/views/emails/notif_chat.tpl b/src/views/emails/notif_chat.tpl
index f1d5a5fc42..275a5bf782 100644
--- a/src/views/emails/notif_chat.tpl
+++ b/src/views/emails/notif_chat.tpl
@@ -1,13 +1,58 @@
-<p>[[email:greeting_with_name, {username}]],</p>
+<!-- IMPORT emails/partials/header.tpl -->
 
-<p>{summary}:</p>
-<blockquote>{message.content}</blockquote>
+<!-- Email Body : BEGIN -->
+<table role="presentation" cellspacing="0" cellpadding="0" border="0" align="center" width="100%" style="max-width: 600px;">
 
-<a href="{url}/chats/{roomId}">[[email:notif.chat.cta]]</a>
+	<!-- 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/newtopic.png" width="300" height="300" border="0" align="center" style="width: 300px; height: 300px; 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 -->
 
-<!-- IMPORT emails/partials/footer.tpl -->
+	<!-- 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 40px 0px 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>
+						<p style="margin: 0 0 20px 0;">{summary}:</p>
+					</td>
+				</tr>
+				<tr>
+					<td style="padding: 0px 60px 40px 60px; font-family: sans-serif; font-size: 15px; line-height: 20px; color: #555555;">
+						{message.content}
+					</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}/chats/{roomId}" 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:notif.chat.cta]]&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 -->
+
+</table>
+<!-- Email Body : END -->
 
-<hr />
-<p>
-	[[email:notif.chat.unsub.info]] <a href="{url}/user/{userslug}/settings">[[email:unsub.cta]]</a>.
-</p>
\ No newline at end of file
+<!-- IMPORT emails/partials/footer.tpl -->