[Resolved] Show sticky nav logo on mobile with site-logo hidden

[Robyn]

Hi,
I am choosing to hide the site-logo on only the homepage page-id-2963, on desktop and mobile, but would like it to appear on sticky nav. This works on desktop, tablet is fine because I’m not hiding the logo, but on mobile it won’t show the logo when scrolling on the sticky nav.

I think it has something to do with .sticky-enabled .main-navigation.is_stuck but I can’t seem to make it show the logo using that bit.

Thank you for any help!
Robyn

[Ying]

Hi Robyn,

Try change your css:

@media (max-width: 768px) {
body.page-id-2963 .site-logo {
    display: none;
}
}

to this, the media query is not needed with the below CSS:

body.page-id-2963 .site-logo:not(#mobile-header.is_stuck .site-logo) {
    display: none;
}

[Robyn]

Thank you!
I left the media query, as it impacted tablet if I took it out.

As always, love the support and expertise here, thank you.

Robyn

[Ying]

You are welcome 🙂

[Author]

Posts