Farbverwaltung Shop-Management: Unterschied zwischen den Versionen
MP (Diskussion | Beiträge) (Die Seite wurde neu angelegt: „zurück zur CSS-Doku = Hintergrundfarben = == Allgemeine Hintergrundfarben == image:Hintergrund1.PNG|mini|Einstellungen im Shop-Management für…“) |
|||
(3 dazwischenliegende Versionen von 2 Benutzern werden nicht angezeigt) | |||
Zeile 1: | Zeile 1: | ||
[[CSS-Doku|zurück zur CSS-Doku]] | [[CSS-Doku|zurück zur CSS-Doku]] | ||
+ | |||
+ | {{wichtig|Die hier vorgestellten Daten gelten für Template-Versionen >= 8.0.0.0}} | ||
+ | |||
+ | |||
+ | __TOC__ | ||
+ | |||
= Hintergrundfarben = | = Hintergrundfarben = | ||
Zeile 12: | Zeile 18: | ||
|- | |- | ||
|Hintergrundfarbe | |Hintergrundfarbe | ||
− | |#ffffff | + | |<tt>#ffffff</tt> |
| | | | ||
*vertikales Menü ab zweiter Ebene | *vertikales Menü ab zweiter Ebene | ||
Zeile 25: | Zeile 31: | ||
*Tabs in Detailseite | *Tabs in Detailseite | ||
*Subnavigation | *Subnavigation | ||
− | |bg-color_color1 | + | |<tt>bg-color_color1<br>bg-color_light</tt> |
|- | |- | ||
|2. Hintergrundfarbe | |2. Hintergrundfarbe | ||
− | |#f3f3f3 | + | |<tt>#f3f3f3</tt> |
| | | | ||
*Daten in Artikel-Listung | *Daten in Artikel-Listung | ||
Zeile 35: | Zeile 41: | ||
*Rahmenfarbe 2 | *Rahmenfarbe 2 | ||
*allgemeine Box mit Neben-Hintergrundfarbe | *allgemeine Box mit Neben-Hintergrundfarbe | ||
− | |bg-color_color2 | + | |<tt>bg-color_color2</tt> |
|- | |- | ||
|3. Hintergrundfarbe | |3. Hintergrundfarbe | ||
− | |#eeeeee | + | |<tt>#eeeeee</tt> |
| | | | ||
*vertikales Menü erste Ebene | *vertikales Menü erste Ebene | ||
Zeile 44: | Zeile 50: | ||
*Rahmenfarbe 3 | *Rahmenfarbe 3 | ||
*Navigation 6 unter Topnavigation | *Navigation 6 unter Topnavigation | ||
− | |bg-color_color3 | + | |<tt>bg-color_color3<br>bg-color_smooth</tt> |
|- | |- | ||
|4. Hintergrundfarbe | |4. Hintergrundfarbe | ||
− | |#e2e2e2 | + | |<tt>#e2e2e2</tt> |
| | | | ||
*Rahmenfarbe 4 | *Rahmenfarbe 4 | ||
− | |bg-color_color4 | + | |<tt>bg-color_color4</tt> |
|- | |- | ||
|5. Hintergrundfarbe | |5. Hintergrundfarbe | ||
− | |#dddddd | + | |<tt>#dddddd</tt> |
| | | | ||
*Rahmenfarbe des Headers | *Rahmenfarbe des Headers | ||
Zeile 66: | Zeile 72: | ||
*Suchvorschläge | *Suchvorschläge | ||
*Tabs:hover in Detailseite | *Tabs:hover in Detailseite | ||
− | |bg-color_color5 | + | |<tt>bg-color_color5<br>bg-color_strong</tt> |
|- | |- | ||
|6. Hintergrundfarbe | |6. Hintergrundfarbe | ||
− | |#dadada | + | |<tt>#dadada</tt> |
| | | | ||
*6. Rahmenfarbe | *6. Rahmenfarbe | ||
− | |bg-color_color6 | + | |<tt>bg-color_color6</tt> |
|- | |- | ||
|7. Hintergrundfarbe | |7. Hintergrundfarbe | ||
− | |#cccccc | + | |<tt>#cccccc</tt> |
| | | | ||
*7. Rahmenfarbe | *7. Rahmenfarbe | ||
*Rahmen um Eingabefelder | *Rahmen um Eingabefelder | ||
− | |bg-color_color7 | + | |<tt>bg-color_color7</tt> |
|- | |- | ||
|8. Hintergrundfarbe | |8. Hintergrundfarbe | ||
− | |#aaaaaa | + | |<tt>#aaaaaa</tt> |
| | | | ||
*Reservieren-Button:hover | *Reservieren-Button:hover | ||
Zeile 88: | Zeile 94: | ||
*8. Rahmenfarbe | *8. Rahmenfarbe | ||
*Schattenfarbe | *Schattenfarbe | ||
− | |bg-color_color8 | + | |<tt>bg-color_color8<br>bg-color_dark</tt> |
|} | |} | ||
Zeile 105: | Zeile 111: | ||
|- | |- | ||
|1 | |1 | ||
− | |#f3f3f3 | + | |<tt>#f3f3f3</tt> |
|erster Farbwert für den Hintergrundverlauf | |erster Farbwert für den Hintergrundverlauf | ||
|- | |- | ||
|2 | |2 | ||
− | |#eeeeee | + | |<tt>#eeeeee</tt> |
|zweiter Farbwert für den Hintergrundverlauf | |zweiter Farbwert für den Hintergrundverlauf | ||
|- | |- | ||
|3 | |3 | ||
− | |#dddddd | + | |<tt>#dddddd</tt> |
|nicht belegt | |nicht belegt | ||
|- | |- | ||
|4 | |4 | ||
− | |#cccccc | + | |<tt>#cccccc</tt> |
|Rahmenfarbe für das Benutzer-Menü im Header | |Rahmenfarbe für das Benutzer-Menü im Header | ||
|} | |} | ||
Zeile 130: | Zeile 136: | ||
|- | |- | ||
|1 | |1 | ||
− | |#dddddd | + | |<tt>#dddddd</tt> |
| | | | ||
*Rahmenfarbe oben | *Rahmenfarbe oben | ||
Zeile 137: | Zeile 143: | ||
|- | |- | ||
|2 | |2 | ||
− | |#dddddd | + | |<tt>#dddddd</tt> |
| | | | ||
*Hintergrundfarbe ohne Verlauf | *Hintergrundfarbe ohne Verlauf | ||
Zeile 143: | Zeile 149: | ||
|- | |- | ||
|3 | |3 | ||
− | |#cccccc | + | |<tt>#cccccc</tt> |
| | | | ||
*Rahmenfarbe unten | *Rahmenfarbe unten | ||
Zeile 151: | Zeile 157: | ||
|- | |- | ||
|4 | |4 | ||
− | |#cccccc | + | |<tt>#cccccc</tt> |
|nicht belegt | |nicht belegt | ||
|} | |} | ||
Zeile 167: | Zeile 173: | ||
|- | |- | ||
|Standard-Schriftfarbe | |Standard-Schriftfarbe | ||
− | |#333333 | + | |<tt>#333333</tt> |
| | | | ||
*Hauptschriftfarbe | *Hauptschriftfarbe | ||
− | |f-color_basic | + | |<tt>f-color_basic</tt> |
|- | |- | ||
|2. Schriftfarbe | |2. Schriftfarbe | ||
− | |#555555 | + | |<tt>#555555</tt> |
| | | | ||
*Farbe für Hyperlinks mit » | *Farbe für Hyperlinks mit » | ||
*Schriftfarbe des Reservieren-Buttons | *Schriftfarbe des Reservieren-Buttons | ||
− | |f-color_color1 | + | |<tt>f-color_color1</tt> |
|- | |- | ||
|3. Schriftfarbe | |3. Schriftfarbe | ||
− | |#777777 | + | |<tt>#777777</tt> |
| | | | ||
*allgemeine Hinweise im Footer | *allgemeine Hinweise im Footer | ||
Zeile 186: | Zeile 192: | ||
*Hover-Farbe von hervorgehobenen Links | *Hover-Farbe von hervorgehobenen Links | ||
*Label von Input-feldern | *Label von Input-feldern | ||
− | |f-color_color2 | + | |<tt>f-color_color2<br>f-color_light</tt> |
|- | |- | ||
|4. Schriftfarbe | |4. Schriftfarbe | ||
− | |#888888 | + | |<tt>#888888</tt> |
| | | | ||
*Breadcrumb | *Breadcrumb | ||
*Herstellername | *Herstellername | ||
− | |f-color_color3 | + | |<tt>f-color_color3</tt> |
|- | |- | ||
|5. Schriftfarbe | |5. Schriftfarbe | ||
− | |#aaaaaa | + | |<tt>#aaaaaa</tt> |
| | | | ||
*Schatten für Megamenü, Subnavi, Catblog | *Schatten für Megamenü, Subnavi, Catblog | ||
− | |f-color_color4 | + | |<tt>f-color_color4<br>f-color_lighter</tt> |
|- | |- | ||
|6. Schriftfarbe | |6. Schriftfarbe | ||
− | |#dddddd | + | |<tt>#dddddd</tt> |
| | | | ||
*leeres Bewertungs-Sternchen | *leeres Bewertungs-Sternchen | ||
*hr | *hr | ||
*Tabellenrahmen | *Tabellenrahmen | ||
− | |f-color_color5 | + | |<tt>f-color_color5<br>f-color_lightest<br>f-color_disabled</tt> |
|- | |- | ||
|Wichtige Hinweise | |Wichtige Hinweise | ||
− | |#cd0a0a | + | |<tt>#cd0a0a</tt> |
| | | | ||
*Hinweise auf Verkaufsaktionen | *Hinweise auf Verkaufsaktionen | ||
*Pflichtfeld | *Pflichtfeld | ||
*Fehlermeldungen | *Fehlermeldungen | ||
− | |f-color_warning | + | |<tt>f-color_warning<br>f-color_prominent</tt> |
|- | |- | ||
|weiche Info | |weiche Info | ||
− | |#008000 | + | |<tt>#008000</tt> |
| | | | ||
*Speedbar | *Speedbar | ||
Zeile 224: | Zeile 230: | ||
*Hinweise | *Hinweise | ||
*Preise | *Preise | ||
− | |f-color_notice | + | |<tt>f-color_notice</tt> |
|- | |- | ||
|Text in Eingabefeld | |Text in Eingabefeld | ||
− | |#2f2f2f | + | |<tt>#2f2f2f</tt> |
| | | | ||
*Input-Felder | *Input-Felder | ||
Zeile 233: | Zeile 239: | ||
|- | |- | ||
|Grafikfarbe | |Grafikfarbe | ||
− | |#333333 | + | |<tt>#333333</tt> |
| | | | ||
| | | | ||
|} | |} |
Aktuelle Version vom 16. September 2019, 09:25 Uhr
Die hier vorgestellten Daten gelten für Template-Versionen >= 8.0.0.0
Inhaltsverzeichnis
Hintergrundfarben
Allgemeine Hintergrundfarben
Bezeichnung | Farbwert | Auswirkung | CSS-Klasse |
---|---|---|---|
Hintergrundfarbe | #ffffff |
|
bg-color_color1 bg-color_light |
2. Hintergrundfarbe | #f3f3f3 |
|
bg-color_color2 |
3. Hintergrundfarbe | #eeeeee |
|
bg-color_color3 bg-color_smooth |
4. Hintergrundfarbe | #e2e2e2 |
|
bg-color_color4 |
5. Hintergrundfarbe | #dddddd |
|
bg-color_color5 bg-color_strong |
6. Hintergrundfarbe | #dadada |
|
bg-color_color6 |
7. Hintergrundfarbe | #cccccc |
|
bg-color_color7 |
8. Hintergrundfarbe | #aaaaaa |
|
bg-color_color8 bg-color_dark |
Die Hintergrundfarben werden auch für das Zeichnen von Rahmen verwendet. Die Standard-Rahmenfarbe ist die 5. Hintergrundfarbe (#dddddd).
Flächenfarben
- Spezial-Fläche
Spezialflächen betreffen das Benutzer-Menü im Header mit Login, Merkzettel, Sprache, usw.
Feld | Farbwert | Auswirkung |
---|---|---|
1 | #f3f3f3 | erster Farbwert für den Hintergrundverlauf |
2 | #eeeeee | zweiter Farbwert für den Hintergrundverlauf |
3 | #dddddd | nicht belegt |
4 | #cccccc | Rahmenfarbe für das Benutzer-Menü im Header |
- Fläche
Fläche 1 Die Flächen-Farben bestimmen das Aussehen der Standard-Buttons
Feld | Farbwert | Auswirkung |
---|---|---|
1 | #dddddd |
|
2 | #dddddd |
|
3 | #cccccc |
|
4 | #cccccc | nicht belegt |
Fläche 2 Nicht mehr verwendet.
Schriftfarben
Bezeichnung | Farbwert | Auswirkung | CSS-Klasse |
---|---|---|---|
Standard-Schriftfarbe | #333333 |
|
f-color_basic |
2. Schriftfarbe | #555555 |
|
f-color_color1 |
3. Schriftfarbe | #777777 |
|
f-color_color2 f-color_light |
4. Schriftfarbe | #888888 |
|
f-color_color3 |
5. Schriftfarbe | #aaaaaa |
|
f-color_color4 f-color_lighter |
6. Schriftfarbe | #dddddd |
|
f-color_color5 f-color_lightest f-color_disabled |
Wichtige Hinweise | #cd0a0a |
|
f-color_warning f-color_prominent |
weiche Info | #008000 |
|
f-color_notice |
Text in Eingabefeld | #2f2f2f |
|
|
Grafikfarbe | #333333 |