Test du Bouton HelloAsso Officiel
Voici le nouveau bouton HelloAsso qui devrait correspondre au design officiel :
Bouton par défaut
Bouton désactivé
✅ Corrections apportées :
- Logo : Fond blanc avec bordure violette (#4c40cf)
- Label : Fond violet (#4c40cf) avec texte blanc
- Hover : Couleur plus foncée (#483dbe) avec bordures
- Focus : Box-shadow vert HelloAsso (rgba(73, 211, 138, 0.25))
- Section sécurisé : Texte bleu foncé (#2e2f5e)
- URLs des logos : Versions non-white pour le bon contraste
- 🆕 Override CSS : Règles !important pour neutraliser Bootstrap
- 🆕 Reset complet : Annulation des styles de boutons existants
- 🆕 Display forcé : Flex layouts garantis avec !important
🔧 Problèmes résolus :
- Bootstrap .btn : Styles de boutons Bootstrap complètement neutralisés
- Flexbox : Display flex forcé avec !important
- Font-weight : Réinitialisé pour éviter l'héritage Bootstrap
- Images : Styles d'images réinitialisés (max-width, border, etc.)
- Hover/Focus : États Bootstrap désactivés, états HelloAsso activés
- Apparence : Apparence native des boutons supprimée
Le bouton devrait maintenant correspondre exactement au design officiel HelloAsso !
Testez le hover et le focus pour voir les animations.