Notification ciblée

Le composant Notification ciblée Avonni offre un moyen d’afficher des messages contextuels et des retours au sein de vos applications. C’est comme une note utile qui apparaît pour guider ou informer les utilisateurs.

Configuration de votre notification portée

Ajout du titre et du contenu

• Rédigez votre message :

  • Titre : Fournissez un titre concis et informatif pour votre notification.

  • Texte du contenu : Saisissez le message principal que vous souhaitez transmettre à l'utilisateur.

Ajout d'une icône (optionnel)

• Améliorez votre message avec un indice visuel :

  • Choisissez une icône qui complète le contenu et l'objectif de la notification.

Choix d'une variante

• Définissez le thème de couleur :

  • De base : Gris neutre.

  • Erreur : Rouge, pour les messages critiques ou les erreurs.

  • Sombre : Gris foncé, pour une apparence plus subtile.

  • Succès : Vert, pour les retours positifs ou les actions réussies.

  • Avertissement : Jaune, pour les messages de prudence ou les alertes.

Styliser votre notification portée

• Affinez l'apparence :

  • Disposition et espacement :

    • Marge : Contrôlez l'espacement autour de la notification pour la positionner correctement.

    • Rembourrage : Ajustez l'espacement intérieur pour peaufiner la mise en page et le confort visuel.

    • Taille : Définissez une largeur maximale pour maintenir une apparence cohérente, surtout pour les messages plus longs.

  • Styles de variante : Personnalisez les couleurs et les styles associés à chaque variante (base, erreur, sombre, succès, avertissement).

  • Personnalisation de l'icône : Ajustez la taille, la couleur et la position de l'icône.

Aucune interaction

Le composant Scoped Notification est principalement un élément visuel pour afficher des informations, il n'a donc pas de fonctionnalités interactives ni d'actions.