- All text-[20rem] background text → text-[8rem] md:text-[20rem] - All text-8xl → text-5xl md:text-8xl - All text-5xl emojis → text-3xl md:text-5xl - edit_event: w-full md:w-[80%], poster column w-full lg:w-[350px] - account/index: tab bar overflow-x-auto, events table overflow-x-auto - admin/events: table overflow-x-auto - register: tab buttons overflow-x-auto - error 404/500: responsive padding p-6 md:p-12 - base footer: flex-col sm:flex-row for bottom bar - Add PWA bundle (spomky-labs/pwa-bundle) with composer require files Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
177 lines
8.7 KiB
Twig
177 lines
8.7 KiB
Twig
{% extends 'base.html.twig' %}
|
|
|
|
{% block title %}Inscription - E-Ticket{% endblock %}
|
|
{% block description %}Creez votre compte E-Ticket en tant qu'acheteur ou organisateur d'evenements{% endblock %}
|
|
|
|
{% block body %}
|
|
<div class="page-container-sm">
|
|
<h1 class="heading-page text-3xl font-black uppercase tracking-tighter italic">Inscription</h1>
|
|
<p class="font-bold text-gray-600 italic mb-8">Creez votre compte.</p>
|
|
|
|
{% if app.environment == 'prod' %}
|
|
<div class="card-brutal-lg text-center">
|
|
<div class="text-5xl mb-4">🚧</div>
|
|
<h2 class="text-2xl font-black uppercase tracking-tighter italic mb-4">Inscriptions</h2>
|
|
<p class="font-bold text-gray-500 italic mb-8">Ouverture des inscriptions prochainement !</p>
|
|
<p class="text-sm font-bold text-gray-600 mb-8">La plateforme E-Ticket est en cours de preparation. Les inscriptions seront bientot disponibles.</p>
|
|
<a href="{{ path('app_home') }}" class="btn-brutal font-black uppercase text-sm tracking-widest hover:bg-indigo-600 hover:text-white transition-all">
|
|
Retour a l'accueil
|
|
</a>
|
|
</div>
|
|
{% else %}
|
|
|
|
{% for message in app.flashes('success') %}
|
|
<div class="flash-success mb-8">
|
|
<p class="font-black text-sm">{{ message }}</p>
|
|
</div>
|
|
{% endfor %}
|
|
|
|
{% for message in app.flashes('error') %}
|
|
<div class="flash-error mb-8">
|
|
<p class="font-black text-sm">{{ message }}</p>
|
|
</div>
|
|
{% endfor %}
|
|
|
|
<div class="flex overflow-x-auto mb-8">
|
|
<button data-tab="tab-buyer" type="button"
|
|
class="flex-1 py-3 border-3 border-gray-900 border-r-0 cursor-pointer bg-gray-900 text-white font-black uppercase text-sm tracking-widest transition-all">
|
|
Acheteur
|
|
</button>
|
|
<button data-tab="tab-organizer" type="button"
|
|
class="flex-1 py-3 border-3 border-gray-900 cursor-pointer bg-white text-gray-900 font-black uppercase text-sm tracking-widest transition-all">
|
|
Organisateur
|
|
</button>
|
|
</div>
|
|
|
|
<div id="tab-buyer" class="block">
|
|
<form method="post" action="{{ path('app_register') }}" class="form-col">
|
|
<input type="hidden" name="type" value="buyer">
|
|
<div class="form-row">
|
|
<div class="form-group min-w-[150px]">
|
|
<label for="buyer_last_name" class="form-label text-xs font-black uppercase tracking-widest">Nom</label>
|
|
<input type="text" id="buyer_last_name" name="last_name" required
|
|
class="form-input focus:border-indigo-600"
|
|
placeholder="Dupont">
|
|
</div>
|
|
<div class="form-group min-w-[150px]">
|
|
<label for="buyer_first_name" class="form-label text-xs font-black uppercase tracking-widest">Prenom</label>
|
|
<input type="text" id="buyer_first_name" name="first_name" required
|
|
class="form-input focus:border-indigo-600"
|
|
placeholder="Jean">
|
|
</div>
|
|
</div>
|
|
|
|
<div>
|
|
<label for="buyer_email" class="form-label text-xs font-black uppercase tracking-widest">Email</label>
|
|
<input type="email" id="buyer_email" name="email" required
|
|
class="form-input focus:border-indigo-600"
|
|
placeholder="jean.dupont@exemple.fr">
|
|
</div>
|
|
|
|
<div>
|
|
<label for="buyer_password" class="form-label text-xs font-black uppercase tracking-widest">Mot de passe</label>
|
|
<input type="password" id="buyer_password" name="password" required minlength="8"
|
|
class="form-input focus:border-indigo-600"
|
|
placeholder="••••••••">
|
|
</div>
|
|
|
|
<div>
|
|
<button type="submit"
|
|
class="btn-brutal-full bg-yellow-400 font-black uppercase text-sm tracking-widest hover:bg-indigo-600 hover:text-white transition-all">
|
|
Creer mon compte
|
|
</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
|
|
<div id="tab-organizer" class="hidden">
|
|
<form method="post" action="{{ path('app_register') }}" class="form-col">
|
|
<input type="hidden" name="type" value="organizer">
|
|
<div class="form-row">
|
|
<div class="form-group min-w-[150px]">
|
|
<label for="orga_last_name" class="form-label text-xs font-black uppercase tracking-widest">Nom</label>
|
|
<input type="text" id="orga_last_name" name="last_name" required
|
|
class="form-input focus:border-indigo-600"
|
|
placeholder="Dupont">
|
|
</div>
|
|
<div class="form-group min-w-[150px]">
|
|
<label for="orga_first_name" class="form-label text-xs font-black uppercase tracking-widest">Prenom</label>
|
|
<input type="text" id="orga_first_name" name="first_name" required
|
|
class="form-input focus:border-indigo-600"
|
|
placeholder="Jean">
|
|
</div>
|
|
</div>
|
|
|
|
<div>
|
|
<label for="orga_company" class="form-label text-xs font-black uppercase tracking-widest">Raison sociale / Nom de l'association</label>
|
|
<input type="text" id="orga_company" name="company_name" required
|
|
class="form-input focus:border-indigo-600"
|
|
placeholder="Mon association">
|
|
</div>
|
|
|
|
<div>
|
|
<label for="orga_siret" class="form-label text-xs font-black uppercase tracking-widest">SIRET</label>
|
|
<input type="text" id="orga_siret" name="siret" required pattern="[0-9]{14}" maxlength="14"
|
|
class="form-input focus:border-indigo-600"
|
|
placeholder="12345678901234">
|
|
</div>
|
|
|
|
<div>
|
|
<label for="orga_email" class="form-label text-xs font-black uppercase tracking-widest">Email</label>
|
|
<input type="email" id="orga_email" name="email" required
|
|
class="form-input focus:border-indigo-600"
|
|
placeholder="contact@association.fr">
|
|
</div>
|
|
|
|
<div>
|
|
<label for="orga_address" class="form-label text-xs font-black uppercase tracking-widest">Adresse</label>
|
|
<input type="text" id="orga_address" name="address" required
|
|
class="form-input focus:border-indigo-600"
|
|
placeholder="12 rue de la Paix">
|
|
</div>
|
|
|
|
<div class="form-row">
|
|
<div class="form-group min-w-[120px]">
|
|
<label for="orga_postal" class="form-label text-xs font-black uppercase tracking-widest">Code postal</label>
|
|
<input type="text" id="orga_postal" name="postal_code" required pattern="[0-9]{5}" maxlength="5"
|
|
class="form-input focus:border-indigo-600"
|
|
placeholder="75001">
|
|
</div>
|
|
<div class="form-group min-w-[150px] flex-[2]">
|
|
<label for="orga_city" class="form-label text-xs font-black uppercase tracking-widest">Ville</label>
|
|
<input type="text" id="orga_city" name="city" required
|
|
class="form-input focus:border-indigo-600"
|
|
placeholder="Paris">
|
|
</div>
|
|
</div>
|
|
|
|
<div>
|
|
<label for="orga_phone" class="form-label text-xs font-black uppercase tracking-widest">Telephone</label>
|
|
<input type="tel" id="orga_phone" name="phone" required
|
|
class="form-input focus:border-indigo-600"
|
|
placeholder="06 12 34 56 78">
|
|
</div>
|
|
|
|
<div>
|
|
<label for="orga_password" class="form-label text-xs font-black uppercase tracking-widest">Mot de passe</label>
|
|
<input type="password" id="orga_password" name="password" required minlength="8"
|
|
class="form-input focus:border-indigo-600"
|
|
placeholder="••••••••">
|
|
</div>
|
|
|
|
<div>
|
|
<button type="submit"
|
|
class="btn-brutal-full bg-yellow-400 font-black uppercase text-sm tracking-widest hover:bg-indigo-600 hover:text-white transition-all">
|
|
Creer mon compte organisateur
|
|
</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
|
|
<div class="mt-8 text-center">
|
|
<p class="text-sm font-bold text-gray-600">Deja un compte ? <a href="{{ path('app_login') }}" class="text-indigo-600 hover:underline font-black">Connexion</a></p>
|
|
</div>
|
|
{% endif %}
|
|
</div>
|
|
{% endblock %}
|