Info Ciacho a mobile

[beniamin]

Witajcie!

Dzięki uprzejmości Fundacji PCJ Otwarte Źródła korzystam z dodatku Info Ciacho (najnowsza wersja).

Jest jednak pewien problem. Dla stron które mają wersję mobile (albo responsywną) to Info Ciacho nie zamyka się mimo klikania na zamykający X oraz wyświetla się nieprawidłowo.

Jak Wy rozwiązujecie kwestię ciastek dla stron mobilnych/responsywnych?

[alex51]

Używam szablonów responsywnych i nie potwierdzam przedstawionego przez Ciebie problemu. W szablonach przygotowywanych przeze mnie klikanie w przycisk X zamyka wyświetlanie komunikatu. Być może w stosowanych przez Ciebie rozwiązaniach zapewniajacych mobilność strony jest jakiś konflikt z działaniem dodatku Info Ciacho.

[Jola]

Dzięki @alex51 :)

[Qbik]

co do wersji mobilnych to zamyka ok, tylko niestety np na iPhone 5, wyświetlany jest tylko tekst "Ta strona używa plików Cookies. Dowiedz się" i nie widać przycisku zamykania, mała modyfikacja CSS załatwia sprawę. jak chcecie to mogę wrzucić moją modyfikację

[beniamin]

Prosimy o modyfikację!

[Qbik]

ok na szybko
dla iPhona 5
wystarczy dodać do CSS


@media only screen and (min-device-width : 320px) and (max-device-width : 568px) and (orientation: landscape) {
.panel_cookie {
height: auto !important;
line-height:10px !important;
}
.panel_cookie h4 {
font-size: 12px;
line-height:16px;
}
.panel_cookie p {
font-size: 11px;
line-height:16px;
}
div.tresc {
margin: 2%;
max-width: 75%;
width: 75%;
}
.panel_cookie input,
body .panel_cookie input{
padding:0;
margin:5px;
}
}
@media only screen and (min-device-width : 320px) and (max-device-width : 568px) and (orientation: portrait){
.panel_cookie {
height: auto !important;
line-height:10px !important;
}
.panel_cookie h4 {
font-size: 12px;
line-height:16px;
}
.panel_cookie p {
font-size: 10px;
line-height:16px;
}
div.tresc {
margin: 1% 2% 2%;
max-width: 75%;
width: 75%;
}
.panel_cookie input,
body .panel_cookie input{
padding:0;
margin:5px;
}
}

i analogicznie można zrobić zmiany dla innych urządzeń, postaram się to jakoś uogólnić dla większej liczby urządzeń jeśli komuś będzie się rozjeżdżało na jakimś urządzeniu niech pisze na jakim i sprawdzimy dokładniejsze ustawienia rozdzielczości ;)

[Qbik]

ok mam prośbę do moderatora o usunięcia wcześniejszego kodu, niestety nie mogę tego zrobić :(

uproszczony kod, jakby komuś nie działało to dajcie znać


.panel_cookie {
height: auto !important;
line-height:12px !important;
}
div.tresc {
margin: 1% 2%;
max-width: 85%;
width: 100%;
}
.panel_cookie h4 {
font-size: 14px;
line-height:16px;
}
.panel_cookie p {
font-size: 14px;
line-height:24px;
}
.panel_cookie input,
body .panel_cookie input{
padding:0;
margin:1%;
}

@media only screen and (min-device-width : 320px) and (max-device-width : 568px) and (orientation: landscape) {
.panel_cookie {
height: auto !important;
line-height:10px !important;
}
.panel_cookie h4 {
font-size: 12px;
line-height:16px;
}
.panel_cookie p {
font-size: 11px;
line-height:16px;
}
.panel_cookie a{
white-space:nowrap;
}
div.tresc {
margin: 2%;
max-width: 80%;
width: 100%;
}
.panel_cookie input,
body .panel_cookie input{
padding:0;
margin:1%;
}
}
@media only screen and (min-device-width : 320px) and (max-device-width : 568px) and (orientation: portrait){
.panel_cookie {
height: auto !important;
line-height:10px !important;
}
.panel_cookie h4 {
font-size: 12px;
line-height:16px;
}
.panel_cookie p {
font-size: 10px;
line-height:16px;
}
div.tresc {
margin: 2%;
max-width: 75%;
width: 100%;
}
.panel_cookie input,
body .panel_cookie input{
padding:0;
margin:1%;
}
}