Die farbig markierten Bereiche können für farbliche Anpassungen verändert werden:
| Auswirkung / |
|---|
| Änderung | |
|---|---|
| Standart ohne Hintergrundbild | Hintergrundbild wurde geladen laden |
| Standart ohne Logo | Logo wurde als png Datei geladen |
Farbeinstellungen deckende Farben als Hexadezimalwert: z.B. #454545 Farbeinstellung Farbe mit tranzparenzen als rgba Wert: z.B: rgba(78, 78, 78, 0.75) (RGB Wert plus Deckkraft) | |
/* Layout B */ /* Logo + Hintergrundfarbe */ .kiosk-layout-B .main-brand .main-logo { background-image: url([{img_logo}]); background-color: |
transparent; } | Hintergrundfarbe Logo |
/* |
Hintergrund Anwendung */ . |
kiosk- |
background-color: #3b529c !important;
}
/* Text erste Ebene */
layout-B .main- |
page {
|
background- |
image: url([{img_main}]);
|
background- |
color: #FFF;
border-bottom: 1px solid #9ca0ca;
}
/* Hintergrundfarbe 1. Ebene */
.color: transparent; } | Die Hintergrundfarbe der gesammte Kiosk Darstellung wenn kein Hintergrundbild geladen ist. |
/* Menuelement */ .kiosk-layout-B .main-navi li a { background-color |
: |
transparent; } |
/* Text erste Ebene, aktiv */
.main-navi a.current {
font-size: 22px;
font-family: "Open Sans", Arial, Helvetica, sans-serif;
color: #3b529c;
}
/* Hintergrundfarbe 1. Ebene, aktiv */
| Hintergrundfarbe oberer Menupunktreihe (gefüllte Fläche mit Farbwert zb: Hexadezimalfarbwert #454545 füllen. |
.kiosk-layout-B .main-navi li.current a {
|
outline: 4px solid #4e4e4e; } |
/* Text weitere Ebenen */
| Rahmenfarbe für aktives Menu in der oberen Menüreihe |
.kiosk-layout-B .main-navi |
li a span.description {
|
text- |
align: |
left;
|
background- |
color: rgba(78, 78, 78, 0.75); color: |
#FFF; } |
/* Hintergrundfarbe weitere Ebenen */
.main-navi li li {
background-color: #9ca0ca;
}
/* Text weitere Ebenen, aktiv */
.main-navi li li a.current {
font-size: 18px;
font-family: "Open Sans", Arial, Helvetica, sans-serif;
color: #d7000d;
}
/* Hintergrundfarbe weitere Ebenen, aktiv */
.main-navi li li.current {
background-color: #FFF;
}
/* Hintergrund Anwendung */
.main-page {
background-image: url([{img_main}]);
background-color: transparent;
}
/* Hintergrund zwischenraum */
.masonry-gutter-top, .masonry-gutter-right, .masonry-gutter-bottom,
.masonry-gutter-left {
background-image: none;
Ausrichtung Text obere Menureihe Hintergrundfarbe Balken der Inhalte obere Menüreihe (Hexadezimalwert oder wie im Beispiel rgba Wert wegen möglicher transparenzen) Schriftfarbe im Balken der Inhalte | |
/* Breadcrumb */ .kiosk-layout-B .breadcrumb { border-bottom: 1px solid #c9c9c9; } | Linie unter der Breadcrumb |
.kiosk-layout-B .breadcrumb a { color: #595959; } | Schriftfarbe Text in der Breadcrumb |
.kiosk-layout-B .breadcrumb a.active { color: #E30614; } | Schriftfarbe Text in der Breadcrumb aktiver Menüpunkt |
/* Objektbox */ .kiosk-layout-B .masonry-item-inner .item-content, .kiosk-layout-B .masonry-stamp-inner .item-content { background-color: transparent; } |
/* Hintergrundfarbe + Textformatierung Headlinebalken Elemente */
Hintergrundfarbe Hauptmenupunkte Startseite |
.kiosk-layout-B .masonry-item-inner .main-headline { background-color: |
#E30614;
|
color: |
#FFF;
|
text- |
color: #fFFF;
}
/* Textformatierung main-teaser */
.item-expanded .main-teaser {
font-align: left; font-size: 16px;
|
padding- |
top: 8px;
|
height: |
40px; } |
.masonry-stamp-brand.masonry-stamp {
background-color: transparent;
}
.masonry-stamp-brand .masonry-gutter-top, .masonry-stamp-brand .masonry-gutter-bottom,
.masonry-stamp-brand .masonry-gutter-left, .masonry-stamp-brand .masonry-gutter-right
{
background-color: transparent;
}
.masonry-stamp-brand .masonry-stamp-inner {
border-color: transparent;
background-color: transparent;
}
.masonry-stamp-brand .main-brand {
background-color: transparent !important;
}
.masonry-stamp-brand .main-brand .main-logo {
background-color: transparent;
}
.main-navi a.current, .main-navi a.active {
text-transform: none !important;
}Hintergrundfarbe Balken der Inhalte Schriftfarbe im Balken der Inhalte Ausrichtung Text Schriftgröße: optional hinzufügbar (Kiosk) Ausrichtung der Schrift anpassen (Kiosk) Höhe der Box anpassen (kiosk) | |
} /* Unterkategorie */ .kiosk-layout-B .masonry-item.category-item, .kiosk-layout-B .masonry-item.category-item .masonry-item-inner { border: 6px solid #E30614; } | Stärke und Rahmenfarbe der Untermenupunkte |
.mysignage-webtool-kiosk.kiosk-layout-B .open-iframe-link { color: #2f52a0; margin: 10px 0; display: block; } | optional hinzufügbar (Abstand Seitlich für Webtool herausnehmen) |
.mysignage-webtool-kiosk.kiosk-layout-B .masonry-item-inner .main-headline { font-size: 16px; padding-top: 8px; height: 40px; } | optional hinzufügbar Schriftgröße: optional hinzufügbar (Webtool) Ausrichtung der Schrift anpassen (Webtool) Höhe der Box anpassen (Webtool) |