Spark Theme: White on White Header Outside of Homepage Issue

[KwameAdusei]

Running the Spark theme on Shopify:

I setup the header to be completely transparent on the home page but that effect doesn't carry across any other pages.

Tried inserting: 

@media only screen and (min-width: 750px) {
.template-index .site-header {
position: absolute;
    width: 100%;
background-color: transparent;
}
.template-index .site-header__mobile-nav {
background-color: transparent;
}
}

into the end of the Theme.css and Theme.liquid codes but nothing's being affected across any page.

Anyone have a quick solution? For having created quite a lot of websites, this seems like a very simple issue to remedy yet I've had no luck so far.

https://kwameadusei.myshopify.com/

Thank you

[Blend-Cole]

Hi there.

.template-index in your css will target the homepage only.  Try replacing it with body.

I do hope this helps you with this particular issue.

If you found this answer helped with your question,  kindly mark it as a solution.

Kind regards.
Cole.

Blend Commerce.

[diego_ezfy]

@KwameAdusei, do this to fix it in 20 seconds:

1. In your Shopify Admin go to: online store > themes > actions > edit code
2. Find Asset > theme.scss.liquid or theme.css and paste this at the bottom of the file:

header[data-section-id="header"].is-sticky *{
    color: #000 !important;
}

header[data-section-id="header"].is-sticky .header__cart-count{
    border: 1px solid #000 !important;
}

You can change the #000 to any color you wish.

Kind regards,
Diego

[KwameAdusei]

Thank you

[KwameAdusei]

Appreciate the help

[Katman]

I tried using both suggested code snippets from KwameAdusei and Diego_ezfy and neither work for me. I too am looking for a way to keep the Spark theme's header background transparent whilst scrolling and if possible to carry over to other pages on the site.

DM'd you too  @KwameAdusei 👍