Navbar

[Toby]

I have my menu bar set to move away when scrolling down - however I'm looking to fix it on one specific page and change the navbar colour on said specific page.

I have seen on a previous thread this code was suggested for a fixed navbar

.navbar{
position:initial !important;
}

I've also applied this code to try and change colour a specific nav bar

body[data-type="page"][data-id="990"] .navbar{
background-color: #ffffff !important;
}

I also tried to combine the two

body[data-type="page"][data-id="990"] .navbar{
position:initial !important;
background-color: #ffffff !important;
}

but unfortunately no joy - can you help?

Cheers
Toby

[alasdair17]

@Toby hey, try this:

body.slug-about .navbar{
background-color: #ffffff !important;
}

body.slug-about .navbar{
position: initial !important; !important;
}

but change the word, 'about' to the name of your page.

[Toby]

@alasdair17 said in Navbar:

body.slug-about .navbar{
background-color: #ffffff !important;
}
body.slug-about .navbar{
position: initial !important; !important;
}

Great!
Thanks Alistair

[alasdair17]

@Toby you're welcome :)

[arminunruh]

for the next update the navbar, site title and menu will be hidden away by using transform: translateY()
for better performance

you'll probably then want to do:

body.slug-about .navbar{
transform: translateY(0)!important;
}

[Toby]

@arminunruh

ah ok thanks Armin.