fix: Popup consentement pleine hauteur sur mobile

- Délai réduit à 600ms (original)
- Sur mobile: popup s'étire de top-20 à bottom-4 pour couvrir modal date de naissance
- Sur desktop: comportement normal (coin bas gauche)
- Évite l'effet visuel bizarre de superposition tout en respectant RGPD
This commit is contained in:
odentas 2025-10-25 21:32:32 +02:00
parent cdd7bc01a4
commit 59acd5b4ee

View file

@ -16,8 +16,8 @@ export default function PopupAnalyticsConsent({
const [visible, setVisible] = useState(false);
useEffect(() => {
// Afficher le bandeau après un délai (pour laisser le temps au modal de date de naissance)
const t = setTimeout(() => setVisible(true), 2000);
// Afficher le bandeau après un court délai
const t = setTimeout(() => setVisible(true), 600);
return () => clearTimeout(t);
}, []);
@ -42,9 +42,9 @@ export default function PopupAnalyticsConsent({
animate={{ opacity: 1, y: 0, scale: 1 }}
exit={{ opacity: 0, y: 24, scale: 0.98 }}
transition={{ type: "spring", stiffness: 380, damping: 28 }}
className="fixed left-4 bottom-4 z-[100] max-w-sm w-[92vw] sm:w-96"
className="fixed left-4 right-4 bottom-4 top-20 sm:left-4 sm:right-auto sm:top-auto sm:bottom-4 z-[100] sm:max-w-sm sm:w-96"
>
<div className="rounded-2xl border border-slate-200 bg-gradient-to-br from-white to-slate-50 backdrop-blur shadow-lg">
<div className="h-full sm:h-auto overflow-y-auto rounded-2xl border border-slate-200 bg-gradient-to-br from-white to-slate-50 backdrop-blur shadow-lg">
<div className="flex items-start gap-3 p-4">
{/* Icône */}
<div className="mt-0.5 shrink-0 rounded-xl bg-gradient-to-br from-sky-100 to-blue-100 p-2">