Remove gradient site header style on single page

Site URL: https://tetra-gopher-xf2z.squarespace.com

I'm trying to implement the new gradient site header style Squarespace recently made available. On most pages, I will want the header to be gradient. But on some pages, there won't a banner image and would like to remove the gradient effect on those pages.

Does anyone know how to remove this effect on specific pages with CSS?

https://tetra-gopher-xf2z.squarespace.com

Password: LiveOak

You can see an example below

LiveOak

password incorrect. Can you check it again?

Just updated and double checked the password: LiveOak

Thanks for your help @tuanphan!

On 11/15/2021 at 3:07 PM, jetsetmillennial said:

Just updated and double checked the password: LiveOak

Thanks for your help @tuanphan!

Edit a page >> Add a Code Block on bottom of page >> Paste this code

(Or if you use a Business Plan or higher >> Add code to Page Header)

<style>
  body:not(.header--menu-open) .header .header-announcement-bar-wrapper [data-header-style="gradient"][data-gradient-type="faded"].header-background-gradient {
    background: unset !important;
}
</style>

41 minutes ago, tuanphan said:

Edit a page >> Add a Code Block on bottom of page >> Paste this code

(Or if you use a Business Plan or higher >> Add code to Page Header)

<style>
  body:not(.header--menu-open) .header .header-announcement-bar-wrapper [data-header-style="gradient"][data-gradient-type="faded"].header-background-gradient {
    background: unset !important;
}
</style>

 

That worked! Could I also add code to those page headers that would make the navigation text black instead of white?

On 11/18/2021 at 11:21 AM, jetsetmillennial said:

That worked! Could I also add code to those page headers that would make the navigation text black instead of white?

Any chance you could help me with this @tuanphan? I would really appreciate it!

On 11/18/2021 at 9:21 AM, jetsetmillennial said:

That worked! Could I also add code to those page headers that would make the navigation text black instead of white?

Add to Page Header

<style>
  .header-nav-item a {
    color: black !important;
}
</style>