Archived topic
Formatting the Navigation Search Box
5 replies · Started by lunatrix on September 30, 2018
I would like to add a border around the active search box that matches my site colours. Currently, I have managed to style it with a light grey background, but when you click on it and start to type, a light blue border box appears (see attached) around it. I would like that box to be as soon as I click on the search icon, and I want to make it orange (#e37222)
Hi there,
Give this CSS a shot:
.navigation-search input {
outline: 0 !important;
}
.nav-search-active {
border: 2px solid #e37222 !important;
border-radius: 5px;
margin-top: -2px;
}Perfect ! How can I make the corners a little more 'soft' ? I tried border-radius, but since it's outline and not border, it's still squaring off the corners.
PS - I'm LOVING GeneratePress, it's so easy to configure :)
Try the above instead: https://generatepress.com/forums/topic/formatting-the-navigation-search-box/#post-690329
Thank you! Great to hear :)
That's exactly what I wanted. Thanks!
You're welcome :)
