Samir Boulahtit
0fca762b33
Implement complete marketing homepage for Wizamart targeting Letzshop vendors in Luxembourg. Includes: - Marketing homepage with hero, pricing tiers, and add-ons - 4-step signup wizard with Stripe card collection (30-day trial) - Letzshop vendor lookup for shop claiming - Platform API endpoints for pricing, vendors, and signup - Stripe SetupIntent integration for trial with card upfront - Database fields for Letzshop vendor identity tracking 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
82 lines
4.1 KiB
HTML
82 lines
4.1 KiB
HTML
{# app/templates/platform/signup-success.html #}
|
|
{# Signup Success Page #}
|
|
{% extends "platform/base.html" %}
|
|
|
|
{% block title %}Welcome to Wizamart!{% endblock %}
|
|
|
|
{% block content %}
|
|
<div class="min-h-screen py-16 bg-gray-50 dark:bg-gray-900 flex items-center justify-center">
|
|
<div class="max-w-lg mx-auto px-4 sm:px-6 lg:px-8 text-center">
|
|
|
|
{# Success Icon #}
|
|
<div class="w-24 h-24 mx-auto mb-8 bg-green-100 dark:bg-green-900/30 rounded-full flex items-center justify-center">
|
|
<svg class="w-12 h-12 text-green-600 dark:text-green-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"/>
|
|
</svg>
|
|
</div>
|
|
|
|
{# Welcome Message #}
|
|
<h1 class="text-4xl font-bold text-gray-900 dark:text-white mb-4">
|
|
Welcome to Wizamart!
|
|
</h1>
|
|
|
|
<p class="text-xl text-gray-600 dark:text-gray-400 mb-8">
|
|
Your account has been created and your {{ trial_days }}-day free trial has started.
|
|
</p>
|
|
|
|
{# Next Steps #}
|
|
<div class="bg-white dark:bg-gray-800 rounded-2xl p-8 border border-gray-200 dark:border-gray-700 text-left mb-8">
|
|
<h2 class="text-lg font-semibold text-gray-900 dark:text-white mb-4">What's Next?</h2>
|
|
<ul class="space-y-4">
|
|
<li class="flex items-start">
|
|
<div class="w-6 h-6 bg-indigo-100 dark:bg-indigo-900/30 rounded-full flex items-center justify-center flex-shrink-0 mt-0.5">
|
|
<span class="text-indigo-600 dark:text-indigo-400 text-sm font-bold">1</span>
|
|
</div>
|
|
<span class="ml-3 text-gray-700 dark:text-gray-300">
|
|
<strong>Connect Letzshop:</strong> Add your API key to start syncing orders automatically.
|
|
</span>
|
|
</li>
|
|
<li class="flex items-start">
|
|
<div class="w-6 h-6 bg-indigo-100 dark:bg-indigo-900/30 rounded-full flex items-center justify-center flex-shrink-0 mt-0.5">
|
|
<span class="text-indigo-600 dark:text-indigo-400 text-sm font-bold">2</span>
|
|
</div>
|
|
<span class="ml-3 text-gray-700 dark:text-gray-300">
|
|
<strong>Set Up Invoicing:</strong> Configure your invoice settings for Luxembourg compliance.
|
|
</span>
|
|
</li>
|
|
<li class="flex items-start">
|
|
<div class="w-6 h-6 bg-indigo-100 dark:bg-indigo-900/30 rounded-full flex items-center justify-center flex-shrink-0 mt-0.5">
|
|
<span class="text-indigo-600 dark:text-indigo-400 text-sm font-bold">3</span>
|
|
</div>
|
|
<span class="ml-3 text-gray-700 dark:text-gray-300">
|
|
<strong>Import Products:</strong> Sync your product catalog from Letzshop.
|
|
</span>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
|
|
{# CTA Button #}
|
|
{% if vendor_code %}
|
|
<a href="/vendor/{{ vendor_code }}/dashboard"
|
|
class="inline-flex items-center px-8 py-4 bg-indigo-600 hover:bg-indigo-700 text-white font-semibold rounded-xl shadow-lg transition-all hover:scale-105">
|
|
Go to Dashboard
|
|
<svg class="w-5 h-5 ml-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 7l5 5m0 0l-5 5m5-5H6"/>
|
|
</svg>
|
|
</a>
|
|
{% else %}
|
|
<a href="/admin/login"
|
|
class="inline-flex items-center px-8 py-4 bg-indigo-600 hover:bg-indigo-700 text-white font-semibold rounded-xl shadow-lg transition-all">
|
|
Login to Dashboard
|
|
</a>
|
|
{% endif %}
|
|
|
|
{# Support Link #}
|
|
<p class="mt-8 text-gray-500 dark:text-gray-400">
|
|
Need help getting started?
|
|
<a href="/contact" class="text-indigo-600 dark:text-indigo-400 hover:underline">Contact our support team</a>
|
|
</p>
|
|
</div>
|
|
</div>
|
|
{% endblock %}
|