Dialogue de bouton

Aperçu

Le composant Avonni Button Dialog est un élément d'interface personnalisable pour Salesforce Experience Cloud qui déclenche une boîte de dialogue modale.

Ce composant est généralement utilisé pour présenter des informations supplémentaires, solliciter une saisie utilisateur, afficher une vidéo ou afficher un message de confirmation sans quitter la page en cours.

Configuration de l'Avonni Button Dialog

Rendre votre Button Dialog génial

1. Ajouter le composant : Trouvez le composant Avonni Button Dialog et faites-le glisser sur votre site.

2. Faites-le paraître génial : Vous pouvez modifier le texte du bouton (le libellé), le style de couleur (la variante) et tous les autres détails visuels que vous souhaitez.

3. Cliquez et créez : Une fenêtre contextuelle (une modale) apparaîtra lorsque vous cliquerez sur le bouton. Vous pouvez glisser toutes sortes de choses intéressantes dans cette fenêtre, comme le composant Avonni Video ou d'autres éléments sympas.

Paramètres supplémentaires

• Masquer l'en-tête : Cela supprime la barre de titre en haut de la fenêtre contextuelle.

• Taille : Choisissez la taille de la fenêtre contextuelle.

• Afficher le pied de page : Ajoute une section en bas de la fenêtre contextuelle – idéal pour des boutons comme « OK » ou « Annuler ».

• Marge intérieure du contenu : Cela contrôle l'espace entre le contenu de la boîte et les bords de la boîte.

Paramètres

Configuration du bouton

Nom	Description
Étiquette	Texte affiché sur le bouton.
Nom de l'icône	Le nom de l'icône dans le Lightning Design System qui sera affichée sur le bouton.
Position de l'icône	La position de l'icône par rapport au libellé ; les options sont « left » ou « right ».
Variante	Définit l'apparence du bouton, comme « brand », « neutral », etc., conformément aux styles prédéfinis dans le Salesforce Design System.
Alignement horizontal	Aligne horizontalement le bouton dans son conteneur ; les options incluent « left », « center » ou « right ».
Étirement	Détermine si le bouton doit s'étendre pour remplir la largeur de son conteneur.
Désactivé	Désactive le bouton, empêchant l'interaction de l'utilisateur.

Configuration de la boîte de dialogue

Nom	Description
Masquer l'en-tête	Active ou désactive la visibilité de l'en-tête de la boîte de dialogue.
Taille	Définit la taille de la boîte de dialogue ; les options peuvent inclure 'petite', 'moyenne', ou 'grande.
Afficher le pied de page	Détermine s'il faut afficher le pied de page de la boîte de dialogue, qui peut contenir des boutons d'action.

🎨 Style

Nom	Description
En-tête	Spécifie la couleur d'arrière-plan de l'en-tête de la boîte de dialogue.
Contenu	Définit la couleur d'arrière-plan de la zone de contenu principale de la boîte de dialogue.
Pied de page	Définit la couleur d'arrière-plan de la zone de pied de page.