Séparateur

Aperçu

Le composant Avonni Separator divise les sections de contenu au sein des sites Experience Cloud. Il améliore l'attrait visuel et l'organisation des pages web en fournissant une délimitation distincte et personnalisable entre différentes parties du contenu.

Paramètres

🎛️ Propriétés

Nom	Description	Utilisation
Titre	Le texte apparaîtra à côté du séparateur pour fournir du contexte ou des informations supplémentaires.	Implémentez cette propriété pour étiqueter les sections que le séparateur divise, améliorant ainsi la compréhension de l'utilisateur.
Nom de l'icône et taille de l'icône	Incorporez une icône à côté du séparateur pour un contexte visuel supplémentaire. La taille de l'icône peut également être ajustée pour s'adapter à l'esthétique du design.	Utilisez des icônes comme repères visuels qui complètent le titre ou signifient le contenu suivant, contribuant à la fonction communicative du séparateur.
Aligner le contenu	Déterminez le placement du titre et de l'icône par rapport à la ligne du séparateur. Les options incluent Début, Fin, ou Centre.	Alignez le contenu en fonction de la mise en page et de l'importance requise par le design, en veillant à ce que le séparateur s'intègre parfaitement au flux de la page.
Orientation	Définissez l'orientation du séparateur sur Horizontale ou Verticale, offrant une flexibilité dans la façon dont le contenu est divisé.	Choisissez l'orientation appropriée pour mieux correspondre à la mise en page de votre contenu, qu'il s'agisse d'une comparaison côte à côte ou d'une segmentation haut/bas.

🎨 Style

Nom	Description	Utilisation
Titre	Personnalisez l'apparence du titre avec des options pour la couleur, la taille de la police, le style et l'épaisseur.	Stylisez le titre pour qu'il se démarque de manière appropriée et maintienne la cohérence avec le schéma de conception global du site.
Icône	Stylisez l'icône avec la couleur d'arrière-plan, la couleur du premier plan, un état par défaut pour la couleur du premier plan et le rayon de l'icône pour des bords arrondis.	Ajustez finement l'apparence de l'icône pour la rendre plus proéminente ou subtile, en l'alignant sur les objectifs de conception.
Bordure	Définissez la bordure du séparateur en réglant sa taille, sa couleur et son style (plein, en tirets, en pointillés et plus).	Ajustez les paramètres de la bordure pour créer le niveau de distinction souhaité entre les sections de contenu, d'une ligne prononcée à une rupture plus subtile.