Public Forums 71,145 posts

[sukinoz Friend sukinozJoin date: December 2013Posts: 44Downloads:107Uploads:5 Thanks: 13 Thanked: 2 times in 2 posts]

#758514

Hello,

I have activated the template option “small logo image” to change the main logo for another one smaller for small screens.

But, How can I change when the “small logo” appears?

I would like that small logo only appears only in “extrasmall layout” (not in medium, small or large).

thanks.

PD: Similar post in http://id.joomlart.com/forums/topic/how-to-change-the-breakpoint-for-small-logo-image/

[Adam M Moderator Adam MJoin date: May 2014Posts: 5159Downloads:33Uploads:66 Thanks: 95 Thanked: 1271 times in 1235 posts]

#758798

Hi @sukinoz,

Please open file templatespurity_iiicsscustom.css (if you don’t have this file, just create a new one) then add this code :


@media (min-width: 320px) {
.logo-control .logo-img-sm {
display: none;
}
.logo-control .logo-img {
display: block;
}
}
@media (max-width: 320px) {
.logo-control .logo-img-sm {
display: block;
}
.logo-control .logo-img {
display: none;
}
}

1 user says Thank You to Adam M for this useful post

1. sukinoz

[sukinoz Friend sukinozJoin date: December 2013Posts: 44Downloads:107Uploads:5 Thanks: 13 Thanked: 2 times in 2 posts]

#758887

it is works perfectly.

Thanks!

PD: i am using @media (min-width: 420px) instead of 320px and works perfect too.

[Author]

Posts