Design für KI-SucheIn Serviceportal
Sie können das Erscheinungsbild von anpassen KI-SucheExperience in ServiceportalDurch Aktualisieren der relevanten CSS-Variablen.
Die folgenden CSS-Variablen steuern das Erscheinungsbild von KI-SucheFunktionen in Serviceportal. Für weitere Informationen zu KI-SucheFunktionen, siehe Mithilfe der KI-Suche .
Sie können diese Variablen in bearbeiten CSS-Variablen Feld eines Design-Datensatzes [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:
- Erstellen Sie ein Portaldesign
- Erstellen Sie eine CSS-Inclusion, für die das Design überschrieben werden soll KI-SucheIn Serviceportal
| 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 nicht ausgewählter Registerkarten, Text der Genius-Ergebnisschaltfläche, Treffertextfarbe, Ergebnissymbole und Text des Dropdown-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 Textfragments in den 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 und nicht auf Suchergebniskarten auswirken. Diese Variable wirkt sich auch auf Genius-Ergebnisse, Schaltflächen in Genius-Ergebnissen und Hintergrundmarkierungen des Suchbalkensymbols aus. Diese Variable wirkt sich nicht auf Aspekte aus. |
| $now-sp-color--Focus-Ring | $Brand-primary |
Registerkartenfokus-Farbe. |
| $now-sp-tabs--ausgewählt--Farbe | $Brand-primary |
Textfarbe der ausgewählten Registerkarte. Nicht enthalten beim Zeigen mit der Maus. |
| $now-sp-tabs--color--Schweben | $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 |
Alle Löschen Und Löschen Linkfarbe im Aspektfilter. |
| $now-sp-button--primary--blank--color--aktiv | $Link-color |
Alle Löschen Und Löschen Linkfarbe im Aspektfilter beim Klicken. |
| $now-sp-button--primary--blank--color--Schweben | $Link-Hover-color |
Alle Löschen 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 ausgewählten Filterpillenrahmens. |
| $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--Schweben | Dunkeln($btn-default-bg, 10 %) |
Hintergrundfarbe der Genius-Ergebnisschaltfläche beim Zeigen mit der Maus. |
| $now-sp-button--sekundär--Farbe--Schweben | $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-Ergebnisses des Tag-Ergebnisses. |
| $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. Wirkt sich nicht auf den Rahmen zwischen einzelnen Ergebnissen aus. |
| $now-sp-button--primary-negative--background-color | $btn-primary-bg |
Hintergrundfarbe der Genius-Schaltfläche im Dialogfeld 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--Schweben | Dunkeln($btn-primary-bg, 10 %) |
Hintergrundfarbe der Genius-Schaltfläche, wenn der Mauszeiger im Dialogfeld zur Bestätigung der EVAM-Aktion angezeigt wird. |
| $now-sp-button--primary-negative--border-color--Schweben | Dunkeln($btn-primary-border, 12 %) |
Rahmenfarbe der Genius-Schaltfläche, wenn der Mauszeiger innerhalb 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--primär--Farbe | $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 %) |
Ausgewählte Filterrahmenfarbe (Pille) beim Klicken. |
| $now-sp-rem-factor | 5 |
Dieselbe Variable wie --classicsponlydonotuse--rem-multipy . Hinweis: Es wird nicht vorgeschlagen, diese Variable zu verwenden. |