feat: Custom email system foundation
## ✅ Step 1-3: Email System Core ### EmailManager.php - ✅ Disables WooCommerce emails (prevents duplicates) - ✅ Hooks into all WC order status changes - ✅ Hooks into customer, product events - ✅ Checks if events are enabled before sending - ✅ Sends via wp_mail() (SMTP plugin compatible) ### EmailRenderer.php - ✅ Renders emails with design templates - ✅ Variable replacement system - ✅ Gets recipient email (staff/customer) - ✅ Loads order/product/customer variables - ✅ Filter hook: `woonoow_email_template` - ✅ Supports HTML template designs ### Email Design Templates (3) **templates/emails/modern.html** - ✅ Clean, minimalist, Apple-inspired - ✅ Dark mode support - ✅ Mobile responsive - ✅ 2024 design trends **templates/emails/classic.html** - ✅ Professional, traditional - ✅ Gradient header - ✅ Table styling - ✅ Business-appropriate **templates/emails/minimal.html** - ✅ Ultra-clean, monospace font - ✅ Black & white aesthetic - ✅ Text-focused - ✅ Dark mode invert ### Architecture ``` Design Template (HTML) → Content Template (Text) → Final Email modern.html → order_processing → Beautiful HTML ``` --- **Next:** Rich text editor + Content templates 🎨
This commit is contained in:
dwindown
238
templates/emails/classic.html
Normal file
238
templates/emails/classic.html
Normal file
@@ -0,0 +1,238 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<title>{{email_heading}}</title>
|
||||
<style>
|
||||
/* Reset */
|
||||
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; }
|
||||
|
||||
/* Base */
|
||||
body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
width: 100% !important;
|
||||
font-family: Georgia, 'Times New Roman', serif;
|
||||
background-color: #f4f4f4;
|
||||
color: #333333;
|
||||
line-height: 1.7;
|
||||
}
|
||||
|
||||
/* Container */
|
||||
.email-container {
|
||||
max-width: 600px;
|
||||
margin: 0 auto;
|
||||
background-color: #ffffff;
|
||||
border: 1px solid #dddddd;
|
||||
}
|
||||
|
||||
/* Header */
|
||||
.email-header {
|
||||
padding: 30px 40px;
|
||||
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.email-logo {
|
||||
font-size: 32px;
|
||||
font-weight: 700;
|
||||
color: #ffffff;
|
||||
text-decoration: none;
|
||||
text-shadow: 0 2px 4px rgba(0,0,0,0.1);
|
||||
}
|
||||
|
||||
/* Content */
|
||||
.email-content {
|
||||
padding: 40px;
|
||||
}
|
||||
|
||||
.email-heading {
|
||||
font-size: 26px;
|
||||
font-weight: 700;
|
||||
color: #333333;
|
||||
margin: 0 0 20px;
|
||||
line-height: 1.3;
|
||||
border-bottom: 3px solid #667eea;
|
||||
padding-bottom: 15px;
|
||||
}
|
||||
|
||||
.email-text {
|
||||
font-size: 16px;
|
||||
color: #555555;
|
||||
margin: 0 0 16px;
|
||||
line-height: 1.7;
|
||||
}
|
||||
|
||||
.email-text strong {
|
||||
color: #333333;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
/* Button */
|
||||
.email-button {
|
||||
display: inline-block;
|
||||
padding: 15px 35px;
|
||||
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
|
||||
color: #ffffff !important;
|
||||
text-decoration: none;
|
||||
border-radius: 4px;
|
||||
font-size: 16px;
|
||||
font-weight: 600;
|
||||
margin: 24px 0;
|
||||
box-shadow: 0 4px 6px rgba(0,0,0,0.1);
|
||||
}
|
||||
|
||||
/* Info Box */
|
||||
.info-box {
|
||||
background-color: #f9f9f9;
|
||||
border: 2px solid #eeeeee;
|
||||
border-radius: 4px;
|
||||
padding: 24px;
|
||||
margin: 24px 0;
|
||||
}
|
||||
|
||||
.info-row {
|
||||
padding: 10px 0;
|
||||
border-bottom: 1px dashed #dddddd;
|
||||
}
|
||||
|
||||
.info-row:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
.info-label {
|
||||
font-size: 14px;
|
||||
color: #777777;
|
||||
font-weight: 600;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.5px;
|
||||
}
|
||||
|
||||
.info-value {
|
||||
font-size: 16px;
|
||||
color: #333333;
|
||||
font-weight: 600;
|
||||
margin-top: 4px;
|
||||
}
|
||||
|
||||
/* Table */
|
||||
.email-table {
|
||||
width: 100%;
|
||||
border-collapse: collapse;
|
||||
margin: 24px 0;
|
||||
border: 1px solid #dddddd;
|
||||
}
|
||||
|
||||
.email-table th {
|
||||
text-align: left;
|
||||
padding: 14px;
|
||||
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
|
||||
font-size: 14px;
|
||||
font-weight: 700;
|
||||
color: #ffffff;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.5px;
|
||||
}
|
||||
|
||||
.email-table td {
|
||||
padding: 14px;
|
||||
border-bottom: 1px solid #eeeeee;
|
||||
font-size: 15px;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.email-table tr:last-child td {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
.email-table tr:nth-child(even) {
|
||||
background-color: #f9f9f9;
|
||||
}
|
||||
|
||||
/* Footer */
|
||||
.email-footer {
|
||||
padding: 30px 40px;
|
||||
background-color: #333333;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.email-footer-text {
|
||||
font-size: 13px;
|
||||
color: #cccccc;
|
||||
margin: 0 0 8px;
|
||||
}
|
||||
|
||||
.email-footer-link {
|
||||
color: #667eea;
|
||||
text-decoration: none;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
/* Divider */
|
||||
.divider {
|
||||
height: 2px;
|
||||
background: linear-gradient(90deg, transparent, #667eea, transparent);
|
||||
margin: 30px 0;
|
||||
}
|
||||
|
||||
/* Responsive */
|
||||
@media only screen and (max-width: 600px) {
|
||||
.email-header,
|
||||
.email-content,
|
||||
.email-footer {
|
||||
padding: 25px 20px !important;
|
||||
}
|
||||
|
||||
.email-heading {
|
||||
font-size: 22px !important;
|
||||
}
|
||||
|
||||
.info-box {
|
||||
padding: 16px !important;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<table role="presentation" cellspacing="0" cellpadding="0" border="0" width="100%">
|
||||
<tr>
|
||||
<td style="padding: 30px 20px;">
|
||||
<table role="presentation" cellspacing="0" cellpadding="0" border="0" class="email-container">
|
||||
<!-- Header -->
|
||||
<tr>
|
||||
<td class="email-header">
|
||||
<a href="{{store_url}}" class="email-logo">{{store_name}}</a>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<!-- Content -->
|
||||
<tr>
|
||||
<td class="email-content">
|
||||
<h1 class="email-heading">{{email_heading}}</h1>
|
||||
|
||||
<!-- Dynamic content will be inserted here -->
|
||||
{{email_content}}
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<!-- Footer -->
|
||||
<tr>
|
||||
<td class="email-footer">
|
||||
<p class="email-footer-text">
|
||||
© {{current_year}} {{store_name}}. All rights reserved.
|
||||
</p>
|
||||
<p class="email-footer-text">
|
||||
<a href="{{store_url}}" class="email-footer-link">Visit our store</a>
|
||||
</p>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</body>
|
||||
</html>
|
||||
280
templates/emails/minimal.html
Normal file
280
templates/emails/minimal.html
Normal file
@@ -0,0 +1,280 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<title>{{email_heading}}</title>
|
||||
<style>
|
||||
/* Reset */
|
||||
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; }
|
||||
|
||||
/* Base */
|
||||
body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
width: 100% !important;
|
||||
font-family: 'Courier New', Courier, monospace;
|
||||
background-color: #ffffff;
|
||||
color: #000000;
|
||||
line-height: 1.8;
|
||||
}
|
||||
|
||||
/* Container */
|
||||
.email-container {
|
||||
max-width: 600px;
|
||||
margin: 0 auto;
|
||||
background-color: #ffffff;
|
||||
}
|
||||
|
||||
/* Header */
|
||||
.email-header {
|
||||
padding: 40px 40px 20px;
|
||||
border-bottom: 2px solid #000000;
|
||||
}
|
||||
|
||||
.email-logo {
|
||||
font-size: 18px;
|
||||
font-weight: 700;
|
||||
color: #000000;
|
||||
text-decoration: none;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 2px;
|
||||
}
|
||||
|
||||
/* Content */
|
||||
.email-content {
|
||||
padding: 40px;
|
||||
}
|
||||
|
||||
.email-heading {
|
||||
font-size: 20px;
|
||||
font-weight: 700;
|
||||
color: #000000;
|
||||
margin: 0 0 30px;
|
||||
line-height: 1.4;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 1px;
|
||||
}
|
||||
|
||||
.email-text {
|
||||
font-size: 14px;
|
||||
color: #000000;
|
||||
margin: 0 0 20px;
|
||||
line-height: 1.8;
|
||||
}
|
||||
|
||||
.email-text strong {
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
/* Button */
|
||||
.email-button {
|
||||
display: inline-block;
|
||||
padding: 12px 30px;
|
||||
background-color: #000000;
|
||||
color: #ffffff !important;
|
||||
text-decoration: none;
|
||||
font-size: 14px;
|
||||
font-weight: 700;
|
||||
margin: 24px 0;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 1px;
|
||||
}
|
||||
|
||||
/* Info Box */
|
||||
.info-box {
|
||||
border: 1px solid #000000;
|
||||
padding: 20px;
|
||||
margin: 30px 0;
|
||||
}
|
||||
|
||||
.info-row {
|
||||
padding: 8px 0;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.info-label {
|
||||
font-size: 12px;
|
||||
color: #000000;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 1px;
|
||||
}
|
||||
|
||||
.info-value {
|
||||
font-size: 14px;
|
||||
color: #000000;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
/* Table */
|
||||
.email-table {
|
||||
width: 100%;
|
||||
border-collapse: collapse;
|
||||
margin: 30px 0;
|
||||
border: 1px solid #000000;
|
||||
}
|
||||
|
||||
.email-table th {
|
||||
text-align: left;
|
||||
padding: 12px;
|
||||
background-color: #000000;
|
||||
font-size: 12px;
|
||||
font-weight: 700;
|
||||
color: #ffffff;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 1px;
|
||||
}
|
||||
|
||||
.email-table td {
|
||||
padding: 12px;
|
||||
border-bottom: 1px solid #000000;
|
||||
font-size: 14px;
|
||||
color: #000000;
|
||||
}
|
||||
|
||||
.email-table tr:last-child td {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
/* Footer */
|
||||
.email-footer {
|
||||
padding: 20px 40px 40px;
|
||||
border-top: 2px solid #000000;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.email-footer-text {
|
||||
font-size: 11px;
|
||||
color: #000000;
|
||||
margin: 0 0 8px;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 1px;
|
||||
}
|
||||
|
||||
.email-footer-link {
|
||||
color: #000000;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* Divider */
|
||||
.divider {
|
||||
height: 1px;
|
||||
background-color: #000000;
|
||||
margin: 30px 0;
|
||||
}
|
||||
|
||||
/* Responsive */
|
||||
@media only screen and (max-width: 600px) {
|
||||
.email-header,
|
||||
.email-content,
|
||||
.email-footer {
|
||||
padding: 30px 20px !important;
|
||||
}
|
||||
|
||||
.email-heading {
|
||||
font-size: 18px !important;
|
||||
}
|
||||
|
||||
.info-box {
|
||||
padding: 16px !important;
|
||||
}
|
||||
}
|
||||
|
||||
/* Dark mode - invert colors */
|
||||
@media (prefers-color-scheme: dark) {
|
||||
body {
|
||||
background-color: #000000 !important;
|
||||
}
|
||||
|
||||
.email-container {
|
||||
background-color: #000000 !important;
|
||||
}
|
||||
|
||||
.email-header {
|
||||
border-bottom-color: #ffffff !important;
|
||||
}
|
||||
|
||||
.email-logo,
|
||||
.email-heading,
|
||||
.email-text,
|
||||
.email-text strong,
|
||||
.info-label,
|
||||
.info-value,
|
||||
.email-table td,
|
||||
.email-footer-text,
|
||||
.email-footer-link {
|
||||
color: #ffffff !important;
|
||||
}
|
||||
|
||||
.info-box,
|
||||
.email-table {
|
||||
border-color: #ffffff !important;
|
||||
}
|
||||
|
||||
.email-table td {
|
||||
border-bottom-color: #ffffff !important;
|
||||
}
|
||||
|
||||
.email-button {
|
||||
background-color: #ffffff !important;
|
||||
color: #000000 !important;
|
||||
}
|
||||
|
||||
.email-table th {
|
||||
background-color: #ffffff !important;
|
||||
color: #000000 !important;
|
||||
}
|
||||
|
||||
.email-footer {
|
||||
border-top-color: #ffffff !important;
|
||||
}
|
||||
|
||||
.divider {
|
||||
background-color: #ffffff !important;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<table role="presentation" cellspacing="0" cellpadding="0" border="0" width="100%">
|
||||
<tr>
|
||||
<td style="padding: 0;">
|
||||
<table role="presentation" cellspacing="0" cellpadding="0" border="0" class="email-container">
|
||||
<!-- Header -->
|
||||
<tr>
|
||||
<td class="email-header">
|
||||
<a href="{{store_url}}" class="email-logo">{{store_name}}</a>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<!-- Content -->
|
||||
<tr>
|
||||
<td class="email-content">
|
||||
<h1 class="email-heading">{{email_heading}}</h1>
|
||||
|
||||
<!-- Dynamic content will be inserted here -->
|
||||
{{email_content}}
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<!-- Footer -->
|
||||
<tr>
|
||||
<td class="email-footer">
|
||||
<p class="email-footer-text">
|
||||
© {{current_year}} {{store_name}}
|
||||
</p>
|
||||
<p class="email-footer-text">
|
||||
<a href="{{store_url}}" class="email-footer-link">{{store_url}}</a>
|
||||
</p>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</body>
|
||||
</html>
|
||||
275
templates/emails/modern.html
Normal file
275
templates/emails/modern.html
Normal file
@@ -0,0 +1,275 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<title>{{email_heading}}</title>
|
||||
<style>
|
||||
/* Reset */
|
||||
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; }
|
||||
|
||||
/* Base */
|
||||
body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
width: 100% !important;
|
||||
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
|
||||
background-color: #f5f5f7;
|
||||
color: #1d1d1f;
|
||||
line-height: 1.6;
|
||||
}
|
||||
|
||||
/* Container */
|
||||
.email-container {
|
||||
max-width: 600px;
|
||||
margin: 0 auto;
|
||||
background-color: #ffffff;
|
||||
}
|
||||
|
||||
/* Header */
|
||||
.email-header {
|
||||
padding: 40px 40px 30px;
|
||||
text-align: center;
|
||||
border-bottom: 1px solid #e5e5e7;
|
||||
}
|
||||
|
||||
.email-logo {
|
||||
font-size: 28px;
|
||||
font-weight: 700;
|
||||
color: #1d1d1f;
|
||||
text-decoration: none;
|
||||
letter-spacing: -0.5px;
|
||||
}
|
||||
|
||||
/* Content */
|
||||
.email-content {
|
||||
padding: 40px;
|
||||
}
|
||||
|
||||
.email-heading {
|
||||
font-size: 24px;
|
||||
font-weight: 600;
|
||||
color: #1d1d1f;
|
||||
margin: 0 0 20px;
|
||||
line-height: 1.3;
|
||||
}
|
||||
|
||||
.email-text {
|
||||
font-size: 16px;
|
||||
color: #424245;
|
||||
margin: 0 0 16px;
|
||||
line-height: 1.6;
|
||||
}
|
||||
|
||||
.email-text strong {
|
||||
color: #1d1d1f;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
/* Button */
|
||||
.email-button {
|
||||
display: inline-block;
|
||||
padding: 14px 32px;
|
||||
background-color: #0071e3;
|
||||
color: #ffffff !important;
|
||||
text-decoration: none;
|
||||
border-radius: 8px;
|
||||
font-size: 16px;
|
||||
font-weight: 500;
|
||||
margin: 24px 0;
|
||||
transition: background-color 0.2s;
|
||||
}
|
||||
|
||||
.email-button:hover {
|
||||
background-color: #0077ed;
|
||||
}
|
||||
|
||||
/* Info Box */
|
||||
.info-box {
|
||||
background-color: #f5f5f7;
|
||||
border-radius: 12px;
|
||||
padding: 24px;
|
||||
margin: 24px 0;
|
||||
}
|
||||
|
||||
.info-row {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
padding: 8px 0;
|
||||
border-bottom: 1px solid #e5e5e7;
|
||||
}
|
||||
|
||||
.info-row:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
.info-label {
|
||||
font-size: 14px;
|
||||
color: #6e6e73;
|
||||
}
|
||||
|
||||
.info-value {
|
||||
font-size: 14px;
|
||||
color: #1d1d1f;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
/* Table */
|
||||
.email-table {
|
||||
width: 100%;
|
||||
border-collapse: collapse;
|
||||
margin: 24px 0;
|
||||
}
|
||||
|
||||
.email-table th {
|
||||
text-align: left;
|
||||
padding: 12px;
|
||||
background-color: #f5f5f7;
|
||||
font-size: 13px;
|
||||
font-weight: 600;
|
||||
color: #6e6e73;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.5px;
|
||||
}
|
||||
|
||||
.email-table td {
|
||||
padding: 16px 12px;
|
||||
border-bottom: 1px solid #e5e5e7;
|
||||
font-size: 15px;
|
||||
color: #1d1d1f;
|
||||
}
|
||||
|
||||
.email-table tr:last-child td {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
/* Footer */
|
||||
.email-footer {
|
||||
padding: 30px 40px;
|
||||
background-color: #f5f5f7;
|
||||
text-align: center;
|
||||
border-top: 1px solid #e5e5e7;
|
||||
}
|
||||
|
||||
.email-footer-text {
|
||||
font-size: 13px;
|
||||
color: #6e6e73;
|
||||
margin: 0 0 8px;
|
||||
}
|
||||
|
||||
.email-footer-link {
|
||||
color: #0071e3;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
/* Responsive */
|
||||
@media only screen and (max-width: 600px) {
|
||||
.email-header,
|
||||
.email-content,
|
||||
.email-footer {
|
||||
padding: 30px 20px !important;
|
||||
}
|
||||
|
||||
.email-heading {
|
||||
font-size: 20px !important;
|
||||
}
|
||||
|
||||
.info-box {
|
||||
padding: 16px !important;
|
||||
}
|
||||
}
|
||||
|
||||
/* Dark mode */
|
||||
@media (prefers-color-scheme: dark) {
|
||||
body {
|
||||
background-color: #000000 !important;
|
||||
}
|
||||
|
||||
.email-container {
|
||||
background-color: #1c1c1e !important;
|
||||
}
|
||||
|
||||
.email-header {
|
||||
border-bottom-color: #38383a !important;
|
||||
}
|
||||
|
||||
.email-logo,
|
||||
.email-heading,
|
||||
.info-value,
|
||||
.email-table td {
|
||||
color: #f5f5f7 !important;
|
||||
}
|
||||
|
||||
.email-text {
|
||||
color: #a1a1a6 !important;
|
||||
}
|
||||
|
||||
.email-text strong {
|
||||
color: #f5f5f7 !important;
|
||||
}
|
||||
|
||||
.info-box {
|
||||
background-color: #2c2c2e !important;
|
||||
}
|
||||
|
||||
.info-row {
|
||||
border-bottom-color: #38383a !important;
|
||||
}
|
||||
|
||||
.email-table th {
|
||||
background-color: #2c2c2e !important;
|
||||
}
|
||||
|
||||
.email-table td {
|
||||
border-bottom-color: #38383a !important;
|
||||
}
|
||||
|
||||
.email-footer {
|
||||
background-color: #1c1c1e !important;
|
||||
border-top-color: #38383a !important;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<table role="presentation" cellspacing="0" cellpadding="0" border="0" width="100%">
|
||||
<tr>
|
||||
<td style="padding: 40px 20px;">
|
||||
<table role="presentation" cellspacing="0" cellpadding="0" border="0" class="email-container">
|
||||
<!-- Header -->
|
||||
<tr>
|
||||
<td class="email-header">
|
||||
<a href="{{store_url}}" class="email-logo">{{store_name}}</a>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<!-- Content -->
|
||||
<tr>
|
||||
<td class="email-content">
|
||||
<h1 class="email-heading">{{email_heading}}</h1>
|
||||
|
||||
<!-- Dynamic content will be inserted here -->
|
||||
{{email_content}}
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<!-- Footer -->
|
||||
<tr>
|
||||
<td class="email-footer">
|
||||
<p class="email-footer-text">
|
||||
© {{current_year}} {{store_name}}. All rights reserved.
|
||||
</p>
|
||||
<p class="email-footer-text">
|
||||
<a href="{{store_url}}" class="email-footer-link">Visit our store</a>
|
||||
</p>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user