Hide search icon on mobile and tablet

Hi Renske,

Can you provide the CSS you've added? Perhaps we can make it work w/ some modification.

Alternatively, you can try this:

@media (max-width:1024px){
    nav#site-navigation .menu-bar-items span.menu-bar-item.search-item {
        display:none;
    }
}

But this may have some weird grey area w/ small desktops and tablets as these 2 share the same viewport breakpoint.

You can modify the max-width's 1024px value to a lower one like 992px or lower if you wish to fine tune it.

I tried this:

.mobile-bar-items .search-item {
display: none;
}

Found it in this topic: https://generatepress.com/forums/topic/hide-search-on-mobile/

I see. Let's try using selectors w/ more specificity.

For mobile-header enabled sites, you can try this:

    nav#mobile-header .menu-bar-items span.menu-bar-item.search-item {
        display:none;
    }