Rewrite email templates with pure hardcoded inline CSS for perfect email client rendering
All checks were successful
Deploy Beta (NATIVE) / deploy (push) Successful in 21s
All checks were successful
Deploy Beta (NATIVE) / deploy (push) Successful in 21s
This commit is contained in:
parent
d4c40e93da
commit
37af7defe5
3 changed files with 221 additions and 448 deletions
|
|
@ -1,262 +1,70 @@
|
|||
<!DOCTYPE html>
|
||||
|
||||
<html lang="en"><head>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta content="width=device-width, initial-scale=1.0" name="viewport">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Reset Your Password - Tradhox</title>
|
||||
<link href="https://fonts.googleapis.com/css2?family=Libre+Caslon+Text:ital,wght@0,400;0,700;1,400&family=Work+Sans:wght@400;500;600;700&display=swap" rel="stylesheet">
|
||||
<link href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:wght,FILL@100..700,0..1&display=swap" rel="stylesheet">
|
||||
<style>
|
||||
/* Base styles for email clients */
|
||||
body, table, td, a {
|
||||
-webkit-text-size-adjust: 100%;
|
||||
-ms-text-size-adjust: 100%;
|
||||
}
|
||||
table, td {
|
||||
mso-table-lspace: 0pt;
|
||||
mso-table-rspace: 0pt;
|
||||
}
|
||||
img {
|
||||
-ms-interpolation-mode: bicubic;
|
||||
border: 0;
|
||||
height: auto;
|
||||
line-height: 100%;
|
||||
outline: none;
|
||||
text-decoration: none;
|
||||
}
|
||||
/* Design System Colors & Fonts */
|
||||
:root {
|
||||
--surface: #fbf9f8;
|
||||
--on-surface: #1b1c1c;
|
||||
--primary-container: #6b1a2c;
|
||||
--on-primary-container: #ef8191;
|
||||
--on-primary: #ffffff;
|
||||
--secondary: #5f5e5b;
|
||||
--outline-variant: #dac0c2;
|
||||
--surface-container-low: #f5f3f3;
|
||||
--primary: #4d0218;
|
||||
|
||||
--font-headline: 'Libre Caslon Text', serif;
|
||||
--font-body: 'Work Sans', sans-serif;
|
||||
}
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
width: 100% !important;
|
||||
background-color: var(--surface-container-low);
|
||||
font-family: var(--font-body);
|
||||
color: var(--on-surface);
|
||||
-webkit-font-smoothing: antialiased;
|
||||
}
|
||||
|
||||
.wrapper {
|
||||
width: 100%;
|
||||
table-layout: fixed;
|
||||
background-color: #f5f3f3;
|
||||
padding-bottom: 60px;
|
||||
}
|
||||
|
||||
.main-container {
|
||||
background-color: #ffffff;
|
||||
margin: 40px auto 0;
|
||||
width: 100%;
|
||||
max-width: 600px;
|
||||
border: 1px solid #dac0c2;
|
||||
border-radius: 4px;
|
||||
overflow: hidden;
|
||||
box-shadow: 0 4px 20px rgba(107, 26, 44, 0.02);
|
||||
}
|
||||
|
||||
.header {
|
||||
padding: 40px 32px 32px;
|
||||
text-align: center;
|
||||
border-bottom: 1px solid #dac0c2;
|
||||
background-color: #fbf9f8;
|
||||
}
|
||||
|
||||
.brand-logo {
|
||||
font-family: var(--font-headline);
|
||||
font-size: 32px;
|
||||
font-weight: 700;
|
||||
color: #4d0218;
|
||||
font-style: italic;
|
||||
margin: 0;
|
||||
line-height: 40px;
|
||||
}
|
||||
|
||||
.content {
|
||||
padding: 48px 40px;
|
||||
background-color: #ffffff;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-family: var(--font-headline);
|
||||
font-size: 24px;
|
||||
font-weight: 600;
|
||||
color: #1b1c1c;
|
||||
margin: 0 0 24px;
|
||||
line-height: 32px;
|
||||
}
|
||||
|
||||
p {
|
||||
font-family: var(--font-body);
|
||||
font-size: 16px;
|
||||
line-height: 24px;
|
||||
color: #1b1c1c;
|
||||
margin: 0 0 24px;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.button-container {
|
||||
text-align: center;
|
||||
margin: 40px 0;
|
||||
}
|
||||
|
||||
.btn {
|
||||
display: inline-block;
|
||||
background-color: #6b1a2c;
|
||||
color: #ffffff;
|
||||
font-family: var(--font-body);
|
||||
font-size: 14px;
|
||||
font-weight: 600;
|
||||
text-decoration: none;
|
||||
padding: 14px 32px;
|
||||
border-radius: 2px;
|
||||
line-height: 20px;
|
||||
letter-spacing: 0.5px;
|
||||
}
|
||||
|
||||
.btn:hover {
|
||||
background-color: #4d0218;
|
||||
}
|
||||
|
||||
.secondary-text {
|
||||
color: #5f5e5b;
|
||||
font-size: 14px;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.divider {
|
||||
height: 1px;
|
||||
background-color: #dac0c2;
|
||||
margin: 32px 0;
|
||||
}
|
||||
|
||||
.footer {
|
||||
background-color: #f5f3f3;
|
||||
padding: 32px 40px;
|
||||
text-align: center;
|
||||
border-top: 1px solid #dac0c2;
|
||||
}
|
||||
|
||||
.footer p {
|
||||
font-size: 12px;
|
||||
color: #5f5e5b;
|
||||
line-height: 18px;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
.footer h4 {
|
||||
font-family: var(--font-headline);
|
||||
font-size: 16px;
|
||||
color: #1b1c1c;
|
||||
margin: 0 0 12px;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.security-tips {
|
||||
text-align: left;
|
||||
background-color: #fbf9f8;
|
||||
padding: 24px;
|
||||
border-radius: 4px;
|
||||
border: 1px solid #dac0c2;
|
||||
margin-top: 24px;
|
||||
}
|
||||
|
||||
.security-tips ul {
|
||||
margin: 0;
|
||||
padding-left: 20px;
|
||||
color: #5f5e5b;
|
||||
font-size: 14px;
|
||||
line-height: 22px;
|
||||
}
|
||||
|
||||
.links {
|
||||
margin-top: 24px;
|
||||
}
|
||||
|
||||
.links a {
|
||||
color: #5f5e5b;
|
||||
text-decoration: none;
|
||||
font-size: 12px;
|
||||
margin: 0 8px;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.links a:hover {
|
||||
color: #4d0218;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 600px) {
|
||||
.main-container {
|
||||
margin-top: 20px;
|
||||
border-radius: 0;
|
||||
border-left: none;
|
||||
border-right: none;
|
||||
}
|
||||
.content, .footer, .header {
|
||||
padding-left: 24px !important;
|
||||
padding-right: 24px !important;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
<style>
|
||||
/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */
|
||||
@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-outline-style:solid}}}.block{display:block}.inline{display:inline}.outline{outline-style:var(--tw-outline-style);outline-width:1px}@property --tw-outline-style{syntax:"*";inherits:false;initial-value:solid}
|
||||
</style>
|
||||
</head>
|
||||
<body style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; margin: 0; padding: 0; background-color: #f5f3f3; font-family: 'Work Sans', sans-serif; color: #1b1c1c; -webkit-font-smoothing: antialiased; width: 100% !important;">
|
||||
<center class="wrapper" style="width: 100%; table-layout: fixed; background-color: #f5f3f3; padding-bottom: 60px;">
|
||||
<table align="center" border="0" cellpadding="0" cellspacing="0" class="main-container" role="presentation" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; background-color: #ffffff; margin: 40px auto 0; width: 100%; max-width: 600px; border: 1px solid #dac0c2; border-radius: 4px; overflow: hidden; box-shadow: 0 4px 20px rgba(107, 26, 44, 0.02);" width="100%" bgcolor="#ffffff">
|
||||
<tbody><tr>
|
||||
<td class="header" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; padding: 40px 32px 32px; text-align: center; border-bottom: 1px solid #dac0c2; background-color: #fbf9f8;" align="center" bgcolor="#fbf9f8">
|
||||
<p class="brand-logo" style="font-family: 'Libre Caslon Text', serif; font-size: 32px; font-weight: 700; color: #4d0218; font-style: italic; margin: 0; line-height: 40px;">Tradhox</p>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="content" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; padding: 48px 40px; background-color: #ffffff;" bgcolor="#ffffff">
|
||||
<h1 style="font-family: 'Libre Caslon Text', serif; font-size: 24px; font-weight: 600; color: #1b1c1c; margin: 0 0 24px; line-height: 32px;">Reset Your Password</h1>
|
||||
<p style="font-family: 'Work Sans', sans-serif; font-size: 16px; line-height: 24px; color: #1b1c1c; margin: 0 0 24px; font-weight: 400;">We received a request to reset the password for your Tradhox account. We are here to help you regain access securely.</p>
|
||||
<p style="font-family: 'Work Sans', sans-serif; font-size: 16px; line-height: 24px; color: #1b1c1c; margin: 0 0 24px; font-weight: 400;">Click the button below to choose a new password. This link will expire in 24 hours for your security.</p>
|
||||
<div class="button-container" style="text-align: center; margin: 40px 0;">
|
||||
<a class="btn" href="{{ reset_link }}" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; display: inline-block; background-color: #6b1a2c; color: #ffffff; font-family: 'Work Sans', sans-serif; font-size: 14px; font-weight: 600; text-decoration: none; padding: 14px 32px; border-radius: 2px; line-height: 20px; letter-spacing: 0.5px;">Reset Password →</a>
|
||||
</div>
|
||||
<div class="divider" style="height: 1px; background-color: #dac0c2; margin: 32px 0;"></div>
|
||||
<p class="secondary-text" style="font-family: 'Work Sans', sans-serif; line-height: 24px; margin: 0 0 24px; font-weight: 400; color: #5f5e5b; font-size: 14px; margin-bottom: 0;"><strong>Didn't request this change?</strong><br>
|
||||
If you did not initiate this password reset, you can safely ignore this email. Your password will remain unchanged and your account is secure. We recommend reviewing your recent account activity if you are concerned.</p>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="footer" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; background-color: #f5f3f3; padding: 32px 40px; text-align: center; border-top: 1px solid #dac0c2;" bgcolor="#f5f3f3" align="center">
|
||||
<div class="security-tips" style="text-align: left; background-color: #fbf9f8; padding: 24px; border-radius: 4px; border: 1px solid #dac0c2; margin-top: 24px;">
|
||||
<h4 style="font-family: 'Libre Caslon Text', serif; font-size: 16px; color: #1b1c1c; margin: 0 0 12px; font-weight: 600;">Security Tips</h4>
|
||||
<ul style="margin: 0; padding-left: 20px; color: #5f5e5b; font-size: 14px; line-height: 22px;">
|
||||
<li>Never share your password with anyone.</li>
|
||||
<li>Create a strong password using a mix of letters, numbers, and symbols.</li>
|
||||
<li>Ensure you are on the official Tradhox website before entering credentials.</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="links" style="margin-top: 24px;">
|
||||
<a href="#" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; color: #5f5e5b; text-decoration: none; font-size: 12px; margin: 0 8px; font-weight: 500;">Privacy Policy</a> |
|
||||
<a href="#" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; color: #5f5e5b; text-decoration: none; font-size: 12px; margin: 0 8px; font-weight: 500;">Terms of Service</a> |
|
||||
<a href="#" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; color: #5f5e5b; text-decoration: none; font-size: 12px; margin: 0 8px; font-weight: 500;">Contact Us</a>
|
||||
</div>
|
||||
<p style="font-family: 'Work Sans', sans-serif; margin: 0 0 24px; font-weight: 400; font-size: 12px; color: #5f5e5b; line-height: 18px; margin-bottom: 12px; margin-top: 24px;">© {% now "Y" %} Tradhox Artisanal Marketplace. All rights reserved.</p>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody></table>
|
||||
</center>
|
||||
</body></html>
|
||||
<body style="margin: 0; padding: 0; background-color: #f4f4f5; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif; -webkit-font-smoothing: antialiased;">
|
||||
<table width="100%" border="0" cellspacing="0" cellpadding="0" style="background-color: #f4f4f5; padding: 40px 20px;">
|
||||
<tr>
|
||||
<td align="center">
|
||||
<table width="600" border="0" cellspacing="0" cellpadding="0" style="background-color: #ffffff; border-radius: 8px; border: 1px solid #e4e4e7; overflow: hidden; box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);">
|
||||
<!-- Header -->
|
||||
<tr>
|
||||
<td align="center" style="padding: 30px; background-color: #fafafa; border-bottom: 1px solid #e4e4e7;">
|
||||
<h1 style="margin: 0; font-size: 28px; color: #8b5cf6; font-weight: 700; font-style: italic; letter-spacing: -0.5px;">Tradhox</h1>
|
||||
</td>
|
||||
</tr>
|
||||
<!-- Content -->
|
||||
<tr>
|
||||
<td style="padding: 40px 40px 20px 40px;">
|
||||
<h2 style="margin: 0 0 20px 0; font-size: 24px; color: #18181b; font-weight: 600;">Reset Your Password</h2>
|
||||
<p style="margin: 0 0 25px 0; font-size: 16px; line-height: 24px; color: #3f3f46;">
|
||||
We received a request to reset your Tradhox password. You can reset your password by clicking the button below. This link will expire in 24 hours.
|
||||
</p>
|
||||
</td>
|
||||
</tr>
|
||||
<!-- Reset Action -->
|
||||
<tr>
|
||||
<td align="center" style="padding: 0 40px 30px 40px;">
|
||||
<table border="0" cellspacing="0" cellpadding="0">
|
||||
<tr>
|
||||
<td align="center" style="border-radius: 6px;" bgcolor="#8b5cf6">
|
||||
<a href="{{ reset_link }}" target="_blank" style="font-size: 16px; font-weight: 600; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif; color: #ffffff; text-decoration: none; padding: 14px 28px; border-radius: 6px; display: inline-block;">
|
||||
Reset Password
|
||||
</a>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</td>
|
||||
</tr>
|
||||
<!-- Security Notice -->
|
||||
<tr>
|
||||
<td style="padding: 20px 40px 40px 40px;">
|
||||
<p style="margin: 0; font-size: 14px; line-height: 22px; color: #71717a;">
|
||||
If you did not request a password reset, you can safely ignore this email. Your password will remain unchanged.
|
||||
</p>
|
||||
</td>
|
||||
</tr>
|
||||
<!-- Footer -->
|
||||
<tr>
|
||||
<td align="center" style="padding: 30px; background-color: #fafafa; border-top: 1px solid #e4e4e7;">
|
||||
<h4 style="margin: 0 0 15px 0; font-size: 16px; color: #3f3f46; font-weight: 600;">Tradhox</h4>
|
||||
<p style="margin: 0 0 15px 0; font-size: 12px; color: #a1a1aa;">
|
||||
<a href="#" style="color: #8b5cf6; text-decoration: none; margin: 0 5px;">Privacy Policy</a> •
|
||||
<a href="#" style="color: #8b5cf6; text-decoration: none; margin: 0 5px;">Terms of Service</a> •
|
||||
<a href="#" style="color: #8b5cf6; text-decoration: none; margin: 0 5px;">Unsubscribe</a> •
|
||||
<a href="#" style="color: #8b5cf6; text-decoration: none; margin: 0 5px;">Contact Us</a>
|
||||
</p>
|
||||
<p style="margin: 0; font-size: 12px; color: #a1a1aa;">
|
||||
© {% now "Y" %} Tradhox Artisanal Marketplace. All rights reserved.
|
||||
</p>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -1,82 +1,87 @@
|
|||
<!DOCTYPE html>
|
||||
|
||||
<html lang="en"><head>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta content="width=device-width, initial-scale=1.0" name="viewport">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Verify Your Email Address - Tradhox</title>
|
||||
<!-- Use Tailwind CSS for rapid styling, simulating pure HTML/CSS structure where possible -->
|
||||
|
||||
<link href="https://fonts.googleapis.com/css2?family=Libre+Caslon+Text:ital,wght@0,400;0,700;1,400&family=Work+Sans:wght@400;600&display=swap" rel="stylesheet">
|
||||
<link href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:wght,FILL@100..700,0..1&display=swap" rel="stylesheet">
|
||||
|
||||
<style>
|
||||
/* Email client specific resets - simulated for standard web rendering here */
|
||||
body { margin: 0; padding: 0; -webkit-text-size-adjust: 100%; background-color: #f5f3f3; }
|
||||
table { border-spacing: 0; border-collapse: collapse; mso-table-lspace: 0pt; mso-table-rspace: 0pt; }
|
||||
img { -ms-interpolation-mode: bicubic; }
|
||||
/* Add some basic web-view styling to simulate the email frame */
|
||||
.email-container { max-width: 600px; margin: 0 auto; background-color: #fbf9f8; }
|
||||
</style>
|
||||
|
||||
<style>
|
||||
/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */
|
||||
@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-outline-style:solid}}}.block{display:block}.inline{display:inline}.outline{outline-style:var(--tw-outline-style);outline-width:1px}@property --tw-outline-style{syntax:"*";inherits:false;initial-value:solid}
|
||||
</style>
|
||||
</head>
|
||||
<body class="bg-surface-container-low font-body-md text-on-surface p-4 md:p-8" style="margin: 0; padding: 0; -webkit-text-size-adjust: 100%; background-color: #f5f3f3;">
|
||||
<div class="email-container rounded-lg border border-outline-variant shadow-sm overflow-hidden my-8" style="max-width: 600px; margin: 0 auto; background-color: #fbf9f8;">
|
||||
<!-- Header -->
|
||||
<div class="bg-surface border-b border-outline-variant p-8 text-center">
|
||||
<h1 class="font-headline-lg text-headline-lg text-primary italic m-0">Tradhox</h1>
|
||||
</div>
|
||||
<!-- Content -->
|
||||
<div class="p-8 md:p-12 space-y-8 bg-surface">
|
||||
<div class="text-center space-y-4">
|
||||
<h2 class="font-headline-md text-headline-md text-on-surface m-0">Verify Your Email Address</h2>
|
||||
<p class="font-body-md text-body-md text-on-surface-variant m-0">
|
||||
Welcome to Tradhox Artisanal Marketplace. To ensure the security of your account and protect the integrity of our community, please verify your email address.
|
||||
</p>
|
||||
</div>
|
||||
<!-- Verification Action -->
|
||||
<div class="bg-surface-container py-8 px-6 rounded text-center border border-outline-variant space-y-6">
|
||||
<p class="font-label-caps text-label-caps text-secondary uppercase tracking-widest m-0">Your Verification Code</p>
|
||||
<div class="font-display-lg text-display-lg text-primary tracking-widest py-4 bg-surface rounded inline-block px-8 border border-outline-variant shadow-sm">
|
||||
7 4 9 2 0 1
|
||||
</div>
|
||||
<div class="flex items-center justify-center my-6">
|
||||
<span class="h-px bg-outline-variant w-16"></span>
|
||||
<span class="font-label-caps text-label-caps text-secondary mx-4">OR</span>
|
||||
<span class="h-px bg-outline-variant w-16"></span>
|
||||
</div>
|
||||
<a class="inline-block bg-primary-container text-on-primary font-button text-button py-3 px-8 rounded hover:bg-primary transition-colors no-underline" href="{{ verification_link }}">
|
||||
Verify Email Address →
|
||||
</a>
|
||||
</div>
|
||||
<!-- Security Notice -->
|
||||
<div class="pt-6 border-t border-outline-variant">
|
||||
<h3 class="font-label-caps text-label-caps text-on-surface-variant mb-2">Why is this required?</h3>
|
||||
<p class="font-body-md text-body-md text-secondary m-0 text-sm">
|
||||
Verifying your email helps us maintain a trusted environment for our artisans and buyers. It ensures you receive important updates about your orders and protects your account from unauthorized access.
|
||||
</p>
|
||||
</div>
|
||||
<div class="pt-4">
|
||||
<p class="font-body-md text-body-md text-secondary m-0 text-sm">
|
||||
If you did not create an account with Tradhox, you can safely ignore this email.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Footer (from JSON structure mapped to email) -->
|
||||
<div class="bg-surface-container-low border-t border-outline-variant p-8 text-center space-y-4">
|
||||
<h4 class="font-headline-md text-headline-md text-on-surface-variant m-0 text-lg">Tradhox</h4>
|
||||
<div class="flex flex-wrap justify-center gap-4 text-sm font-label-caps text-label-caps">
|
||||
<a class="text-on-secondary-container hover:text-primary underline" href="#">Privacy Policy</a>
|
||||
<a class="text-on-secondary-container hover:text-primary underline" href="#">Terms of Service</a>
|
||||
<a class="text-on-secondary-container hover:text-primary underline" href="#">Unsubscribe</a>
|
||||
<a class="text-on-secondary-container hover:text-primary underline" href="#">Contact Us</a>
|
||||
</div>
|
||||
<p class="font-body-md text-body-md text-secondary text-xs m-0 pt-4">
|
||||
© {% now "Y" %} Tradhox Artisanal Marketplace. All rights reserved.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</body></html>
|
||||
<body style="margin: 0; padding: 0; background-color: #f4f4f5; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif; -webkit-font-smoothing: antialiased;">
|
||||
<table width="100%" border="0" cellspacing="0" cellpadding="0" style="background-color: #f4f4f5; padding: 40px 20px;">
|
||||
<tr>
|
||||
<td align="center">
|
||||
<table width="600" border="0" cellspacing="0" cellpadding="0" style="background-color: #ffffff; border-radius: 8px; border: 1px solid #e4e4e7; overflow: hidden; box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);">
|
||||
<!-- Header -->
|
||||
<tr>
|
||||
<td align="center" style="padding: 30px; background-color: #fafafa; border-bottom: 1px solid #e4e4e7;">
|
||||
<h1 style="margin: 0; font-size: 28px; color: #8b5cf6; font-weight: 700; font-style: italic; letter-spacing: -0.5px;">Tradhox</h1>
|
||||
</td>
|
||||
</tr>
|
||||
<!-- Content -->
|
||||
<tr>
|
||||
<td style="padding: 40px 40px 20px 40px;">
|
||||
<h2 style="margin: 0 0 20px 0; font-size: 24px; color: #18181b; font-weight: 600;">Verify Your Email Address</h2>
|
||||
<p style="margin: 0 0 25px 0; font-size: 16px; line-height: 24px; color: #3f3f46;">
|
||||
Welcome to Tradhox Artisanal Marketplace. To ensure the security of your account and protect the integrity of our community, please verify your email address.
|
||||
</p>
|
||||
</td>
|
||||
</tr>
|
||||
<!-- Verification Action -->
|
||||
<tr>
|
||||
<td align="center" style="padding: 0 40px 30px 40px;">
|
||||
<div style="background-color: #f4f4f5; border: 1px dashed #d4d4d8; border-radius: 6px; padding: 25px; margin-bottom: 25px;">
|
||||
<p style="margin: 0 0 15px 0; font-size: 12px; text-transform: uppercase; letter-spacing: 1px; color: #71717a; font-weight: 600;">Your Verification Code</p>
|
||||
<div style="font-size: 32px; letter-spacing: 4px; font-weight: 700; color: #8b5cf6; margin-bottom: 20px;">
|
||||
7 4 9 2 0 1
|
||||
</div>
|
||||
<table width="100%" border="0" cellspacing="0" cellpadding="0">
|
||||
<tr>
|
||||
<td width="40%" style="border-top: 1px solid #e4e4e7;"></td>
|
||||
<td width="20%" align="center" style="font-size: 12px; color: #71717a; text-transform: uppercase; letter-spacing: 1px;">OR</td>
|
||||
<td width="40%" style="border-top: 1px solid #e4e4e7;"></td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
<table border="0" cellspacing="0" cellpadding="0">
|
||||
<tr>
|
||||
<td align="center" style="border-radius: 6px;" bgcolor="#8b5cf6">
|
||||
<a href="{{ verification_link }}" target="_blank" style="font-size: 16px; font-weight: 600; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif; color: #ffffff; text-decoration: none; padding: 14px 28px; border-radius: 6px; display: inline-block;">
|
||||
Verify Email Address →
|
||||
</a>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</td>
|
||||
</tr>
|
||||
<!-- Security Notice -->
|
||||
<tr>
|
||||
<td style="padding: 20px 40px 40px 40px;">
|
||||
<h3 style="margin: 0 0 10px 0; font-size: 12px; text-transform: uppercase; letter-spacing: 1px; color: #71717a; font-weight: 600;">Why is this required?</h3>
|
||||
<p style="margin: 0 0 15px 0; font-size: 14px; line-height: 22px; color: #71717a;">
|
||||
Verifying your email helps us maintain a trusted environment for our artisans and buyers. It ensures you receive important updates about your orders and protects your account from unauthorized access.
|
||||
</p>
|
||||
<p style="margin: 0; font-size: 14px; line-height: 22px; color: #71717a;">
|
||||
If you did not create an account with Tradhox, you can safely ignore this email.
|
||||
</p>
|
||||
</td>
|
||||
</tr>
|
||||
<!-- Footer -->
|
||||
<tr>
|
||||
<td align="center" style="padding: 30px; background-color: #fafafa; border-top: 1px solid #e4e4e7;">
|
||||
<h4 style="margin: 0 0 15px 0; font-size: 16px; color: #3f3f46; font-weight: 600;">Tradhox</h4>
|
||||
<p style="margin: 0 0 15px 0; font-size: 12px; color: #a1a1aa;">
|
||||
<a href="#" style="color: #8b5cf6; text-decoration: none; margin: 0 5px;">Privacy Policy</a> •
|
||||
<a href="#" style="color: #8b5cf6; text-decoration: none; margin: 0 5px;">Terms of Service</a> •
|
||||
<a href="#" style="color: #8b5cf6; text-decoration: none; margin: 0 5px;">Unsubscribe</a> •
|
||||
<a href="#" style="color: #8b5cf6; text-decoration: none; margin: 0 5px;">Contact Us</a>
|
||||
</p>
|
||||
<p style="margin: 0; font-size: 12px; color: #a1a1aa;">
|
||||
© {% now "Y" %} Tradhox Artisanal Marketplace. All rights reserved.
|
||||
</p>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -1,116 +1,76 @@
|
|||
<!DOCTYPE html>
|
||||
|
||||
<html lang="en"><head>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta content="width=device-width, initial-scale=1.0" name="viewport">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Welcome to Tradhox</title>
|
||||
<!-- Tailwind is requested by instructions, but prompt asks for pure HTML/CSS for email (tables, inline styles).
|
||||
Since instructions override prompt usually for frameworks (like enforcing Tailwind), but email structure requires tables,
|
||||
I will use a hybrid: standard Tailwind script for token parsing (if used via classes in a preview context),
|
||||
but primarily focus on email-safe inline styles and table structures to satisfy the email requirement while respecting tokens. -->
|
||||
<style>
|
||||
@import url('https://fonts.googleapis.com/css2?family=Libre+Caslon+Text:ital,wght@0,400;0,700;1,400&family=Work+Sans:wght@400;600&display=swap');
|
||||
|
||||
body, table, td, a { -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }
|
||||
table, td { mso-table-lspace: 0pt; mso-table-rspace: 0pt; }
|
||||
img { -ms-interpolation-mode: bicubic; }
|
||||
|
||||
img { border: 0; height: auto; line-height: 100%; outline: none; text-decoration: none; }
|
||||
table { border-collapse: collapse !important; }
|
||||
body { height: 100% !important; margin: 0 !important; padding: 0 !important; width: 100% !important; background-color: #fbf9f8; font-family: 'Work Sans', sans-serif; color: #1b1c1c; }
|
||||
|
||||
.heading { font-family: 'Libre Caslon Text', serif; }
|
||||
</style>
|
||||
|
||||
<link href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:wght,FILL@100..700,0..1&display=swap" rel="stylesheet">
|
||||
<style>
|
||||
/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */
|
||||
@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-outline-style:solid}}}.block{display:block}.inline{display:inline}.outline{outline-style:var(--tw-outline-style);outline-width:1px}@property --tw-outline-style{syntax:"*";inherits:false;initial-value:solid}
|
||||
</style>
|
||||
</head>
|
||||
<body style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; font-family: 'Work Sans', sans-serif; color: #1b1c1c; background-color: #fbf9f8; height: 100% !important; margin: 0 !important; padding: 0 !important; width: 100% !important;">
|
||||
<table border="0" cellpadding="0" cellspacing="0" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; background-color: #fbf9f8; border-collapse: collapse !important;" width="100%" bgcolor="#fbf9f8">
|
||||
<tbody><tr>
|
||||
<td align="center" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; padding: 40px 0;">
|
||||
<!-- Main Email Container -->
|
||||
<table border="0" cellpadding="0" cellspacing="0" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; background-color: #ffffff; border: 1px solid #dac0c2; max-width: 600px; width: 100%; border-collapse: collapse !important;" width="100%" bgcolor="#ffffff">
|
||||
<!-- Header / Logo Area -->
|
||||
<tbody><tr>
|
||||
<td align="center" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; padding: 32px; border-bottom: 1px solid #dac0c2;">
|
||||
<h1 class="heading" style="font-family: 'Libre Caslon Text', serif; margin: 0; font-size: 32px; font-weight: 700; color: #4d0218; font-style: italic;">Tradhox</h1>
|
||||
</td>
|
||||
</tr>
|
||||
<!-- Hero Image -->
|
||||
<tr>
|
||||
<td align="center" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt;">
|
||||
<img alt="Artisanal craftsmanship" data-alt="A beautifully crafted Indian artisanal pottery piece sitting gracefully on a raw wooden table. The lighting is soft and natural, casting gentle shadows that highlight the intricate, hand-painted details. The scene embodies a premium, minimalistic aesthetic with warm cream and burgundy tones, reflecting a deep respect for traditional craftsmanship." src="https://lh3.googleusercontent.com/aida-public/AB6AXuDwKj0sSyvy4Vb6IAeT-HFnkRzbjSC_t19Qm3uNT0f0A6g7dEA1JnSRWuxHvlZ75TY1tUq4GgRvbrIBIpCziv2Ae0VnmWQh5hCKEulaZy9PCPJZJ0IHGlBplmGg6opaLWmIrKt5t49vzSCC3c6y5DoS38kUH1DO8kkAuDlXwl6m9dAXApzArDMus3Fzsb7KQDVzz9J4MuNySnYlDuMurTIweC1IMsLloBMZJw6HEOzG1cn9DT0Yq2FhEQ" style="-ms-interpolation-mode: bicubic; border: 0; height: auto; line-height: 100%; outline: none; text-decoration: none; display: block; width: 100%; max-width: 600px;" width="600" height="auto">
|
||||
</td>
|
||||
</tr>
|
||||
<!-- Welcome Content -->
|
||||
<tr>
|
||||
<td align="center" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; padding: 48px 32px;">
|
||||
<h2 class="heading" style="font-family: 'Libre Caslon Text', serif; margin: 0 0 24px 0; font-size: 24px; font-weight: 600; color: #1b1c1c;">Welcome to the Family of Makers</h2>
|
||||
<p style="margin: 0 0 32px 0; font-size: 16px; line-height: 24px; color: #554244; text-align: center;">
|
||||
We are thrilled to welcome you to Tradhox, where traditional artistry meets a modern global marketplace. Here, we celebrate human craftsmanship and the stories woven into every handmade piece.
|
||||
</p>
|
||||
<!-- CTA Button -->
|
||||
<table border="0" cellpadding="0" cellspacing="0" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; border-collapse: collapse !important;">
|
||||
<tbody><tr>
|
||||
<td align="center" bgcolor="#6b1a2c" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; border-radius: 4px;">
|
||||
<a href="{{ shop_link }}" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; display: inline-block; padding: 16px 32px; font-family: 'Work Sans', sans-serif; font-size: 14px; font-weight: 600; color: #ffffff; text-decoration: none; border: 1px solid #6b1a2c; border-radius: 4px;" target="_blank">
|
||||
Start Your Journey →
|
||||
</a>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody></table>
|
||||
</td>
|
||||
</tr>
|
||||
<!-- Featured Items Teaser (Bento-ish layout for email) -->
|
||||
<tr>
|
||||
<td style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; padding: 0 32px 48px 32px;">
|
||||
<table border="0" cellpadding="0" cellspacing="0" width="100%" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; border-collapse: collapse !important;">
|
||||
<tbody><tr>
|
||||
<td align="center" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; padding-bottom: 16px;" valign="top" width="48%">
|
||||
<img data-alt="Close-up of vibrant, hand-woven sustainable textiles showcasing intricate patterns. The fabric is draped elegantly against a pristine white background. High-quality lighting enhances the rich textures and deep maroon accents, creating a premium, artisanal feel suitable for a high-trust marketplace." src="https://lh3.googleusercontent.com/aida-public/AB6AXuDKWj6PI5PVLtD8yTefLydBNdSLfglyqu79rQgchDnzJHDEQtH7wM0hz47zSHnTxBtK27KgjE27S5dY0s4ssg_CCzLqmZpIjoM3ew2YXQDVM4GC_O6ZFA2m2F-YjYhNyn78Mm--yGIGTRnFFf6JCWcZgQUJRNpAD4QGYHcEQ4pRJEbRuqIKdVi-18eSoR1RTOc9dFZwpH8u0qb3TeLtrvBnEArLbpk9-VbGCifLYxerqun0qcbwjX8akA" style="-ms-interpolation-mode: bicubic; height: auto; line-height: 100%; outline: none; text-decoration: none; display: block; border: 1px solid #dac0c2; border-radius: 4px; margin-bottom: 12px;" width="100%" height="auto">
|
||||
<h3 style="margin: 0 0 8px 0; font-family: 'Work Sans', sans-serif; font-size: 12px; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; color: #4d0218;">Sustainable Crafts</h3>
|
||||
</td>
|
||||
<td width="4%" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt;"></td>
|
||||
<td align="center" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; padding-bottom: 16px;" valign="top" width="48%">
|
||||
<img data-alt="A skilled artisan's hands carefully shaping a delicate piece of GI-tagged wooden craft. The workspace is softly lit, emphasizing the dedication and precision of the maker. The overall mood is warm, authentic, and rooted in cultural preservation, with subtle hints of burgundy and soft beige in the environment." src="https://lh3.googleusercontent.com/aida-public/AB6AXuAor7SuW3PDkut6kw6zd7SJcjuQb8YWP7VHhdik0Axf2u9wxc18kJdEwf_63ld10x_E2W11yMrkooGzdRpZe_wL2ywQjqaqCcaBpAqUiG-ocYu61WLuyWP5VySMT8bAarpnG4il0EGyQ2EgWSv2rkKwzjGzrshCz56h69pmwCCQjWK71ox84KT1jyxyHPhoCgyHzAwLehB4DAlANLpSpPr6Ku0zgOISfyBT_BCR-ApuYSfkgYab1zbWIw" style="-ms-interpolation-mode: bicubic; height: auto; line-height: 100%; outline: none; text-decoration: none; display: block; border: 1px solid #dac0c2; border-radius: 4px; margin-bottom: 12px;" width="100%" height="auto">
|
||||
<h3 style="margin: 0 0 8px 0; font-family: 'Work Sans', sans-serif; font-size: 12px; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; color: #4d0218;">GI Tagged Heritage</h3>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody></table>
|
||||
</td>
|
||||
</tr>
|
||||
<!-- Footer -->
|
||||
<tr>
|
||||
<td align="center" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; padding: 32px; background-color: #f5f3f3; border-top: 1px solid #dac0c2;" bgcolor="#f5f3f3">
|
||||
<p style="margin: 0 0 16px 0; font-family: 'Libre Caslon Text', serif; font-size: 18px; font-weight: 700; color: #554244;">
|
||||
Tradhox
|
||||
</p>
|
||||
<!-- Social Icons (Placeholders) -->
|
||||
<table border="0" cellpadding="0" cellspacing="0" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; margin-bottom: 24px; border-collapse: collapse !important;">
|
||||
<tbody><tr>
|
||||
<td style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; padding: 0 8px;">
|
||||
<a href="#" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; color: #6b1a2c; text-decoration: none; font-size: 12px; font-weight: 600;">Instagram</a>
|
||||
</td>
|
||||
<td style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; padding: 0 8px;">
|
||||
<a href="#" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; color: #6b1a2c; text-decoration: none; font-size: 12px; font-weight: 600;">Facebook</a>
|
||||
</td>
|
||||
<td style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; padding: 0 8px;">
|
||||
<a href="#" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; color: #6b1a2c; text-decoration: none; font-size: 12px; font-weight: 600;">Twitter</a>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody></table>
|
||||
<p style="margin: 0; font-size: 12px; color: #636260;">
|
||||
© {% now "Y" %} Tradhox Artisanal Marketplace. All rights reserved.<br>
|
||||
<a href="#" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; color: #636260; text-decoration: underline;">Privacy Policy</a> • <a href="#" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; color: #636260; text-decoration: underline;">Terms of Service</a> • <a href="#" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; color: #636260; text-decoration: underline;">Unsubscribe</a>
|
||||
</p>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody></table>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody></table>
|
||||
</body></html>
|
||||
<body style="margin: 0; padding: 0; background-color: #f4f4f5; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif; -webkit-font-smoothing: antialiased;">
|
||||
<table width="100%" border="0" cellspacing="0" cellpadding="0" style="background-color: #f4f4f5; padding: 40px 20px;">
|
||||
<tr>
|
||||
<td align="center">
|
||||
<table width="600" border="0" cellspacing="0" cellpadding="0" style="background-color: #ffffff; border-radius: 8px; border: 1px solid #e4e4e7; overflow: hidden; box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);">
|
||||
<!-- Header -->
|
||||
<tr>
|
||||
<td align="center" style="padding: 30px; background-color: #fafafa; border-bottom: 1px solid #e4e4e7;">
|
||||
<h1 style="margin: 0; font-size: 28px; color: #8b5cf6; font-weight: 700; font-style: italic; letter-spacing: -0.5px;">Tradhox</h1>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
{% if image_url %}
|
||||
<!-- Hero Image -->
|
||||
<tr>
|
||||
<td align="center" style="background-color: #ffffff;">
|
||||
<img src="{{ image_url }}" alt="Promotional Image" width="600" style="display: block; width: 100%; max-width: 600px; border: 0;" />
|
||||
</td>
|
||||
</tr>
|
||||
{% endif %}
|
||||
|
||||
<!-- Content -->
|
||||
<tr>
|
||||
<td style="padding: 40px 40px 20px 40px;">
|
||||
<h2 style="margin: 0 0 20px 0; font-size: 24px; color: #18181b; font-weight: 600;">Welcome to the Family!</h2>
|
||||
<p style="margin: 0 0 25px 0; font-size: 16px; line-height: 24px; color: #3f3f46;">
|
||||
{{ message_text }}
|
||||
</p>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
{% if shop_link %}
|
||||
<!-- Call to Action -->
|
||||
<tr>
|
||||
<td align="center" style="padding: 0 40px 40px 40px;">
|
||||
<table border="0" cellspacing="0" cellpadding="0">
|
||||
<tr>
|
||||
<td align="center" style="border-radius: 6px;" bgcolor="#8b5cf6">
|
||||
<a href="{{ shop_link }}" target="_blank" style="font-size: 16px; font-weight: 600; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif; color: #ffffff; text-decoration: none; padding: 14px 28px; border-radius: 6px; display: inline-block;">
|
||||
Shop Now →
|
||||
</a>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</td>
|
||||
</tr>
|
||||
{% endif %}
|
||||
|
||||
<!-- Footer -->
|
||||
<tr>
|
||||
<td align="center" style="padding: 30px; background-color: #fafafa; border-top: 1px solid #e4e4e7;">
|
||||
<h4 style="margin: 0 0 15px 0; font-size: 16px; color: #3f3f46; font-weight: 600;">Tradhox</h4>
|
||||
<p style="margin: 0 0 15px 0; font-size: 12px; color: #a1a1aa;">
|
||||
<a href="#" style="color: #8b5cf6; text-decoration: none; margin: 0 5px;">Privacy Policy</a> •
|
||||
<a href="#" style="color: #8b5cf6; text-decoration: none; margin: 0 5px;">Terms of Service</a> •
|
||||
<a href="#" style="color: #8b5cf6; text-decoration: none; margin: 0 5px;">Unsubscribe</a> •
|
||||
<a href="#" style="color: #8b5cf6; text-decoration: none; margin: 0 5px;">Contact Us</a>
|
||||
</p>
|
||||
<p style="margin: 0; font-size: 12px; color: #a1a1aa;">
|
||||
© {% now "Y" %} Tradhox Artisanal Marketplace. All rights reserved.
|
||||
</p>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</body>
|
||||
</html>
|
||||
Loading…
Reference in a new issue