Zmiana koloru ikony

[Mreco]

Witam. Jak zmienić kolor dodanej ikony do modułu bezpieczeństwo klienta (blockreassurance)? Moduł pobiera sobie kolor ikony z szablonu jednak nie mam pojęcia co zmienić i gdzie szukać. Chodzi mi o tą 4 ikonę informującą o ratach. Kolor nieznacznie różni się od pozostałych ikon które są w standardowym szablonie.

[() Maciej ()]

A wystarczyło odpalić tryb developerski w przeglądarce i wyciągnąć sobie ścieżkę do tej ikonki. Następnie dopisać polecenie w CSS...

#block-reassurance > ul:nth-child(1) > li:nth-child(4) > div:nth-child(1) > img:nth-child(1) 
{
 	opacity: .8!important; 
}

A tu masz źródełko swoich problemów :

... themes/xxxxxx/assets/css/theme.css
#block-reassurance img {
    opacity: .7; /* ------------ ta część odpowiada za przeźroczystość i to ona steruje kolorem tej ikonki */
    width: 1.563rem;
    margin-right: .625rem;

[Kliknij i przeciągnij, by przenieść.]

 

[hakeryk2]

12 hours ago, () Maciej () said:

#block-reassurance > ul:nth-child(1) > li:nth-child(4) > div:nth-child(1) > img:nth-child(1) 

Chryste Panie Nie używaj nigdy tak długich selektorów bo na nasze nieszczęście przeglądarki czytają kod CSS od tyłu co mniej więcej oznacza, że przeglądarka po odpaleniu strony i budowie drzewa CSSOM robi coś takiego tą komendą:

Sprawdź wszytkie zdjęcia na stronie, znajdź pierwsze z nich, następnie sprawdź wszystkie divy (!) i wybierz pierwszy ale tylko ten który po sprawdzeniu wszystkich gałęzi li na stronie który jest 4 dzieckiem itd itp.

Takie wskazanie elementu jest cholernie obciążające przeglądarkę i wykonuje się znacznie dłużej niż bezpośrednie odwołanie się do klasy lub id. Lepiej edytować .tpl, dodać klasę i dodać ją bezpośrednio do css.

Też kiedyś tak pisałem

 

 

[() Maciej ()]

To jest selektor bezpośredni to konkretnego obiektu na stronie. Wiem, że nie jest to najbardziej elegancka forma, ale jak potrzebujesz zmienić jeden konkretny element bez większych zmian w kodzie to jest to najszybsza metoda.

 

W tym przypadku klasę ma dziedziczoną, więc zmiana nadrzędnej spowoduje zmianę we wszystkich pozostałych obrazkach powyżej.

Ogólnie ustawienie przeźroczystości na 0 (albo całkowite jej wywalenie) daje efekt jaki planuje autor tematu, czyli wszystkie ikonki są w tym samym odcieniu (w tym przypadku czarnym), który można sobie zmienić też na inny kolor (np szary i efekt będzie bardzo zbliżony do obecnego).

[() Maciej ()]

19 minut temu, hakeryk2 napisał:

Lepiej edytować .tpl, dodać klasę i dodać ją bezpośrednio do css.

Fakt, te rozwiązanie jest najlepsze, ale nie zawsze masz czas, czy umiejętności do odszukania odpowiedniego TPLa