Configurer une icône de police pour utiliser une variable de thème pour définir sa couleur

  • Rversion finale: Washingtondc
  • Mis à jour 1 févr. 2024
  • 2 minutes de lecture

    • Spécifiez la propriété personnalisée CSS d’un enregistrement de sys_ux_theme pour définir la couleur d’une icône de police.

    Avant de commencer

    Vous devez connaître l’enregistrement sys_ux_theme de la variable de thème que vous souhaitez utiliser pour définir la couleur de votre icône de police. La valeur dont vous avez besoin pour la variable de thème est la propriété personnalisée CSS dans la table des propriétés de sys_ux_theme.

    Rôle requis : admin

    Pourquoi et quand exécuter cette tâche

    Les variables de thème ne peuvent être appliquées qu’aux icônes de police.

    Vous pouvez configurer une icône dans le flux de travail de configuration d’un écran ou vous pouvez configurer une icône en sélectionnant la catégorie Cartes et icônes dans le Générateur d'application mobile menu. Cette procédure utilise la catégorie Cartes et icônes .

    Procédure

    1. Accédez à la Tous > Mobile système > Générateur d'application mobile.
      Générateur d'application mobile s'ouvre dans un onglet de navigateur séparé et affiche l'écran de sélection du périmètre de l'application.
    2. Recherchez le périmètre de l'application dans lequel vous travaillez, puis sélectionnez le nom du périmètre de l'application.
      L'écran d'accueil des catégories Générateur d'application mobile s'affiche.
    3. Sélectionnez la catégorie Cartes et icônes , puis sélectionnez Nouveau.
    4. Dans la boîte de dialogue Créer une carte ou une icône, sélectionnez Icône, puis Continuer.
    5. Dans le formulaire Icône, saisissez un nom pour l’icône.
      Choisissez un nom qui facilite l’identification de l’icône.
    6. Dans la liste déroulante Type, sélectionnez Police.
    7. Dans la section Définir l’apparence, saisissez les informations suivantes dans les champs Style et Valeur pour configurer l’icône de police qui utilise une variable de thème pour définir sa couleur.

      Sélectionnez l’icône Plus pour ajouter une ligne.

      Style Valeur
      Entrez FontName

      Saisissez l’une des familles de polices suivantes :

      • icônes now-mobile

        Ces icônes sont conçues pour être utilisées dans les écrans. Utilisez-les pour les listes et les destinations de section qui redirigent vers les écrans de liste et les écrans de navigateur. Utilisez ces icônes pour représenter un workflow ou un écran auquel vous souhaitez que les utilisateurs accèdent.

      • now-mobile-icons-cards

        Utilisez ces icônes dans le corps des cartes.

      • now-mobile-icons-buttons

        Ces icônes sont conçues pour être utilisées pour des fonctions. Ils peuvent être utilisés sur les boutons situés sur les cartes ou pour les actions rapides.

      • now-mobile-icons-ALPnavbar

        Ces icônes apparaissent dans le coin supérieur droit de l’écran de votre mobile et sont utilisées comme navigation vers un autre écran.
      Saisir une valeur

      Entrez le code qui identifie l’icône dans la famille de polices que vous souhaitez utiliser. Par exemple, e903 est le code de l’icône de panier solide dans la famille de now-mobile-icons-buttons polices.

      Pour obtenir la liste des codes d’icônes de famille de polices, consultez [ajouter un lien vers des rubriques de référence].

      Saisissez FontColorVariable pour spécifier une variable de thème pour la couleur de votre icône.

      Cette configuration est facultative. Si vous ne spécifiez pas de couleur, la couleur par défaut de l’icône est le noir. Si vous souhaitez utiliser un code de couleur hexadécimal, consultez [lien vers « Configurer les icônes de type de police »], qui contient des informations sur la configuration de la couleur de l’icône à l’aide de codes de couleur hexadécimaux.

      Entrez la variable de thème de la couleur que vous souhaitez utiliser. Par exemple, la propriété personnalisée CSS suivante :

      --now-accordéon-couleur
      Entrer le nom

      Saisissez le nom indiqué pour l’icône dans la famille de polices. Par exemple, si vous souhaitez utiliser l’icône de panier d’achats dans la now-mobile-icons famille, saisissez Panier.

      Pour obtenir la liste des noms d’icônes de famille de polices, reportez-vous à la Référence d’icône Mobilesection .
    8. Sélectionnez Enregistrer.