Design für KI-Suche In Serviceportal

  • Freigeben Version: Zurich
  • Aktualisiert 31. Juli 2025
  • 2 Minuten Lesedauer

    • Sie können das Erscheinungsbild von anpassen KI-Suche Experience in Serviceportal Durch Aktualisieren der relevanten CSS-Variablen.

    Die folgenden CSS-Variablen steuern das Erscheinungsbild von KI-Suche Funktionen in Serviceportal. Weitere Informationen zu finden KI-Suche Funktionen, siehe KI-Suche verwenden .

    Sie können diese Variablen in bearbeiten CSS-Variablen Feld eines Themendatensatzes [sp_theme]. Sie können diese Variablen auch mit einer CSS-Einbindung konfigurieren, die dem Design eines Portals zugeordnet ist. Weitere Informationen finden Sie in den folgenden Themen:

    Variable Standardwert Beschreibung
    $now-sp-font-family-sans-serif „SourceSansPro“, Helvetica, Arial, sans-serif Schriftartfamilie für alle Texte.
    $now-sp-color--Text-primary $grau-dunkel  Farbe der  nicht ausgewählten Registerkarten, Text der Genius-Ergebnisschaltfläche, Farbe des Treffertexts, Ergebnissymbole und Text des Listenelements und der Symbolfarbe der Suchleiste.
    $now-sp-Display-type--sekundär--Farbe $grau-dunkel Die Farbe des Titeltexts in Suchergebnissen.
    $now-sp-Display-type--tertiär--color $grau-dunkel Die Farbe des Textausschnitts in Suchergebnissen.
    $now-sp-color--neutral-12 $grau-dunkel  Erweiterte Symbolfarbe (Chevron) der Aspekte in der mobilen Ansicht.
    $now-sp-global-border-Radius 4px  Abgerundete Suchergebnisecken, die sich auf den Inhaltsbereich auswirken, und nicht auf Suchergebniskarten. Diese Variable wirkt sich auch auf Genius-Ergebnisse, Schaltflächen in Genius-Ergebnissen und Hintergrundmarkierungen des Suchleistensymbols aus. Diese Variable wirkt sich nicht auf Aspekte aus.
    $now-sp-color--Focus-Ring $Brand-primary Fokusfarbe für Registerkarten.
    $now-sp-tabs--ausgewählt--Farbe $Brand-primary Textfarbe der ausgewählten Registerkarte. Enthält nicht beim Zeigen mit der Maus.
    $now-sp-tabs--color--Mover $Brand-primary Textfarbe aller Registerkarten, wenn der Mauszeiger bewegt wird.
    $now-sp-tabs--border-color $sp-b-border-color Unterstrichfarbe für Registerkarten.
    $now-sp-tabs--selected--background-color $Brand-primary Unterstrichfarbe der ausgewählten Registerkarte.
    $now-sp-heading--title-primary--color $grau-dunkel Bezeichnung der Farbfilter.
    $now-sp-checkbox-label--color $grau-dunkel Farbe des Filterelements (Kontrollkästchen-Bezeichnung).
    $now-sp-button--primary--blank--color $Link-color Löschen Sie Alle Und Löschen Linkfarbe im Aspektfilter.
    $now-sp-button--primary--blank--color--aktiv $Link-color Löschen Sie Alle Und Löschen Linkfarbe im Aspektfilter beim Klicken.
    $now-sp-button--primary--blank--color--bewegen $Link-Hover-color  Löschen Sie Alle Und Löschen Linkfarbe im Aspektfilter beim Zeigen mit der Maus.
    $now-sp-pill--selected--background-color $Brand-primary Hintergrund der ausgewählten Filterpille.
    $now-sp-pill--selected--border-color $Brand-primary  Farbe des Rahmens der ausgewählten Filterpille.
    $now-sp-button--sekundär--background-color $btn-default-bg Hintergrund der Genius-Ergebnisschaltfläche.
    $now-sp-button--sekundär--Farbe $btn-default-color  Textfarbe der Genius-Ergebnisschaltfläche.
    $now-sp-button--sekundär--border-color $btn-default-border Rahmenfarbe der Genius-Ergebnisschaltfläche.
    $now-sp-button--sekundär--background-color--Move Dunkeln($btn-default-bg, 10 %) Hintergrundfarbe der Genius-Ergebnisschaltfläche beim Zeigen mit der Maus.
    $now-sp-button--sekundär--Farbe--Zeigen $btn-default-color  Textfarbe der Genius-Ergebnisschaltfläche beim Zeigen mit der Maus.
    $now-sp-button--sekundär--border-color--Schweben Dunkeln($btn-default-border, 12 %)  Rahmen der Genius-Ergebnisschaltfläche beim Zeigen mit der Maus.
    $now-sp-button--sekundär--background-color--aktiv Dunkeln($btn-default-bg, 10 %) Hintergrund der Genius-Ergebnisschaltfläche beim Klicken.
    $now-sp-button--sekundär--Farbe--aktiv $btn-default-color Textfarbe der Genius-Ergebnisschaltfläche beim Klicken.
    $now-sp-button--sekundär--border-color--aktiv Dunkeln($btn-default-border, 12 %) Rahmenfarbe der Genius-Ergebnisschaltfläche beim Klicken.
    $now-sp-hervorgehobenen-Wert--tertiär--Farbe $grau-dunkel Textfarbe des Genius-Ergebnis-Tags.
    $now-sp-button--border-Radius $now-sp-global-border-Radius Differenziert den Radius für Schaltflächen und Suchschaltflächen.
    $now-sp-Container--border-Radius $now-sp-global-border-Radius Rahmenradius für Suchergebniskarten, Genius-Ergebniskarten und den Suchergebniscontainer. Hat keinen Einfluss auf den Rahmen zwischen einzelnen Ergebnissen.
    $now-sp-button--primary-negative--background-color $btn-primary-bg  Hintergrundfarbe der Genius-Schaltfläche im modalen Element zur Bestätigung der EVAM-Aktion.
    $now-sp-button--primary-negative--border-color $btn-primary-border Rahmenfarbe der Genius-Schaltfläche im modalen Element zur Bestätigung der EVAM-Aktion.
    $now-sp-button--primary-negative--background-color--Move Dunkeln($btn-primary-bg, 10 %) Hintergrundfarbe der Genius-Schaltfläche, wenn der Mauszeiger im Dialogfeld „EVAM-Aktionsbestätigung“ zeigt.
    $Now-sp-button--primary-negative--border-color--Schweben Dunkeln($btn-primary-border, 12 %) Rahmenfarbe der Genius-Schaltfläche, wenn der Mauszeiger in der Bestätigung zeigt.
    $now-sp-button--primary-negative--background-color--aktiv Dunkeln($btn-primary-bg, 10 %)  Hintergrundfarbe der Genius-Schaltfläche beim Klicken im Bestätigungsmodal.
    $now-sp-button--primary-negative--border-color--aktiv Dunkeln($btn-primary-border, 12 %) Rahmenfarbe der Genius-Schaltfläche beim Klicken im Bestätigungsmodal.
    $now-sp-button--primary--background-color $btn-primary-bg Hintergrundfarbe des ausgewählten Filters (Pille).
    $now-sp-button--primary--border-color $btn-primary-border Rahmenfarbe des ausgewählten Filters (Pille)
    $now-sp-button--primary--color $btn-primary-color Farbe des ausgewählten Filters (Pille).
    $now-sp-button--primary--background-color--Schweben Dunkeln($btn-primary-bg, 10 %)  Hintergrundfarbe des ausgewählten Filters (Pille) beim Zeigen mit der Maus.
    $now-sp-button--primary--border-color--Schweben Dunkeln($btn-primary-border, 12 %) Ausgewählte Filterrahmenfarbe (Pille) beim Zeigen mit der Maus.
    $now-sp-button--primary--background-color--aktiv Dunkeln($btn-primary-bg, 10 %) Hintergrundfarbe des ausgewählten Filters (Pille) beim Klicken.
    $now-sp-button--primary--border-color--aktiv Dunkeln($btn-primary-border, 12 %) Rahmenfarbe des ausgewählten Filters (Pille) beim Klicken.
    $now-sp-rem-factor 5 Dieselbe Variable wie --classicsponlydonotuse--rem-multipy .
    Hinweis:
    Es wird nicht empfohlen, diese Variable zu verwenden.