use table formatting instead of a div

someengineering · Jan 12, 2024 · ada8621 · ada8621
1 parent 0974646
commit ada8621
Showing 1 changed file with 53 additions and 55 deletions.
diff --git a/fixbackend/notification/templates/verify_email.html b/fixbackend/notification/templates/verify_email.html
@@ -9,69 +9,67 @@
 </head>
 
 <body>
-    <span class="span"
-        style="font-family: Nunito Sans, sans-serif; background-color: #fff;display: flex;max-width: 600px;flex-direction: column;padding: 29px 30px;">
-        <div class="div">
-            <div class="div-2">
-                <img loading="lazy" width="64" style="display: block; margin-left: auto; margin-right: auto;"
+    <table width="600"
+        style="font-family: Nunito Sans, sans-serif; background-color: #fff; padding: 29px 30px; border-collapse: collapse;">
+        <tr>
+            <td style="text-align: center;">
+                <img loading="lazy" width="64"
                     src="data:image/png;base64,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"
-                    class="img-2">
+                    alt="Logo">
                 <br />
-                <div class="div-3" style="font-size: x-large; text-align: center;">
-                    <span style="color: #1C4396">Welcome</span>
-                    <span style="color: rgba(100, 141, 229, 1)">to FIX!</span>
-                </div>
-            </div>
-        </div>
-        <div class="div-4">
-            <div style="text-align: center;">
                 <br />
+                <div style="font-size: x-large; color: #1C4396; text-align: center;">Welcome <span
+                        style="color: rgba(100, 141, 229, 1)">to FIX!</span></div>
+
+                <br />
+            </td>
+        </tr>
+        <tr>
+            <td style="text-align: center;">
                 <span style="font-weight: 800; font-size: 18px; color: rgba(17, 24, 39, 1);">
                     Please verify your email address
                 </span>
-            </div>
-            <br>
-            <span style="color: rgba(17, 24, 39, 1)">
-                Simply click the link below to finish creating your account.
-            </span>
-        </div>
-        <span class="span-2">
-            <div class="div-6">
-                <div class="invite-button-container" style="text-align: center;margin-top: 20px;margin-bottom: 20px;">
-                    <a href="{{ verification_link }}" class="invite-button"
-                        style="background-color: rgb(52, 71, 193);color: white;padding: 10px 20px;text-align: center;text-decoration: none;display: inline-block;font-size: 16px;margin: 4px 2px;cursor: pointer;border: none;border-radius: 20px;">Verify
-                        Email</a>
+                <br /><br />
+                <div style="color: rgba(17, 24, 39, 1);">
+                    Simply click the link below to finish creating your account.
                 </div>
-            </div>
-        </span>
-        <div class="div-7">
-            If you have any questions, drop our support team a message at
-            <span style=" font-weight: 800; text-decoration: underline; color: rgba(28, 67, 150, 1); ">
-                [email protected]
-            </span>
-        </div>
-        <div style="color: #1c4396;text-align: center; margin-top: 28px; font: 400 12px/18px Ubuntu, sans-serif;">
-            <span style=" color: rgba(75, 85, 99, 1); ">
-                This email is intended to:
-            </span>
-            <span style=" font-weight: 600; color: rgba(28, 67, 150, 1); ">
-                {{ email }}
-            </span>
-            <br>
-            <span style=" color: rgba(75, 85, 99, 1); ">
-                For more information please visit us at
-            </span>
-            <a href="https://fix.tt/"
-                style=" font-weight: 600; text-decoration: underline; color: rgba(28, 67, 150, 1); " target="_blank">
-                fix.tt
-            </a>
-            <br>
-            <span style=" font-family: Nunito Sans, sans-serif; color: rgba(75, 85, 99, 1); ">
-                © 2024 Some Engineering Inc. All rights reserved.
-            </span>
-        </div>
-    </span>
+                <br />
+            </td>
+        </tr>
+        <tr>
+            <td style="text-align: center;">
+                <a href="{{ verification_link }}"
+                    style="background-color: rgb(52, 71, 193); color: white; padding: 10px 20px; text-decoration: none; font-size: 16px; border-radius: 20px; display: inline-block; cursor: pointer;">
+                    Verify Email
+                </a>
+            </td>
+        </tr>
+        <tr>
+            <td style="text-align: center;">
+                <br />
 
+                If you have any questions, drop our support team a message at <a href="mailto:[email protected]"
+                    style="font-weight: 800; text-decoration: underline; color: rgba(28, 67, 150, 1);">[email protected]</a>
+            </td>
+        </tr>
+        <tr>
+            <td style="text-align: center; color: #1c4396; font: 400 12px/18px Ubuntu, sans-serif;">
+                <br />
+                <br />
+                <span style="color: rgba(75, 85, 99, 1);">
+                    This email is intended to: <span style="font-weight: 600; color: rgba(28, 67, 150, 1);">{{ email
+                        }}</span>
+                </span>
+                <div>
+                    <span style="color: rgba(75, 85, 99, 1);">For more information please visit us at <a
+                            href="https://fix.tt/"
+                            style="font-weight: 600; text-decoration: underline; color: rgba(28, 67, 150, 1);"
+                            target="_blank">fix.tt</a></span>
+                </div>
+                <span style="color: rgba(75, 85, 99, 1);">© 2024 Some Engineering Inc. All rights reserved.</span>
+            </td>
+        </tr>
+    </table>
 </body>
 
 </html>