How can I make only the homepage navigation adaptive?

Hi, 

I have a video on the home page that I would like to fill the entire screen. I tried to use the adaptive navigation header to do this but I'm getting the following error when I do this:

body.homepage article section:first-child { padding-top: 0px !important; } body.homepage .header-background-solid { background-color: transparent !important; }

It also makes the navigation adaptive on every page when I would like to keep it a solid grey. 

Could anyone help me with how I can fix this error and get only the home page to be adaptive? 

Thank you!

 

 

Can you share site url? We can check easier

Sorry I thought I had included it. It is:

www.creedce.com

Thank you

On 5/13/2024 at 3:55 PM, CreedAus said:

Sorry I thought I had included it. It is:

www.creedce.com

Thank you

You mean make this video fill up width of screen? I think you can consider using Video Section Background, so it will fill up without using code (But if you still want to use code, let me know, I will check again and give you code).

I am also wanting to know how to make only the home page adaptive (and the rest of my pages solid colour). How can I do this with CSS? @tuanphan

I have found the code from another page here from @tuanphan thank you!!  --> 

Quote

body.homepage header#header:not(.shrink) .header-background-solid {
    background-color: transparent !important;
    opacity: 0 !important;
    transition: all 0.3s !important;
}

body.homepage header#header:not(.shrink) .header-blur-background {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important
    transition: all 0.3s !important;
}
body.homepage .header-background-solid, body.homepage .header-blur-background {
    transition: all 0.3s !important;
}