Prise en charge de variables de couleur pour les boutons d’affichage de carte

  • Rversion finale: Xanadu
  • Mis à jour 1 août 2024
  • 1 minute de lecture
  • Découvrez comment utiliser des variables de couleur pour changer le thème des boutons d’affichage de votre carte mobile.

    Utilisez des variables de couleur dans les attributs d’élément de modèle de carte pour contrôler les valeurs de couleur des boutons d’icône sur vos cartes mobiles.

    Les variables de couleur suivantes peuvent être utilisées :
    • VariableDeCouleurArrière-plan
    • BorderColorVariable
    • TextColorVariable

    Pour en savoir plus sur ces attributs, reportez-vous à la section Attributs d'élément de modèle de carte.

    Variable de couleur utilisée dans un élément de modèle de vue de carte

    Guide de style du bouton

    Couleur Exemple Variables
    Primaire Exemple de bouton primaire
    Arrière-plan

    Variable mobile : primaire

    Variable Web : now-color--primary-1

    Texte

    Variable mobile : Texte actionnable

    Variable Web : now-color_text--primary-actionable

    Secondaire Exemple de bouton secondaire
    Arrière-plan

    Variable mobile : arrière-plan primaire

    Variable Web : now-color_background--primary

    Texte

    Variable mobile : primaire

    Variable Web : now-color--primary-1

    Bordure (2px)

    Variable mobile : primaire

    Variable Web : now-color--primary-1

    Positif Exemple de bouton positif
    Arrière-plan

    Variable mobile : positive

    Variable Web : now-color_alert--positive-3

    Texte

    Variable mobile : Texte actionnable

    Variable Web : now-color_text--primary-actionable

    Destructif Exemple de bouton destructeur
    Arrière-plan

    Variable mobile : destructive

    Variable Web : now-color_alert--critical-3

    Texte

    Variable mobile : Texte actionnable

    Variable Web : now-color_text--primary-actionable

    Nu Exemple de bouton nu
    Arrière-plan

    Variable mobile : Primaire/Positif/Destructif

    Variable Web : now-color--primary-1/

    now-color_alert--positive-3/

    now-color_alert--critical-3

    Texte

    Variable mobile : Texte actionnable

    Variable Web : now-color_text--primary-actionable

    Remarque :
    Ce bouton peut être configuré avec une couleur primaire, positive ou destructive.
    Désactivé Exemple de bouton désactivé

    Utilisez ce style lorsque l’action n’est pas disponible hors ligne.

    Peut être utilisé avec tous les styles : primaire, secondaire, texte/icône.