Polskie wsparcie PrestaShop
PrestaShop => Wygląd => Wątek zaczęty przez: azzie w Kwiecień 07, 2011, 01:37:29 pm
-
Jako że to mój pierwszy post to witam wszystkim
Być może też żegnam bo zaraz sobie coś zrobię jak mi nie pomożecie :)
Męczę się już od godziny i coś mnie trafia...:
http://suada.pl/butik/product.php?id_product=94
Chodzi o białe piksele w rogach guzika "Dodaj do koszyka". Nie mogę ich zlikwidować choćbym nie wiem co robił...
GIF jest na pewno dobrze zrobiony bo przecież ten sam ../img/button-medium_exclusive.gif jest w module koszyka jako "Realizuj zamówienie" i tak jest przezroczystość...
Te białe piksele tak naprawdę nie są białe, ale koloru #f0f0f0 - szukałem w całym CSSie i nigdzie nie mam wpisanego takiego koloru. Źródło strony też przeszukałem - nic.
Próbowałem też w każdym możliwym miejscu w drzewie CSS wstawiać background: black. Nawet wstawiając w diva gdzie znajduje się ten guzik. Div robi się czarny, a piksele... zostają białe...
Dodam jeszcze że ten kolor nie występuje w gifie: kolorem przezroczystym w palecie kolorów gifa jest zielony.
Proszę pomóżcie bo mi to nie da spać :)
-
W global.css znajdź
input.exclusive w którym masz ustawiny button:
background-image: url("http://suada.pl/butik/themes/suada/img/button-medium_exclusive.gif");
i dodaj:
background-color:#000000;
Sprawdziłem - działa ;-)
-
Tak zrobiłem, faktycznie guzik "Dodaj do koszyka" wyglada ok, tylko spojrz teraz na guzik "Realizuj zamowienie" w module Koszyk...
Ma czarne piksele w rogach... AAAAAAAaaaaaaaa :)
Może spróbuję dać zamiast gify to png? Bo to tylko zmienić w CSSie url backround prawda?
Niestety, zmiana na PNG nic nie zmieniła. Ewidentnie to nie jest problem pliku, tylko kodu.
Na Firefox i IE jest to samo. Z ciekawości sprawdzę Chrome...
-
Anuluj poprzednią poprawkę.
Poszukaj w swoim szablonie pliku product.tpl i znajdź w nim fragment:
<p{if !$allow_oosp && $product->quantity == 0} style="display:none;"{/if} id="add_to_cart" class="buttons_bottom_block"><input type="submit" name="Submit" value="{l s='Add to cart'}" class="exclusive" /></p>
zmień nazwę klasy z exclusive na np. exclusive1 i do global.css dopisz
input.exclusive1 {
background-image: url("http://suada.pl/butik/themes/suada/img/button-medium_exclusive.gif");
background-color:#000000;
}i po sprawie...
-
Wielkie dzięki!
Deklarację input.exclusive1 trzeba było jeszcze w wielu miejscach w CSS dodać, bo rozrzucona jest strasznie, w grupach z innymi, ale to już dałem sobie radę sam :)
Jeszcze raz dziękuję, strasznie mnie wkurzają takie drobiazgi których nie potrafię naprawić :)
Swoja drogą ciekawe czemu te piksele się pojawiały. Bo to białe "tło" skądś się musiało brać... Ale to już nie mój problem ;)
-
Widzę, że już problem załatwiony, ale tak na przyszłość:
Swoja drogą ciekawe czemu te piksele się pojawiały. Bo to białe "tło" skądś się musiało brać... Ale to już nie mój problem ;)
to może być jednak Twój problem :) tło o kolorze #f0f0f0 pewnie było tłem którejś warstwy zawierającej. Osobiście unikam deklarowania koloru, jeśli dany selektor go nie potrzebuje. Jeśli prześwituje jakiś kolor, to znaczy że problem tkwi gdzie indziej, w innym selektorze, i tam go należy naprawić, a nie łatać doraźnie. To że strona jest ogólnie czarna nie oznacza, że wszędzie muszę deklarować ten czarny, zatem w deklaracji CSS dla przycisków z zaokrąglonymi rogami, najlepiej pominąć kolor tła lub wpisać "transparent".
Co do wyboru formatu - zdecydowanie png24 - z powodu stopniowanej przezroczystości, przezroczystość w GIFach jest zerojedynkowa.
-
Miałem podobne odczucia z tymi białymi narożnikami. :)
Ale w moim przypadku pomogło wstawienie dodatkowego wpisu background-color: transparent; w sekcji classic buttons pliku global.css
Pozdrawiam