Change the appearance of Woocommerce product search box

Hey,
Can you provide a link to your site?
Thanks!

Hannah

Yes i do ??
https://www.monya.shop

Ewelina

You can play around with this css:

.topclass input[type=submit] {
    background: #eee;
    border: 0;
}
.topclass input[type=search] {
    border: 0;
}

Is that kinda what you mean?

Hannah

Thank you Hannah, it’s almost. I am thinking about removing the background from search, and adding bottom border to the box. Is this possible?

Thanks
Ewelina

I managed to do it, just changed the background color in your code. But I have a problem with the shadow that is generated around the active search box. Can you help me with this?

Thank you
Ewelina

Hey,
Your link seems to lead to a maintenance page.

I am guessing at css, something like this:

.form-search .search-query:focus {
    box-shadow: none;
    border-color:#eee;
}

Ben

Hey,
Thank you Ben but it’s not working. Usually I switch to under construction mode, but now You can now go to my page if you can check the code:

https://www.monya.shop

Thanks
Ewelina

#topbar-search form input:focus {
    box-shadow: none;
}

Ok use the above and you should be set.

Ben

Great, it works ??
Thank you!

Ewelina