Démo des composants
Présentation de tous les composants de carte de campagne inspirés du design de l'affiche "VOTE AVI". Caractéristiques : typographie audacieuse, couleurs plates et ombres géométriques.
Démonstration bilingue interactive
Cette démonstration montre comment nos composants s'adaptent automatiquement au contexte linguistique. Testez le commutateur de langue pour voir le contenu changer instantanément.
Composant de commutation de langue
Le composant LanguageToggle fournit un moyen propre et accessible de basculer entre l'anglais et le français.
Construit avec Astro Islands pour des performances optimales utilisant l'hydratation client:idle.
Variantes de taille
Petit
Moyen (par défaut)
Grand
Fonctionnalités de performance
- • client:idle - JavaScript se charge quand le navigateur est inactif
- • Amélioration progressive - Fonctionne sans JS
- • Accessible - Étiquettes ARIA et navigation au clavier
- • Léger - Bundle JavaScript minimal
- • Système d'événements - Diffuse des événements languageChange
- • Prêt pour l'analytique - Support de suivi intégré
Exemple d'utilisation :
import LanguageToggle from '../components/LanguageToggle.astro'
<LanguageToggle
currentLang="fr"
size="medium"
variant="default"
client:idle
/> Exemples de contenu français
Transition vers la propriété démocratique pour 50% des entreprises canadiennes d'ici 2040.