Merge 71ba4ea into 1292eec

andela · Jan 4, 2019 · 8916aaf · 8916aaf
2 parents 1292eec + 71ba4ea
commit 8916aaf
Showing 1 changed file with 53 additions and 33 deletions.
diff --git a/server/helpers/emailTemplates.js b/server/helpers/emailTemplates.js
@@ -1,6 +1,9 @@
+/* eslint-disable max-len */
 import dotenv from 'dotenv';
 
 dotenv.config();
+// eslint-disable-next-line max-len
+const logoUrl = 'https://res.cloudinary.com/vivavalinor/image/upload/v1546419888/Logo.png';
 /**
  * @description verifyEmailMessage contains the email message template
  * @param {string} token - The token generated for the user
@@ -20,17 +23,22 @@ const verifyEmailMessage = (token) => {
   return {
     subject: 'Welcome to Author\'s Haven! Please Confirm your email',
     body:
-    `<div style="height: 20em, background-color: #E6FFED; 
-      border: 1px solid black; padding: 0.5em;">
-        <p>
-          <a href="${process.env.FRONT_END_BASE_URL}/VerifyPage?token=${token}">
-          <strong>
-            CLICK HERE!
-          </strong>
-          </a> 
-          to verify your email
-        </p>
-      </div>`,
+    `<div style="padding:0.5em; font-family:sans-serif; margin: 0 auto;">
+      <div style="background-color: #e8e9ea; height: 6em; padding-top: 3em">
+        <div style="height: 3em;  background-image: url(${logoUrl}); background-repeat: no-repeat; background-size: contain; background-position: center;">
+        </div>
+      </div>
+      <div style="text-align: center; padding: 3em 0;">
+        <h1 style="font-weight:400;">Thanks for signing up!</h1>
+        <p>Click the button below and verify your email.</p>
+        <a style="margin: 1em auto;display: block;height: 25px;background: #007fff;text-align: center;border-radius: 5px;color: white;padding: 0.8em 0.6em 0.2em;width:120px; text-decoration:none" href="${process.env.API_BASE_URL}/users/verify?token=${token}">Verify Email</a>
+        <p>This link will expire in one hour.</p>
+      </div>
+      <div style="padding: 0.1em; bottom: 0; text-align: center; font-size: 0.8em">
+        <hr style="height:1px; border:none; color:#e8e9ea; background-color:#e8e9ea; width:60%; text-align:center; margin: 0 auto;">
+        <p>&#169; 2018 Author's Haven</p>
+      </div>
+    </div>`,
   };
 };
 
@@ -51,36 +59,48 @@ const loginLinkMessage = (loginUrl, token) => {
   return {
     subject: 'Welcome to Author\'s Haven',
     body:
-    `<div>
-      <p>Click
-        <a href="${loginUrl}">
-          <strong>here</strong>
-        </a>
-         and confirm that you would like to login. 
-         This link will expire in one hour.
-      </p>
-    </div>
-    `
+    `<div style="padding:0.5em; font-family:sans-serif; margin: 0 auto;">
+      <div style="background-color: #e8e9ea; height: 6em; padding-top: 3em">
+        <div style="height: 3em;  background-image: url(${logoUrl} background-repeat: no-repeat; background-size: contain; background-position: center;">
+        </div>
+      </div>
+      
+      <div style="text-align: center; padding: 3em 0;">
+        <p>Click and confirm that you want to sign in to Author's Haven. This link will expire in one hour.</p>
+        <a style="margin: 1em auto;display: block;height: 25px;background: #007fff;text-align: center;border-radius: 5px;color: white;padding: 0.8em 0.6em 0.2em;width:120px; text-decoration:none" href="${loginUrl}">Login</a>
+        <p style="padding-top: 2em; text-align: center; font-size: 0.8em">Thanks <br>Author's Haven</p>
+      </div>
+      <div style="padding: 0.1em; bottom: 0; text-align: center; font-size: 0.8em">
+        <hr style="height:1px; border:none; background-color:#e8e9ea; width:60%; text-align:center; margin: 0 auto;">
+        <p>&#169; 2018 Author's Haven</p>
+      </div>
+    </div>`
   };
 };
 
 const deleteAccountMessage = (token) => {
   const message = {
     subject: 'Delete you Author\'s Haven account',
     body:
-    `<div>
-      <p>Click
-        <a href=
-          "${process.env.API_BASE_URL}/users/account/delete?token=${token}">
+    `<div style="padding:2em; font-family:sans-serif; margin: 0 auto;">
+      <div style="background-color: #e8e9ea; height: 6em; padding-top: 3em">
+        <div style="height: 3em;  background-image: url(${logoUrl}); background-repeat: no-repeat; background-size: contain; background-position: center;">
+        </div>
+      </div>
+      <div style="text-align: center; padding: 3em 0;">
+       <p>We have received a request to delete your account. Click and confirm that you want to delete your Author's Haven account. This link will expire in one hour.</p>
+       <a style="margin: 1em auto;display: block;height: 25px;background: #ff0000;text-align: center;border-radius: 5px;color: white;padding: 0.8em 0.6em 0.2em;width:120px; text-decoration:none" href="${process.env.API_BASE_URL}/users/account/delete?token=${token}">Delete Account</a>
+        <p>If this action was not initiated by you, click
+          <a style="text-decoration:none;" href="fakeloguseroutofaccounts">
           <strong>here</strong>
-        </a>
-         to delete your account.
-         <p>If this action was not initiated by you, click
-            <a href="fakeloguseroutofaccounts">
-              <strong>here</strong>
-            </a>
-         </p>
-      </p>
+          </a>
+        </p>
+        <p style="padding-top: 2em; text-align: center; font-size: 0.8em">Thanks <br>Author's Haven</p>
+      </div>
+      <div style="padding: 0.1em; bottom: 0; text-align: center; font-size: 0.8em">
+        <hr style="height:1px; border:none; background-color:#e8e9ea; width:60%; text-align:center; margin: 0 auto;">
+        <p>&#169; 2018 Author's Haven</p>
+      </div>
     </div>
     `
   };