Archived topic
Disable header/menu shadow on start page?
3 replies · Started by Rickard on August 26, 2020
Hello!
I am using a header/menu shadow (with the code below), and I want it to be active on all pages except from the start page. Is that possible?
.main-navigation, .sticky-enabled .main-navigation.is_stuck {
-webkit-box-shadow: 0px 1px 5px 0px rgba(176,176,176,1);
-moz-box-shadow: 0px 1px 5px 0px rgba(176,176,176,1);
box-shadow: 0px 1px 5px 0px rgba(176,176,176,1);
}
.main-navigation ul ul {
-webkit-box-shadow: 0px 1px 5px 0px rgba(176,176,176,1);
-moz-box-shadow: 0px 1px 5px 0px rgba(176,176,176,1);
box-shadow: 0px 1px 5px 0px rgba(176,176,176,1);
}
Best regards,
Rickard
Hi there,
you can use WP body classes and exclude the home page like so:
So your CSS would be this:
body:not(.home) .main-navigation,
body:not(.home).sticky-enabled .main-navigation.is_stuck {
-webkit-box-shadow: 0px 1px 5px 0px rgba(176, 176, 176, 1);
-moz-box-shadow: 0px 1px 5px 0px rgba(176, 176, 176, 1);
box-shadow: 0px 1px 5px 0px rgba(176, 176, 176, 1);
}
body:not(.home) .main-navigation ul ul {
-webkit-box-shadow: 0px 1px 5px 0px rgba(176, 176, 176, 1);
-moz-box-shadow: 0px 1px 5px 0px rgba(176, 176, 176, 1);
box-shadow: 0px 1px 5px 0px rgba(176, 176, 176, 1);
}
Thanks David!
I got it to work, eventually.
It turned out that I had some other lines of code which also affected the header in some ways (which was causing the shadow I wanted to get rid off) - but I added "body:not(.home)" at the start of that code and then it turned out just the way I wanted.
Glad to hear that