better email template

stackernews · Jan 14, 2025 · 7c23dc9 · 7c23dc9
1 parent 08a148e
commit 7c23dc9
Showing 1 changed file with 11 additions and 2 deletions.
diff --git a/pages/api/auth/[...nextauth].js b/pages/api/auth/[...nextauth].js
@@ -398,6 +398,7 @@ async function sendVerificationRequest ({
     const { server, from } = provider
 
     const site = new URL(url).host
+    // const isPWA = new URL(url).searchParams.get('pwa') === 'true'
 
     nodemailer.createTransport(server).sendMail(
       {
@@ -446,13 +447,17 @@ const html = ({ url, token, site, email }) => {
   <table width="100%" border="0" cellspacing="20" cellpadding="0" style="background: ${mainBackgroundColor}; max-width: 600px; margin: auto; border-radius: 10px;">
     <tr>
       <td align="center" style="padding: 10px 0px 0px 0px; font-size: 18px; font-family: Helvetica, Arial, sans-serif; color: ${textColor};">
-        login as <strong>${escapedEmail}</strong>
+        login with <strong>${escapedEmail}</strong>
       </td>
     </tr>
     <tr>
       <td align="center" style="padding: 20px 0;">
         <table border="0" cellspacing="0" cellpadding="0">
           <tr>
+            <td align="center" style="padding: 10px 0px 0px 0px; font-size: 18px; font-family: Helvetica, Arial, sans-serif; color: ${textColor};">
+              using the app? copy the magic code
+            </td>
+            <tr><td height="10px"></td></tr>
             <td align="center" style="padding: 10px 0px 0px 0px; font-size: 36px; font-family: Helvetica, Arial, sans-serif; color: ${textColor};">
               <strong>${token}</strong>
             </td>
@@ -461,9 +466,13 @@ const html = ({ url, token, site, email }) => {
       </td>
     </tr>
     <tr>
-      <td align="center" style="padding: 20px 0;">
+      <td align="center" style="padding: 10px 0;">
         <table border="0" cellspacing="0" cellpadding="0">
           <tr>
+            <td align="center" style="padding: 10px 0px 0px 0px; font-size: 18px; font-family: Helvetica, Arial, sans-serif; color: ${textColor};">
+              on browser? click the button below
+            </td>
+            <tr><td height="10px"></td></tr>
             <td align="center" style="border-radius: 5px;" bgcolor="${buttonBackgroundColor}"><a href="${url}" target="_blank" style="font-size: 18px; font-family: Helvetica, Arial, sans-serif; color: ${buttonTextColor}; text-decoration: none; text-decoration: none;border-radius: 5px; padding: 10px 20px; border: 1px solid ${buttonBackgroundColor}; display: inline-block; font-weight: bold;">login</a></td>
           </tr>
         </table>