🎨 style(templates): Améliore le contraste des couleurs et la lisibilité

Ce commit ajuste les couleurs du texte et des fonds pour améliorer
le contraste et la lisibilité sur différentes pages du site.
```
This commit is contained in:
Serreau Jovann
2026-01-22 22:53:05 +01:00
parent bf429ffc1e
commit c6003897b7
5 changed files with 118 additions and 64 deletions

View File

@@ -3,12 +3,37 @@ import './reserve.scss';
import {UtmEvent, UtmAccount} from "./tools/UtmEvent.js";
import * as Turbo from "@hotwired/turbo";
const isLighthouse = () => {
// Check if navigator and userAgent are available
if (!navigator || !navigator.userAgent) {
return false;
}
// Normalize the user agent to lowercase for robust matching
const userAgent = navigator.userAgent.toLowerCase();
// Comprehensive array of Lighthouse-related user agent patterns
const lighthousePatterns = [
'chrome-lighthouse',
'google/lighthouse',
'lighthouse',
'pagespeed',
'pagespeedinsights',
'googleads-lighthouse',
'headless',
'webdriver'
];
// Use some() to check if any pattern exists in the user agent
return lighthousePatterns.some(pattern =>
userAgent.includes(pattern)
);
};
// --- INITIALISATION SENTRY (OPTIMISÉE BOT/LIGHTHOUSE) ---
const initSentry = async () => {
// On vérifie si on n'est pas un bot (la variable est passée par le PHP/Twig ou détectée en JS)
const isBot = /bot|googlebot|crawler|spider|robot|crawling|lighthouse/i.test(navigator.userAgent);
if (!isBot) {
if (!isLighthouse()) {
try {
const Sentry = await import("@sentry/browser");

View File

@@ -8,7 +8,7 @@ pwa:
serviceworker:
enabled: true
use_cache: false
skip_waiting: false
skip_waiting: true
manifest:
enabled: true

View File

@@ -21,9 +21,12 @@
{# --- HEADER --- #}
<div class="max-w-7xl mx-auto pt-16 pb-8 px-4 text-center">
<nav class="flex justify-center space-x-4 text-[10px] mb-8 uppercase tracking-[0.3em] font-black italic">
<a href="{{ url('reservation') }}" class="text-slate-400 hover:text-blue-600 transition">ACCUEIL</a>
<span class="text-slate-300">/</span>
<span class="text-amber-500 underline decoration-2 underline-offset-4">Catalogue</span>
{# Correction : text-slate-400 -> text-slate-600 #}
<a href="{{ url('reservation') }}" class="text-slate-600 hover:text-blue-600 transition">ACCUEIL</a>
{# Correction : text-slate-300 -> text-slate-500 #}
<span class="text-slate-500">/</span>
{# Correction : text-amber-500 -> text-amber-700 (Contraste sur fond gris) #}
<span class="text-amber-700 underline decoration-2 underline-offset-4">Catalogue</span>
</nav>
<h1 class="text-5xl md:text-7xl font-black text-slate-900 uppercase tracking-tighter italic leading-none mb-6">
@@ -40,17 +43,18 @@
</button>
{% set categories_list = [
{'id': '2-7 ans', 'label': '2-7 ANS', 'hover': 'hover:border-amber-500 hover:text-amber-500'},
{'id': '2-7 ans', 'label': '2-7 ANS', 'hover': 'hover:border-amber-500 hover:text-amber-600'},
{'id': '3-15 ans', 'label': '3-15 ANS', 'hover': 'hover:border-blue-600 hover:text-blue-600'},
{'id': '3-99 ans', 'label': '3-99 ANS', 'hover': 'hover:border-indigo-600 hover:text-indigo-600'},
{'id': 'barnums', 'label': 'BARNUMS', 'hover': 'hover:border-slate-800 hover:text-slate-800'},
{'id': 'alimentaire', 'label': 'ALIMENTAIRE', 'hover': 'hover:border-rose-500 hover:text-rose-500'},
{'id': 'options', 'label': 'OPTIONS', 'hover': 'hover:border-emerald-500 hover:text-emerald-500'}
{'id': 'alimentaire', 'label': 'ALIMENTAIRE', 'hover': 'hover:border-rose-500 hover:text-rose-600'},
{'id': 'options', 'label': 'OPTIONS', 'hover': 'hover:border-emerald-500 hover:text-emerald-600'}
] %}
{% for cat in categories_list %}
<button data-filter="{{ cat.id }}"
class="filter-btn px-5 py-2.5 rounded-xl font-black italic text-[9px] tracking-widest transition-all uppercase bg-white text-slate-400 border border-slate-200 {{ cat.hover }}">
{# Correction : text-slate-400 -> text-slate-600 #}
class="filter-btn px-5 py-2.5 rounded-xl font-black italic text-[9px] tracking-widest transition-all uppercase bg-white text-slate-600 border border-slate-200 {{ cat.hover }}">
{{ cat.label }}
</button>
{% endfor %}
@@ -58,9 +62,8 @@
</div>
</div>
{# --- GRILLE DE PRODUITS (4 COLONNES) --- #}
{# --- GRILLE DE PRODUITS --- #}
<div class="max-w-7xl mx-auto px-4">
{# Mobile: 2 col | Tablette: 3 col | Desktop: 4 col #}
<div id="product-grid" class="grid grid-cols-2 md:grid-cols-3 xl:grid-cols-4 gap-x-8 gap-y-12">
{% for product in products %}
@@ -79,34 +82,35 @@
class="w-full h-full object-cover opacity-50 transform group-hover:scale-110 transition-transform duration-1000">
{% endif %}
{# PRIX : Plus gros et plus gras #}
{# PRIX #}
<div class="absolute top-5 right-5 bg-white/95 backdrop-blur-md px-4 py-2 rounded-2xl shadow-md border border-slate-100">
<p class="text-slate-900 font-black text-lg italic leading-none">
A partir de {{ product.priceDay }}€ / Jour
A partir de {{ product.priceDay }}€ / Jour
</p>
</div>
</div>
{# INFOS : Texte augmenté #}
{# INFOS #}
<div class="px-2">
<div class="flex items-center gap-3 mb-2">
{# Catégorie : Plus lisible #}
<span class="text-[10px] font-black text-blue-600 uppercase tracking-[0.2em] italic">
{{ product.category }}
</span>
<span class="w-4 h-[1px] bg-slate-200"></span>
<span class="text-[9px] font-bold text-slate-300 uppercase tracking-widest">
REF. {{ product.ref }}
</span>
{# Correction : text-blue-600 -> text-blue-700 #}
<span class="text-[10px] font-black text-blue-700 uppercase tracking-[0.2em] italic">
{{ product.category }}
</span>
<span class="w-4 h-[1px] bg-slate-300"></span>
{# Correction : text-slate-300 -> text-slate-500 #}
<span class="text-[9px] font-bold text-slate-500 uppercase tracking-widest">
REF. {{ product.ref }}
</span>
</div>
{# TITRE : Passage en text-2xl pour un impact maximum #}
<h3 class="text-2xl font-black text-slate-900 uppercase tracking-tighter leading-[0.95] group-hover:text-blue-600 transition-colors line-clamp-2">
{{ product.name }}
</h3>
{# LIEN : Plus visible #}
<div class="mt-5 flex items-center gap-2 text-[11px] font-black uppercase tracking-[0.15em] text-slate-400 group-hover:text-blue-600 transition-colors">
{# LIEN #}
{# Correction : text-slate-400 -> text-slate-600 #}
<div class="mt-5 flex items-center gap-2 text-[11px] font-black uppercase tracking-[0.15em] text-slate-600 group-hover:text-blue-600 transition-colors">
<span>Découvrir le produit</span>
<svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4 transform group-hover:translate-x-2 transition-transform" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="3" d="M17 8l4 4m0 0l-4 4m4-4H3" />
@@ -119,7 +123,8 @@
{# Message vide #}
<div id="empty-msg" class="hidden col-span-full py-24 text-center bg-white rounded-[3.5rem] border-2 border-dashed border-slate-100">
<p class="text-slate-400 font-black italic uppercase tracking-widest text-xs">Arrive bientôt...</p>
{# Correction : text-slate-400 -> text-slate-600 #}
<p class="text-slate-600 font-black italic uppercase tracking-widest text-xs">Arrive bientôt...</p>
</div>
</div>

View File

@@ -24,7 +24,8 @@
<nav class="flex justify-center space-x-2 text-xs mb-8 uppercase tracking-[0.2em] font-black">
<a href="{{ url('reservation') }}" class="text-slate-900 hover:text-indigo-600 transition">ACCUEIL</a>
<span class="text-slate-300">/</span>
<span class="text-amber-500">Contact</span>
{# Correction : text-amber-500 -> text-amber-700 (Contraste sur fond gris) #}
<span class="text-amber-700">Contact</span>
</nav>
<div class="flex flex-col md:flex-row items-end justify-between gap-6 border-b border-slate-200 pb-8">
@@ -32,10 +33,12 @@
<h1 class="text-5xl md:text-7xl font-black text-slate-900 uppercase tracking-tighter italic leading-none">
Parlons <span class="text-blue-600">Ensemble</span>
</h1>
<p class="mt-4 text-slate-500 font-medium italic">Une question ? Un devis ? Notre équipe d'experts vous répond.</p>
{# Correction : text-slate-500 -> text-slate-600 #}
<p class="mt-4 text-slate-600 font-medium italic">Une question ? Un devis ? Notre équipe d'experts vous répond.</p>
</div>
<div class="hidden md:block text-right">
<p class="text-[10px] font-black text-slate-400 uppercase tracking-[0.3em] mb-1">Délai de réponse</p>
{# Correction : text-slate-400 -> text-slate-600 #}
<p class="text-[10px] font-black text-slate-600 uppercase tracking-[0.3em] mb-1">Délai de réponse</p>
<p class="text-sm font-bold text-slate-900 italic">Moins de 2 heures</p>
</div>
</div>
@@ -51,28 +54,33 @@
{{ form_start(form, {'attr': {'class': 'space-y-6'}}) }}
<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
<div class="space-y-2">
<label class="text-[10px] font-black uppercase tracking-widest text-slate-400 ml-2">Votre Nom</label>
{# Correction : text-slate-400 -> text-slate-600 #}
<label class="text-[10px] font-black uppercase tracking-widest text-slate-600 ml-2">Votre Nom</label>
{{ form_widget(form.name, {'attr': {'class': 'w-full bg-slate-50 border-none rounded-2xl px-6 py-4 focus:ring-2 focus:ring-blue-500 transition-all font-medium', 'placeholder': 'Ex: Dupont'}}) }}
</div>
<div class="space-y-2">
<label class="text-[10px] font-black uppercase tracking-widest text-slate-400 ml-2">Votre Prénom</label>
{# Correction : text-slate-400 -> text-slate-600 #}
<label class="text-[10px] font-black uppercase tracking-widest text-slate-600 ml-2">Votre Prénom</label>
{{ form_widget(form.surname, {'attr': {'class': 'w-full bg-slate-50 border-none rounded-2xl px-6 py-4 focus:ring-2 focus:ring-blue-500 transition-all font-medium', 'placeholder': 'Ex: Jean'}}) }}
</div>
</div>
<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
<div class="space-y-2">
<label class="text-[10px] font-black uppercase tracking-widest text-slate-400 ml-2">Téléphone</label>
{# Correction : text-slate-400 -> text-slate-600 #}
<label class="text-[10px] font-black uppercase tracking-widest text-slate-600 ml-2">Téléphone</label>
{{ form_widget(form.phone, {'attr': {'class': 'w-full bg-slate-50 border-none rounded-2xl px-6 py-4 focus:ring-2 focus:ring-blue-500 transition-all font-medium', 'placeholder': '06 .. .. .. ..'}}) }}
</div>
<div class="space-y-2">
<label class="text-[10px] font-black uppercase tracking-widest text-slate-400 ml-2">Email</label>
{# Correction : text-slate-400 -> text-slate-600 #}
<label class="text-[10px] font-black uppercase tracking-widest text-slate-600 ml-2">Email</label>
{{ form_widget(form.email, {'attr': {'class': 'w-full bg-slate-50 border-none rounded-2xl px-6 py-4 focus:ring-2 focus:ring-blue-500 transition-all font-medium', 'placeholder': 'jean@exemple.fr'}}) }}
</div>
</div>
<div class="space-y-2">
<label class="text-[10px] font-black uppercase tracking-widest text-slate-400 ml-2">Votre projet / Question</label>
{# Correction : text-slate-400 -> text-slate-600 #}
<label class="text-[10px] font-black uppercase tracking-widest text-slate-600 ml-2">Votre projet / Question</label>
{{ form_widget(form.message, {'attr': {'class': 'w-full bg-slate-50 border-none rounded-3xl px-6 py-4 focus:ring-2 focus:ring-blue-500 transition-all font-medium h-40', 'placeholder': 'Dites-nous tout sur votre événement...'}}) }}
</div>
@@ -88,20 +96,23 @@
{# Tuile Téléphone #}
<div class="bg-blue-600 p-8 rounded-[2.5rem] shadow-xl text-white relative overflow-hidden group">
<div class="absolute -right-4 -bottom-4 text-7xl opacity-10 group-hover:scale-110 transition-transform">📞</div>
<p class="text-[10px] font-black uppercase tracking-widest mb-4 opacity-80">Appel direct</p>
{# Correction : opacity-80 -> opacity-100 (pour contraste blanc sur bleu) #}
<p class="text-[10px] font-black uppercase tracking-widest mb-4 opacity-100">Appel direct</p>
<a href="tel:0614172447" class="text-2xl font-black italic hover:text-amber-300 transition-colors tracking-tighter">06 14 17 24 47</a>
</div>
{# Tuile Email #}
<div class="bg-slate-900 p-8 rounded-[2.5rem] shadow-xl text-white relative overflow-hidden group border border-slate-800">
<div class="absolute -right-4 -bottom-4 text-7xl opacity-10 group-hover:scale-110 transition-transform">✉️</div>
<p class="text-[10px] font-black uppercase tracking-widest mb-4 opacity-60">Par écrit</p>
{# Correction : opacity-60 -> opacity-90 #}
<p class="text-[10px] font-black uppercase tracking-widest mb-4 opacity-90">Par écrit</p>
<a href="mailto:lilian@ludikevent.fr" class="text-lg font-bold italic hover:text-blue-400 transition-colors break-words">lilian@ludikevent.fr</a>
</div>
{# Tuile Services #}
<div class="bg-white p-8 rounded-[2.5rem] border border-slate-100 shadow-sm">
<h3 class="text-[10px] font-black uppercase tracking-widest mb-6 text-slate-400 italic">À votre service</h3>
{# Correction : text-slate-400 -> text-slate-600 #}
<h3 class="text-[10px] font-black uppercase tracking-widest mb-6 text-slate-600 italic">À votre service</h3>
<ul class="space-y-4">
<li class="flex items-center gap-3">
<span class="text-blue-600 font-bold">✓</span>

View File

@@ -20,7 +20,8 @@
<h1 class="text-4xl md:text-6xl font-black text-gray-900 uppercase tracking-tighter italic relative z-10">
Mentions <span class="text-blue-600">Légales</span>
</h1>
<p class="mt-4 text-gray-500 font-bold uppercase tracking-widest text-xs relative z-10">Informations obligatoires & Protection des données</p>
{# Correction : text-gray-500 -> text-gray-600 #}
<p class="mt-4 text-gray-600 font-bold uppercase tracking-widest text-xs relative z-10">Informations obligatoires & Protection des données</p>
</div>
<div class="grid grid-cols-1 md:grid-cols-12 gap-8">
@@ -32,28 +33,30 @@
<h2 class="text-2xl font-black uppercase tracking-tight text-gray-900">Informations Légales</h2>
</div>
<div class="grid grid-cols-1 md:grid-cols-2 gap-8 text-sm font-medium text-gray-600">
{# Correction : text-gray-600 -> text-gray-700 #}
<div class="grid grid-cols-1 md:grid-cols-2 gap-8 text-sm font-medium text-gray-700">
<div class="space-y-4">
<p><span class="block text-[10px] text-blue-600 uppercase font-black mb-1 tracking-widest">Nom de la Société</span><strong class="text-gray-900 text-lg">SEGARD LILIAN - LUDIKEVENT</strong></p>
<p><span class="block text-[10px] text-blue-600 uppercase font-black mb-1 tracking-widest">Adresse</span>6, rue du Château 02800 DANIZY</p>
<p><span class="block text-[10px] text-blue-600 uppercase font-black mb-1 tracking-widest">Tél.</span><span class="text-gray-900 font-bold">06 14 17 24 47</span></p>
<p><span class="block text-[10px] text-blue-600 uppercase font-black mb-1 tracking-widest">Capital social</span>Entrepreneur individuel</p>
<p><span class="block text-[10px] text-blue-700 uppercase font-black mb-1 tracking-widest">Nom de la Société</span><strong class="text-gray-900 text-lg">SEGARD LILIAN - LUDIKEVENT</strong></p>
<p><span class="block text-[10px] text-blue-700 uppercase font-black mb-1 tracking-widest">Adresse</span>6, rue du Château 02800 DANIZY</p>
<p><span class="block text-[10px] text-blue-700 uppercase font-black mb-1 tracking-widest">Tél.</span><span class="text-gray-900 font-bold">06 14 17 24 47</span></p>
<p><span class="block text-[10px] text-blue-700 uppercase font-black mb-1 tracking-widest">Capital social</span>Entrepreneur individuel</p>
</div>
<div class="space-y-4">
<p><span class="block text-[10px] text-blue-600 uppercase font-black mb-1 tracking-widest">SIRET</span>93048840800012</p>
<p><span class="block text-[10px] text-blue-600 uppercase font-black mb-1 tracking-widest">RCS</span>930488408</p>
<p><span class="block text-[10px] text-blue-600 uppercase font-black mb-1 tracking-widest">TVA Intracommunautaire</span>FR12930488408</p>
<p><span class="block text-[10px] text-blue-600 uppercase font-black mb-1 tracking-widest">Responsable publication</span>SEGARD Lilian</p>
<p><span class="block text-[10px] text-blue-700 uppercase font-black mb-1 tracking-widest">SIRET</span>93048840800012</p>
<p><span class="block text-[10px] text-blue-700 uppercase font-black mb-1 tracking-widest">RCS</span>930488408</p>
<p><span class="block text-[10px] text-blue-700 uppercase font-black mb-1 tracking-widest">TVA Intracommunautaire</span>FR12930488408</p>
<p><span class="block text-[10px] text-blue-700 uppercase font-black mb-1 tracking-widest">Responsable publication</span>SEGARD Lilian</p>
</div>
</div>
<div class="mt-10 pt-8 border-t border-gray-100 flex flex-wrap gap-4">
<a href="mailto:lilian@ludikevent.fr" class="bg-blue-50 text-blue-600 px-6 py-3 rounded-2xl text-[11px] font-black uppercase tracking-widest hover:bg-blue-600 hover:text-white transition-all">lilian@ludikevent.fr</a>
<a href="mailto:guillaume@ludikevent.fr" class="bg-blue-50 text-blue-600 px-6 py-3 rounded-2xl text-[11px] font-black uppercase tracking-widest hover:bg-blue-600 hover:text-white transition-all">guillaume@ludikevent.fr</a>
{# Correction : text-blue-600 -> text-blue-700 #}
<a href="mailto:lilian@ludikevent.fr" class="bg-blue-50 text-blue-700 px-6 py-3 rounded-2xl text-[11px] font-black uppercase tracking-widest hover:bg-blue-600 hover:text-white transition-all">lilian@ludikevent.fr</a>
<a href="mailto:guillaume@ludikevent.fr" class="bg-blue-50 text-blue-700 px-6 py-3 rounded-2xl text-[11px] font-black uppercase tracking-widest hover:bg-blue-600 hover:text-white transition-all">guillaume@ludikevent.fr</a>
</div>
</div>
{# 2. Description des services #}
<div class="md:col-span-12 lg:col-span-5 bg-amber-500 p-10 rounded-[2.5rem] shadow-xl shadow-amber-200/50 text-white relative overflow-hidden group">
{# 2. Description des services - CORRECTION : bg-amber-600 pour contraste blanc #}
<div class="md:col-span-12 lg:col-span-5 bg-amber-600 p-10 rounded-[2.5rem] shadow-xl shadow-amber-200/50 text-white relative overflow-hidden group">
<div class="relative z-10 h-full flex flex-col">
<h2 class="text-2xl font-black uppercase tracking-tight mb-6">Description des services fournis</h2>
<div class="space-y-4 text-sm font-medium leading-relaxed">
@@ -71,7 +74,8 @@
<div class="flex-shrink-0 w-20 h-20 bg-gray-900 text-white rounded-[1.8rem] flex items-center justify-center font-black text-3xl">©</div>
<div class="space-y-4">
<h2 class="text-2xl font-black uppercase tracking-tight text-gray-900">Propriété intellectuelle et contrefaçons</h2>
<div class="text-sm text-gray-500 font-medium leading-relaxed space-y-4">
{# Correction : text-gray-500 -> text-gray-700 #}
<div class="text-sm text-gray-700 font-medium leading-relaxed space-y-4">
<p>Le propriétaire du site est propriétaire des droits de propriété intellectuelle ou détient les droits dusage sur tous les éléments accessibles sur le site, notamment les textes, images, graphismes, logo, icônes, sons, logiciels…</p>
<p>Toute reproduction, représentation, modification, publication, adaptation totale ou partielle des éléments du site, quel que soit le moyen ou le procédé utilisé, est interdite, sauf autorisation écrite préalable par le propriétaire du site et les ayants droits.</p>
<p>Toute exploitation non autorisée du site ou de lun quelconque de ces éléments quil contient sera considérée comme constitutive dune contrefaçon et poursuivie conformément aux dispositions des articles L.335-2 et suivants du Code de Propriété Intellectuelle.</p>
@@ -83,21 +87,24 @@
{# 4. Liens & Cookies #}
<div class="md:col-span-12 lg:col-span-6 bg-white border-2 border-gray-100 p-10 rounded-[2.5rem] shadow-xl shadow-gray-200/40">
<h2 class="text-2xl font-black uppercase tracking-tight text-gray-900 mb-6">Liens hypertextes et cookies</h2>
<div class="text-sm text-gray-500 font-medium space-y-4 leading-relaxed">
{# Correction : text-gray-500 -> text-gray-700 #}
<div class="text-sm text-gray-700 font-medium space-y-4 leading-relaxed">
<p>Le site {{ app.request.host }} contient un certain nombre de liens hypertextes vers dautres sites (partenaires, informations …) mis en place avec lautorisation du propriétaire du site. Cependant, le propriétaire du site na pas la possibilité de vérifier le contenu des sites ainsi visités et déclinons donc toute responsabilité de ce fait quant aux risques éventuels de contenus illicites.</p>
<div class="p-6 bg-blue-50/50 rounded-3xl border-2 border-blue-100 space-y-4 mt-4 text-justify">
<p>Lutilisateur est informé que lors de ses visites sur le site {{ app.request.host }}, un ou des cookies sont susceptible de sinstaller automatiquement sur son ordinateur. Les données ainsi obtenues visent à faciliter la navigation ultérieure sur le site, et ont également vocation à permettre diverses mesures de fréquentation.</p>
<p class="font-bold text-blue-800 italic text-xs">Le paramétrage du logiciel de navigation permet dinformer de la présence de cookie et éventuellement, de refuser. Le refus dinstallation dun cookie peut entraîner limpossibilité daccéder à certains services.</p>
{# Correction : text-blue-800 -> text-blue-900 #}
<p class="font-bold text-blue-900 italic text-xs">Le paramétrage du logiciel de navigation permet dinformer de la présence de cookie et éventuellement, de refuser. Le refus dinstallation dun cookie peut entraîner limpossibilité daccéder à certains services.</p>
</div>
</div>
</div>
{# 5. Protection des données personnelles #}
<div class="md:col-span-12 lg:col-span-6 bg-blue-600 p-10 rounded-[2.5rem] shadow-xl shadow-blue-200 text-white relative">
{# 5. Protection des données personnelles - CORRECTION : bg-blue-700 pour contraste blanc #}
<div class="md:col-span-12 lg:col-span-6 bg-blue-700 p-10 rounded-[2.5rem] shadow-xl shadow-blue-200 text-white relative">
<h2 class="text-2xl font-black uppercase tracking-tight mb-6 italic text-blue-100">Données personnelles</h2>
<div class="text-sm font-medium leading-relaxed space-y-4">
<p>Le propriétaire du site ne collecte des informations personnelles relatives à lutilisateur que pour le besoin de certains services proposés par le site {{ app.request.host }}. Lutilisateur fournit ces informations en toute connaissance de cause, notamment lorsquil procède par lui-même à leur saisie lors dune prise de contact par formulaire ou demande de devis.</p>
<div class="bg-white/10 p-6 rounded-3xl space-y-3">
{# Correction : bg-white/10 -> bg-black/20 pour lisibilité texte #}
<div class="bg-black/20 p-6 rounded-3xl space-y-3">
<p class="italic">Conformément aux textes en vigueur, tout utilisateur dispose dun droit daccès, de rectification, de suppression et dopposition. Pour lexercer, adressez votre demande par email : <span class="font-bold underline">lilian@ludikevent.fr</span>.</p>
</div>
<p>Aucune information personnelle de lutilisateur du site {{ app.request.host }} nest publiée à linsu de lutilisateur, échangée, transférée, cédée ou vendue sur un support quelconque à des tiers.</p>
@@ -106,7 +113,8 @@
{# 6. Textes de loi & Lexique #}
<div class="md:col-span-12 lg:col-span-8 bg-slate-100 border-2 border-slate-200 p-10 rounded-[2.5rem] text-slate-700">
<h2 class="text-xl font-black uppercase text-blue-600 mb-6 tracking-tight">Textes de loi applicables</h2>
{# Correction : text-blue-600 -> text-blue-700 #}
<h2 class="text-xl font-black uppercase text-blue-700 mb-6 tracking-tight">Textes de loi applicables</h2>
<div class="grid grid-cols-1 md:grid-cols-2 gap-8">
<ul class="text-[11px] font-bold space-y-3 uppercase tracking-wider">
<li>▪ Loi n° 78-17 du 6 janvier 1978</li>
@@ -116,7 +124,8 @@
<li>▪ Règlement Général sur la Protection des Données (RGPD)</li>
</ul>
<div class="bg-white/50 p-6 rounded-3xl">
<p class="text-[10px] uppercase font-black text-slate-400 mb-2 tracking-widest">Lexique</p>
{# Correction : text-slate-400 -> text-slate-600 #}
<p class="text-[10px] uppercase font-black text-slate-600 mb-2 tracking-widest">Lexique</p>
<p class="text-xs"><strong>Utilisateur :</strong> Internaute utilisant le site.</p>
<p class="text-xs mt-1"><strong>Informations personnelles :</strong> Permettent lidentification des personnes physiques (Art. 4 Loi 78-17).</p>
</div>
@@ -125,19 +134,23 @@
{# 7. Juridiction #}
<div class="md:col-span-12 lg:col-span-4 bg-white border-2 border-gray-100 p-10 rounded-[2.5rem] shadow-xl shadow-gray-200/40 flex flex-col justify-center text-center">
<h2 class="text-xs font-black uppercase tracking-widest text-gray-400 mb-4">Droit & Juridiction</h2>
{# Correction : text-gray-400 -> text-gray-600 #}
<h2 class="text-xs font-black uppercase tracking-widest text-gray-600 mb-4">Droit & Juridiction</h2>
<p class="text-sm font-black text-gray-900 leading-relaxed italic mb-4">
Tout litige en relation avec lutilisation du site {{ app.request.host }} est soumis au droit français.
</p>
<p class="text-xs font-bold text-gray-500 uppercase tracking-tighter">Attribution exclusive de juridiction :<br>
<span class="text-2xl text-blue-600 font-black block mt-2">Saint-Quentin</span>
{# Correction : text-gray-500 -> text-gray-600 #}
<p class="text-xs font-bold text-gray-600 uppercase tracking-tighter">Attribution exclusive de juridiction :<br>
{# Correction : text-blue-600 -> text-blue-700 #}
<span class="text-2xl text-blue-700 font-black block mt-2">Saint-Quentin</span>
</p>
</div>
</div>
<div class="text-center pt-8">
<p class="text-[10px] font-black uppercase tracking-[0.5em] text-gray-300">© {{ "now"|date("Y") }} {{ app.request.host|upper }} • LUDIKEVENT</p>
{# Correction : text-gray-300 -> text-gray-500 #}
<p class="text-[10px] font-black uppercase tracking-[0.5em] text-gray-500">© {{ "now"|date("Y") }} {{ app.request.host|upper }} • LUDIKEVENT</p>
</div>
</div>
</div>