Archived topic
Search text barely readable
1 reply · Started by Paul on August 26, 2021
With the mobile header enabled, the header search option enabled, when opening the "search box", it overlays the logo on mobile devices and the text is barely readable. Any idea on how to improve this? I liked the popup search box below the header, but I guess that requires disabling the mobile header which causes logo sizing issues...
Hi there,
you can add this CSS to make the Search field appear below the Mobile Header, and includes a 1px border if you like:
@media(max-width: 768px) {
.navigation-search.nav-search-active {
top: 100%;
border: 1px solid #000;
}
}And theres a PHP Snippet you can use here to add a placeholder:
https://docs.generatepress.com/article/generate_navigation_search_output/#add-a-placeholder
And finally the Search colors can be changed in Customizer > Colors > Primary Navigation.
