Hi,
For the search bar, you can change it’s Open behaviour to Minimal https://prnt.sc/sxf5wh
For the dropdown, you need to change the Row Background https://prnt.sc/sxf6um
Full docs about the header builder can be found here https://docs.themeisle.com/category/1251-neve-header-builder
Regards,
Rodica
Hey Rodica,
Awesome thanks for the help with the search form.
I’m struggling still with the background for the drop-down menu and removing the border around the search box?
mfk
Could you advise please?
Thanks again!
Hi @maryfk96,
Let’s try to adjust those with custom code.
Please add the following code into the Additional CSS editor within the Customizer.
/* Drop-down background color */
@media (min-width: 960px) {
.row .primary-menu-ul .sub-menu li {
background-color: #205b31;
}
}
/* Drop-down items color */
.builder-item--primary-menu .nav-menu-primary > .primary-menu-ul li:not(.woocommerce-mini-cart-item) > a {
color: #fff;
}
/* Search border */
.nv-nav-search .search-form input[type=search] {
border: none;
}
A color picker that generates the hex value is available on this page.
I hope this will help.
Stefan
Hey Stefan,
Great! Thanks for the code. Have set the background colour of the drop-down box to #000000 but it doesn’t seem to be registering opacity. Do you know how to set it to a transparent background?
With the Search box, I’m still getting a margin around the search box, even after switching the ‘border’ text in your code to ‘margin’… any ideas?
http://mfkevents.co.uk/
Thanks again!
Hi @maryfk96,
For the search field, you can use the following code
.nv-nav-search .search-form input[type=search] {
margin: unset;
border: none;
}
The opacity works a bit different, instead of the hex code #000000 you can use
rgba(0,0,0,0.5).
For example
color: rgba(0,0,0,0.5);
The last parameter is the opacity and can be between 0 to 1 with a step of 0.1.
I hope this will help.
Stefan
