Logo and Menu on Naked header is different on each page on mobile.

[OzzyMac]

Hello,

I need help on this issue > Logo and Menu on Naked header is different on each page on mobile

As you can see (on desktop pics), logo is on white and naked header on every pages on my site.

But on mobile, the naked header is alright BUT my logo is BLACK.

— Please help —
Thanks,

Attachments:

You must be logged in to view attached files.

[Kyle – SUPPORT]

Hi

Your website isn’t loading for me: http://d.pr/i/1e3Pn/3G8Y5d5E please check this with your hosts

– Kyle

[OzzyMac]

Hi Kyle,

It’s alright for now.
Please check for me again.
Thanks,
OzzyMac

Attachments:

You must be logged in to view attached files.

[Kyle – SUPPORT]

Hi

Add this to your custom css:

.naked-light .sticky-wrapper:not(.is-sticky) #logo img.light-logo {
  display: inline-block !important;
}
.naked-light #header-section #logo img.standard {
  display: none!important;
}

– Kyle

[OzzyMac]

Hi Kyle,
Your code is not work, on mobile it still showing the black not a white as naked header on desktop.

Also the code makes logo on sticky header disappear while i scrolling down the sites on desktop.

Please check again.
Thanks,

Attachments:

You must be logged in to view attached files.

[Kyle – SUPPORT]

For me it’s white on mobile: http://d.pr/i/1e452/aGNcmevP

For other issue please change

.naked-light #header-section #logo img.standard {
  display: none!important;
}

to this

.naked-light #header-section .sticky-wrapper:not(.is-sticky) #logo img.standard {
  display: none !important;
}

– Kyle

[OzzyMac]

Hello again Kyle,

Thanks for above code it’s solved.

Back to the mobile naked header issue,
It’s kinda weird, for on your mobile and my mobile is different.
Please have a look,

Regards,
OzzyMac

Attachments:

You must be logged in to view attached files.

[Kyle – SUPPORT]

Ahh because it is retina screen so it’s using the retina logo, try this:

body.naked-header .sticky-wrapper:not(.is-sticky) #logo img.retina, .naked-header #header-section #logo img.retina, .naked-header.naked-light #header-section #logo.has-light-logo img.retina, .naked-header.naked-dark #header-section #logo.has-dark-logo img.retina {
  display: none!important;
}

– Kyle

[OzzyMac]

Thanks for your reply Kyle,

The code doesn’t work and logo disappear while the hamburger menu is still black color.

Please help me again Kyle ^^”
This is what I want for my site.

Regards,
OzzyMac

[OzzyMac]

Hello again Kyle,

Sorry if I may bump this topic just to inform you that I’ll delete previous code you gave and wait for your new code.

Regards,
OzzyMac

[Swift Ideas – Ed]

Hi @OzzyMac

Naked header isn’t supported as standard on mobile – only desktop. You have added custom css to remove the background colour of the header on mobile, and as such that is causing the issue of the logo/text being dark, as the theme isn’t prepared for this. Unfortunately we can’t support such customisations, but we will consider adding an option for this in future updates.

– Ed

[OzzyMac]

Thank you so much Ed,

OzzyMac

[Kyle – SUPPORT]

Thanks Ed