Konfiguration
Suche anzeigen
Feldtyp: Auswahlfeld
Verfügbare Werte: • nicht anzeigen • anzeigen
Beispiel Wert:
anzeigen
Pfad zur Einstellung: Tab "Header" => Bereich "Suche"
Technischer Name:
twt-header-search-show
Basiskonfiguration
Darstellungsart
Feldtyp: Auswahlfeld
Verfügbare Werte: • Eingabefeld (Standard) • Flyout-Suche • Vollbildsuche • Global-Suche @Desktop (nur verfügbar mit "Header 1.1")
Beispiel Wert:
Eingabefeld (Standard)
Pfad zur Einstellung: Tab "Header" => Bereich "Suche" => Abschnitt "Basiskonfiguration"
Technischer Name:
twt-header-search-type
Eingabefeld (Standard) Verfügbar in "Header 1.1" und "Header 1.2".
Flyout-Suche / Vollbildsuche Verfügbar in allen Headern.
Muss für "Header 2.1" und "Full-Width Sticky-Header" ausgewählt werden.
Global-Suche Verfügbar in "Header 1.1" im Desktop-Viewport. Nutzt die Farbe: "Layout" > "Hintergrundfarbe (Aktions-Buttons)".
Breite @Desktop (≥1200px)
Feldtyp: Textfeld
Beispiel Wert:
100%
Pfad zur Einstellung: Tab "Header" => Bereich "Suche" => Abschnitt "Basiskonfiguration"
Technischer Name:
twt-header-search-width-desktop
Maximale Breite (Eingabefeld)
Feldtyp: Textfeld
Beispiel Wert:
500
Pfad zur Einstellung: Tab "Header" => Bereich "Suche" => Abschnitt "Basiskonfiguration"
Technischer Name:
twt-header-search-max-width
Innenabstand (Flyout-Suche)
Feldtyp: Nummernfeld
Beispiel Wert:
15
Pfad zur Einstellung: Tab "Header" => Bereich "Suche" => Abschnitt "Basiskonfiguration"
Technischer Name:
twt-header-search-flyout-padding
Die Option "Flyout-Suche" muss unter "Suche" > "Darstellungsart" ausgewählt sein.
Ecken
Feldtyp: Auswahlfeld
Verfügbare Werte: • nicht abgerundet (Standard) • runde Ecken • individuelle Rundung
Beispiel Wert:
nicht abgerundet (Standard)
Pfad zur Einstellung: Tab "Header" => Bereich "Suche" => Abschnitt "Basiskonfiguration"
Technischer Name:
twt-header-search-input-corner-type
abgerundete Ecken Verwendet die Konfiguration "Abgerundete Ecken". ("Layout" > "Layout" > "Abgerundete Ecken")
runde Ecken Verwendet einen vordefinierten Radius für runde Ecken.
Abgerundete Ecken (individuelle Rundung)
Feldtyp: Nummernfeld
Beispiel Wert:
10
Pfad zur Einstellung: Tab "Header" => Bereich "Suche" => Abschnitt "Basiskonfiguration"
Technischer Name:
twt-header-search-input-border-radius
Hinweis: Diese Konfiguration bezieht sich auf Ecken-Konfiguration "individuelle Rundung".
Farbkonfiguration
Textfarbe (Input)
Feldtyp: Farbauswahl
Beispiel Wert:
#333333
Pfad zur Einstellung: Tab "Header" => Bereich "Suche" => Abschnitt "Farbkonfiguration"
Technischer Name:
twt-header-search-input-color
Rahmenfarbe (Input)
Feldtyp: Farbauswahl
Beispiel Wert:
#e4e7ea
Pfad zur Einstellung: Tab "Header" => Bereich "Suche" => Abschnitt "Farbkonfiguration"
Technischer Name:
twt-header-search-input-border-color
Hintergrundfarbe (Input)
Feldtyp: Farbauswahl
Beispiel Wert:
#ffffff
Pfad zur Einstellung: Tab "Header" => Bereich "Suche" => Abschnitt "Farbkonfiguration"
Technischer Name:
twt-header-search-input-background-color
Iconfabe (Button)
Feldtyp: Farbauswahl
Beispiel Wert:
#ffffff
Pfad zur Einstellung: Tab "Header" => Bereich "Suche" => Abschnitt "Farbkonfiguration"
Technischer Name:
twt-header-search-btn-icon-color
Rahmenfarbe (Button)
Feldtyp: Farbauswahl
Beispiel Wert:
$sw-color-brand-primary
Pfad zur Einstellung: Tab "Header" => Bereich "Suche" => Abschnitt "Farbkonfiguration"
Technischer Name:
twt-header-search-btn-border-color
Hintergrundfarbe (Button)
Feldtyp: Farbauswahl
Beispiel Wert:
$sw-color-brand-primary
Pfad zur Einstellung: Tab "Header" => Bereich "Suche" => Abschnitt "Farbkonfiguration"
Technischer Name:
twt-header-search-btn-background-color
Hintergrundfarbe (Flyout-Suche)
Feldtyp: Farbauswahl
Beispiel Wert:
#eef2f5
Pfad zur Einstellung: Tab "Header" => Bereich "Suche" => Abschnitt "Farbkonfiguration"
Technischer Name:
twt-header-search-flyout-background-color
Die Option "Flyout-Suche" muss unter "Suche" > "Darstellungsart" ausgewählt sein.
Hintergrundfarbe (Flyout-Suche) @Phone (<576px)
Feldtyp: Farbauswahl
Beispiel Wert:
#eef2f5
Pfad zur Einstellung: Tab "Header" => Bereich "Suche" => Abschnitt "Farbkonfiguration"
Technischer Name:
twt-header-phone-search-flyout-background-color
Hintergrundfarbe (Vollbildsuche)
Feldtyp: Farbauswahl
Beispiel Wert:
rgba(0, 0, 0, 0.9)
Pfad zur Einstellung: Tab "Header" => Bereich "Suche" => Abschnitt "Farbkonfiguration"
Technischer Name:
twt-header-search-fullscreen-background-color
Die Option "Vollbildsuche" muss unter "Suche" > "Darstellungsart" ausgewählt sein.
Typografie
Textausrichtung
Feldtyp: Auswahlfeld
Verfügbare Werte: • links ausrichten • zentriert ausrichten • rechts ausrichten
Beispiel Wert:
links ausrichten
Pfad zur Einstellung: Tab "Header" => Bereich "Suche" => Abschnitt "Typografie"
Technischer Name:
twt-header-search-text-align
Last updated
