fix(apps): email OTP logo+email OTP overflow (#2579)

proofzero · Aug 4, 2023 · 5fdab37 · 5fdab37
1 parent 003cac8
commit 5fdab37
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 3 deletions.
diff --git a/packages/design-system/src/molecules/email-otp-validator/EmailOTPValidator.tsx b/packages/design-system/src/molecules/email-otp-validator/EmailOTPValidator.tsx
@@ -123,9 +123,9 @@ export default function EmailOTPValidator({
       <section className="flex-1">
         <div className="flex flex-col items-center mt-4 mb-8">
           <Text className="text-gray-500 dark:text-gray-400">
-            We've sent a code to
+            We&apos;ve sent a code to
           </Text>
-          <Text className="text-gray-500 dark:text-gray-400 font-medium">
+          <Text className="text-gray-500 dark:text-gray-400 font-medium w-[368px] inline-block float-left whitespace-nowrap truncate">
             {email}
           </Text>
         </div>

diff --git a/platform/email/emailTemplate.ts b/platform/email/emailTemplate.ts
@@ -97,7 +97,9 @@ const EmailTemplateBase = (
           }
 
           .logo {
+            display: block
             max-width: 375px;
+            max-height: 48px;
             margin-bottom: 37px;
           }
 
@@ -167,7 +169,7 @@ const EmailTemplateBase = (
         <div class="container adaptive">
           <div class="content adaptive">
             <div class="heading-logo">
-              <img class="logo" src="${logoURL}" alt="" style="display: block" />
+              <img class="logo" src="${logoURL}" alt="" style="display:block; max-width: 375px; max-height: 48px;"/>
             </div>
             ${content}
             <div class="divider"></div>