File size: 6,168 Bytes
27c799c | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 | {% extends "authentication/email/base_email.html" %}
{% block content %}
<!-- HERO -->
<table width="100%" cellpadding="0" cellspacing="0">
<tr>
<td style="padding: 48px 0 32px 0; text-align:center;">
<div style="display:inline-block; width:72px; height:72px; background:linear-gradient(135deg, #F5A623, #FDB835); border-radius:50%; line-height:72px; text-align:center; font-size:30px; margin-bottom:24px;">
🎉
</div>
<h1 style="font-family:'Playfair Display','Georgia',serif; font-size:30px; font-weight:700; color:#1A4D3C; line-height:1.2; margin-bottom:16px;">
Welcome to Fashionistar!
</h1>
<p style="font-family:'Inter',Arial,sans-serif; font-size:16px; color:#555; line-height:1.6; max-width:420px; margin:0 auto;">
Your account has been created successfully. You're now part of Nigeria's
premier AI-powered fashion marketplace.
</p>
</td>
</tr>
<!-- VERIFY OTP CARD -->
<tr>
<td style="padding: 0 0 32px 0;">
<table width="100%" cellpadding="0" cellspacing="0">
<tr>
<td style="background: linear-gradient(135deg, #1A4D3C 0%, #0D3327 100%); border-radius:16px; padding: 36px 40px; text-align:center;">
<p style="font-family:'Inter',Arial,sans-serif; font-size:13px; color:rgba(255,255,255,0.7); letter-spacing:2px; text-transform:uppercase; margin-bottom:16px;">
Step 1 — Verify Your Email
</p>
<p style="font-family:'Inter',Arial,sans-serif; font-size:14px; color:rgba(255,255,255,0.8); margin-bottom:24px; line-height:1.6;">
Enter this OTP in the Fashionistar verification screen to activate your account:
</p>
<div style="background:rgba(245,166,35,0.15); border:2px solid #F5A623; border-radius:12px; padding:20px 32px; display:inline-block;">
<span style="font-family:'Courier New',monospace; font-size:42px; font-weight:800; color:#F5A623; letter-spacing:16px; line-height:1;">
{{ otp }}
</span>
</div>
<p style="font-family:'Inter',Arial,sans-serif; font-size:12px; color:rgba(255,255,255,0.5); margin-top:20px;">
⏱ Expires in <strong style="color:#F5A623;">5 minutes</strong>
</p>
</td>
</tr>
</table>
</td>
</tr>
<!-- WHAT YOU CAN DO -->
<tr>
<td style="padding: 0 0 32px 0;">
<p style="font-family:'Playfair Display','Georgia',serif; font-size:18px; font-weight:700; color:#1A4D3C; margin-bottom:20px;">
After verification, you can:
</p>
<table width="100%" cellpadding="0" cellspacing="0">
<!-- Feature 1 -->
<tr>
<td style="padding:12px 0; border-bottom:1px solid #F0F0F0;">
<table width="100%" cellpadding="0" cellspacing="0">
<tr>
<td style="width:48px; vertical-align:top;">
<div style="width:40px; height:40px; background:linear-gradient(135deg,#F5A623,#FDB835); border-radius:10px; line-height:40px; text-align:center; font-size:18px;">🛍️</div>
</td>
<td style="padding-left:16px; vertical-align:top;">
<p style="font-family:'Inter',Arial,sans-serif; font-size:14px; font-weight:600; color:#1A1A1A; margin-bottom:4px;">Shop from thousands of fashion vendors</p>
<p style="font-family:'Inter',Arial,sans-serif; font-size:13px; color:#888; line-height:1.5;">Discover curated styles, trending pieces, and AI-recommended outfits</p>
</td>
</tr>
</table>
</td>
</tr>
<!-- Feature 2 -->
<tr>
<td style="padding:12px 0; border-bottom:1px solid #F0F0F0;">
<table width="100%" cellpadding="0" cellspacing="0">
<tr>
<td style="width:48px; vertical-align:top;">
<div style="width:40px; height:40px; background:linear-gradient(135deg,#1A4D3C,#0D3327); border-radius:10px; line-height:40px; text-align:center; font-size:18px;">📏</div>
</td>
<td style="padding-left:16px; vertical-align:top;">
<p style="font-family:'Inter',Arial,sans-serif; font-size:14px; font-weight:600; color:#1A1A1A; margin-bottom:4px;">Get AI-powered size recommendations</p>
<p style="font-family:'Inter',Arial,sans-serif; font-size:13px; color:#888; line-height:1.5;">Our AI analyses your measurements for the perfect fit every time</p>
</td>
</tr>
</table>
</td>
</tr>
<!-- Feature 3 -->
<tr>
<td style="padding:12px 0;">
<table width="100%" cellpadding="0" cellspacing="0">
<tr>
<td style="width:48px; vertical-align:top;">
<div style="width:40px; height:40px; background:linear-gradient(135deg,#F5A623,#FDB835); border-radius:10px; line-height:40px; text-align:center; font-size:18px;">🏪</div>
</td>
<td style="padding-left:16px; vertical-align:top;">
<p style="font-family:'Inter',Arial,sans-serif; font-size:14px; font-weight:600; color:#1A1A1A; margin-bottom:4px;">Open your own fashion store</p>
<p style="font-family:'Inter',Arial,sans-serif; font-size:13px; color:#888; line-height:1.5;">Become a vendor and reach thousands of fashion-forward Nigerian buyers</p>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
<!-- CTA -->
<tr>
<td style="padding: 0 0 48px 0; text-align:center;">
<a href="{{ SITE_URL }}"
class="btn-cta"
style="display:inline-block; padding:16px 48px; background:linear-gradient(135deg, #F5A623, #FDB835); color:#1A1A1A; font-family:'Inter',Arial,sans-serif; font-size:15px; font-weight:700; border-radius:50px; text-decoration:none; letter-spacing:0.5px; box-shadow: 0 4px 20px rgba(245,166,35,0.4);">
Start Shopping →
</a>
</td>
</tr>
</table>
{% endblock %}
|