Solid Header Colour On Every Page Asides From Home - Dawn Theme

[Aaron-Mihell]

Hi,

I am using the Dawn theme. I have coded the header to be transparent at the top of the page and then become solid when scrolling.

The only issue is I want the header to be a solid colour on every other page (aside from the home page) as currently, the transparent header causes the white text to blend in with the white background.

Also for some reason on other pages, when you scroll, the header has a white background therefore you still can't see the white text anyway.

If anyone could help me code the background of the header to be #5B584A on all of the other pages, it would be much appreciated.

I have attached an image below of how I want it to look on all the other pages.

Thanks,

Aaron

[Aaron-Mihell]

Hi,

Thanks for your help, but ideally I want to adapt the code I already have installed to achieve a solid header on the other pages.

Thanks,

Aaron

[Made4uo-Ribe]

Hi @Aaron-Mihell 

Can you provide the code you add to make it transparent? please, share the store URL. Thanks!

[Aaron-Mihell]

Hi,

Here is my store URL: https://5a3aa2-da.myshopify.com/

Thanks!

[Aaron-Mihell]

This is the code i used to make it transparent.

I added it to theme.liquid.

<style>
{%if template contains 'index'%}
.header-wrapper.gradient{
background:transparent !important;
}
.scrolled-past-header .header-wrapper.gradient{
background:#5B584A!important;
}
#MainContent{
margin-top:-120px!important;
}
{%endif%}
</style>

[Made4uo-Ribe]

Try this one. 

<style>
{% if template.name == 'index' %}
.header-wrapper.gradient {
background:transparent !important;
}
.scrolled-past-header .header-wrapper.gradient {
background:#5B584A!important;
}
#MainContent {
margin-top:-120px!important;
}
{%endif%}
</style>

And Save. 

[Aaron-Mihell]

Hi,

Unfortunately, this didn't seem to make any change.

[Aaron-Mihell]

It is ok, I managed to resolve the issue. Thank you for your help though