Farben anpassen für das Flex-Template

Geschrieben von Sergej Stroh

Bei Anpassungen am Template steht man oft vor dem Problem der CSS-Klassen, wie lauten diese, was bewirken sie. Generell empfehlen wir für Anpassungen Entwickler-Funktion des Browsers zu nutzen.

Hier finden Sie eine kleine Übersicht aller Klassen mit Beispiel Farbe "rot (#ff0000)".

CSS-Datei: /templates/FlexChild/themes/mytheme/theme.css

/* suche button */
.input-group-addon {
    background-color: #ff0000;
}

/* seitliche box */
aside .panel.box-categories .box-body {
    background-color: #ff0000;
}

/* preise */
.price, .special-price {
    color: #ff0000;
}

/* preis-slider */
.noUi-connect {
    background: #ff0000;
}

/* trennlinie, seitliche box */
.box-categories .nav > li a.nav-sub, .box-categories .nav > li {
    border-color: #ff5d5d;
}

/* tabs, detailseite */
.nav-tabs > li > a:hover, .nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus {
    background-color: #ff0000;
    border-color: #ff0000;
}

/* in warenkorb button, buttons hersteller, detailseite */
.button_edit, .btn-default:hover:not(.dropdown-toggle), .btn-default:focus:not(.dropdown-toggle), .btn-default:active:not(.dropdown-toggle), .btn-default.active:not(.dropdown-toggle),
.btn-primary {
    background: #ff0000;
    border-color: #ff0000;
}

/* linkfarbe, megamenue */
a:hover, a:focus, .dropdown-menu > li > a:hover, .dropdown-menu > li > a:focus, .navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:hover, .navbar-default .navbar-nav > .open > a:focus, .navbar-default .navbar-nav > li > a:hover, .navbar-default .navbar-nav > li > a:focus, .navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:hover, .navbar-default .navbar-nav > .active > a:focus {
    color: #ff0000;
}

Zurück