Sticky header text color

[saylife]

Hi!
How do I change the color of text Sticky header?
I use black text, in a header.
My “Sticky header” is black, and I would like the text to be white for him.

[saylife]

This reply has been marked as private.

[Rui Guerreiro – SUPPORT]

Hi,

Add the code below to your custom css option.

.page-header-naked-dark span.menu-item-text {
  color: #FFF!important;
}

-Rui

[saylife]

Thanks,Rui.

 What about the logo change to white in a “Sticky header”?

[Rui Guerreiro – SUPPORT]

That’s an image, you need to change the Dark Logo image in the Theme options-> Logo
https://www.dropbox.com/s/07nujk3n0z4acu4/Screenshot%202015-07-17%2014.47.32.png?dl=0

-Rui

[saylife]

This reply has been marked as private.

[saylife]

This code works.
It is possible to reduce the code?

#header-section .is-sticky #header.sticky-header span.menu-item-text {
  color: #FFF;
}
#header-section .is-sticky #header .header-right a {
  color: #FFF;
}
#header-section .is-sticky #header .header-left a {
  color: #FFF;
}

#header-section .is-sticky #header a.menu-bars-link span {
  background: #FFF;
}
#header-section .is-sticky #header a.menu-bars-link span:before {
  background: #FFF;
}
#header-section .is-sticky #header a.menu-bars-link span:after {
  background: #FFF;
}
#header-section .is-sticky #header .aux-item:first-child:after{
  color: #FFF;
}

[Rui Guerreiro – SUPPORT]

Try this one

#header-section .is-sticky .menu-item-text {
  color: #FFF;
}
#header-section .is-sticky #header a {
  color: #FFF;
}

#header-section .is-sticky  a.menu-bars-link span {
  background: #FFF;
}
#header-section .is-sticky a.menu-bars-link span:before {
  background: #FFF;
}
#header-section .is-sticky a.menu-bars-link span:after {
  background: #FFF;
}
#header-section .is-sticky #header .aux-item:first-child:after{
  color: #FFF;
}

-Rui

[pp2324]

How to change bg of sticky header to transparant?

[Mohammad – SUPPORT]

Hi,

@pp2324 – Please provide website url always to get exact css code.
Thanks
Mohammad

[pp2324]

This reply has been marked as private.

[Kyle – SUPPORT]

Hi

You want it fully transparent? May be hard to see the text

– Kyle

[Mohammad – SUPPORT]

Hi,
I can see product with sticky header transparent. Just check the attachment.
Thanks
Mohammad

Attachments:

You must be logged in to view attached files.

[pp2324]

Hi there,

Thanks for your reply. Please see the attached image that it’s still White before you scroll down.

Attachments:

You must be logged in to view attached files.

[Kyle – SUPPORT]

Add this to your custom css:

.single-product .header-wrap {
    position: absolute;
    width: 100%;
    top: 0;
}

However not sure why you would want to do that as it looks messy. I’d say just make your header background the same color as the product page background

– Kyle