Spaces:
Running
Running
| <html lang="fr"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>TIE - Votre chauffeur</title> | |
| <script src="https://cdn.tailwindcss.com"></script> | |
| <link rel="stylesheet" href="style.css"> | |
| <script> | |
| tailwind.config = { | |
| theme: { | |
| extend: { | |
| colors: { | |
| tie: { | |
| beige: '#F5F1E8', | |
| gray: '#E8E6E1', | |
| anthracite: '#2C2C2C', | |
| green: '#28665A', | |
| lightgreen: '#E8F3F1' | |
| } | |
| } | |
| } | |
| } | |
| } | |
| </script> | |
| </head> | |
| <body class="bg-tie-beige min-h-screen flex flex-col"> | |
| <main class="container mx-auto px-6 py-12 max-w-md flex-grow flex flex-col items-center justify-center"> | |
| <!-- QR Code Section --> | |
| <div class="text-center mb-12"> | |
| <div class="mb-8 p-6 bg-white rounded-lg shadow-sm border border-tie-gray/20"> | |
| <img src="https://api.qrserver.com/v1/create-qr-code/?size=200x200&data=https://tie.com/driver/jean" | |
| alt="QR Code" | |
| class="w-48 h-48 mx-auto"> | |
| <p class="text-tie-anthracite/50 text-sm mt-4">Scannez avec votre appareil photo</p> | |
| </div> | |
| <!-- Human Message --> | |
| <h1 class="text-3xl font-light text-tie-anthracite mb-3">Vous venez de voyager avec Jean</h1> | |
| <p class="text-tie-anthracite/60 max-w-xs mx-auto">Ajoutez votre chauffeur pour réserver facilement vos prochaines courses.</p> | |
| </div> | |
| <!-- Reassurance Messages --> | |
| <div class="text-center text-tie-anthracite/50 text-sm space-y-2 mb-16"> | |
| <p>✔️ Gratuit pour les clients</p> | |
| <p>✔️ Sans inscription compliquée</p> | |
| <p>✔️ Réservation directe avec votre chauffeur</p> | |
| </div> | |
| <!-- Signature --> | |
| <div class="text-center text-tie-anthracite/40"> | |
| <div class="text-xl font-medium mb-1">TIE</div> | |
| <p class="text-xs">Tout commence par un bon feeling.</p> | |
| </div> | |
| </main> | |
| <style> | |
| .container { | |
| max-width: 420px; | |
| } | |
| </style> | |
| </body> | |
| </html> |