login email fixes

Wave-Studio · Jan 19, 2024 · 33e3b25 · 33e3b25
1 parent 8ddf2c6
commit 33e3b25
Show file tree

Hide file tree

Showing 3 changed files with 2,530 additions and 27 deletions.
diff --git a/emails/login.tsx b/emails/login.tsx
@@ -38,7 +38,7 @@ export default function LoginEmail({ otp = "123456" }: { otp: string }) {
         }}
       >
         <Body className="bg-white text-gray-800 text-center">
-          <Preview>Your autorication code to log in to Events</Preview>
+          <Preview>Your authorization code to log in to Events</Preview>
           <Container className="my-8">
             <Img
               src={`https://events.deno.dev/orange-logo.png`}
@@ -53,12 +53,12 @@ export default function LoginEmail({ otp = "123456" }: { otp: string }) {
               Enter the following code to finish logging in.
             </Heading>
             {/* Some of the more jank classes I've written */}
-            <Text className="text-2xl font-medium mt-20 mb-44 bg-gray-200 rounded-md w-max mx-auto tracking-[1em] pl-6 pr-[calc(1.5rem-1em)] py-3 ">
-              {otp}
+            <Text className="text-2xl font-medium mt-20 mb-44 bg-gray-200 rounded-md w-max mx-auto px-6 py-3 ">
+              <span className="tracking-[1em]">{otp.slice(0, 5)}</span>
+              <span>{otp.slice(5)}</span>
             </Text>
-
             <Text>
-              You can safly ignore this email if you did not request this login
+              You can safely ignore this email if you did not request this login
               code.
             </Text>
           </Container>

diff --git a/out/login.html b/out/login.html
@@ -10,4 +10,4 @@
     * {
       font-family: 'Inter', sans-serif;
     }
-  </style></head><body style="background-color:rgb(255,255,255);color:rgb(31,41,55);text-align:center"><div style="display:none;overflow:hidden;line-height:1px;opacity:0;max-height:0;max-width:0">Your autorication code to log in to Events<div> ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏</div></div><table align="center" width="100%" border="0" cellPadding="0" cellSpacing="0" role="presentation" style="max-width:37.5em;margin-top:2rem;margin-bottom:2rem"><tbody><tr style="width:100%"><td><img alt="Events Logo" height="40" src="https://events.deno.dev/orange-logo.png" style="display:block;outline:none;border:none;text-decoration:none;margin-left:auto;margin-right:auto" width="40"/><h1 class="text" style="margin-top:0.5rem;font-size:1.5rem;line-height:2rem;font-weight:700">Events</h1><h1 style="margin-top:2.5rem;margin-bottom:0.5rem">Verify Your Identity</h1><h1 style="font-size:1.125rem;line-height:1.75rem;font-weight:500;margin-top:0px">Enter the following code to finish logging in.</h1><p class="" style="font-size:1.5rem;line-height:2rem;margin:16px 0;font-weight:500;margin-top:5rem;margin-bottom:11rem;background-color:rgb(229,231,235);border-radius:0.375rem;width:max-content;margin-left:auto;margin-right:auto;letter-spacing:1em;padding-left:1.5rem;padding-right:calc(1.5rem - 1em);padding-top:0.75rem;padding-bottom:0.75rem">123456</p><p style="font-size:14px;line-height:24px;margin:16px 0">You can safly ignore this email if you did not request this login code.</p></td></tr></tbody></table></body></html>
+  </style></head><body style="background-color:rgb(255,255,255);color:rgb(31,41,55);text-align:center"><div style="display:none;overflow:hidden;line-height:1px;opacity:0;max-height:0;max-width:0">Your authorization code to log in to Events<div> ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏</div></div><table align="center" width="100%" border="0" cellPadding="0" cellSpacing="0" role="presentation" style="max-width:37.5em;margin-top:2rem;margin-bottom:2rem"><tbody><tr style="width:100%"><td><img alt="Events Logo" height="40" src="https://events.deno.dev/orange-logo.png" style="display:block;outline:none;border:none;text-decoration:none;margin-left:auto;margin-right:auto" width="40"/><h1 class="text" style="margin-top:0.5rem;font-size:1.5rem;line-height:2rem;font-weight:700">Events</h1><h1 style="margin-top:2.5rem;margin-bottom:0.5rem">Verify Your Identity</h1><h1 style="font-size:1.125rem;line-height:1.75rem;font-weight:500;margin-top:0px">Enter the following code to finish logging in.</h1><p class="" style="font-size:1.5rem;line-height:2rem;margin:16px 0;font-weight:500;margin-top:5rem;margin-bottom:11rem;background-color:rgb(229,231,235);border-radius:0.375rem;width:max-content;margin-left:auto;margin-right:auto;padding-left:1.5rem;padding-right:1.5rem;padding-top:0.75rem;padding-bottom:0.75rem"><span style="letter-spacing:1em">12345</span><span>6</span></p><p style="font-size:14px;line-height:24px;margin:16px 0">You can safely ignore this email if you did not request this login code.</p></td></tr></tbody></table></body></html>