How can I eliminate the border from a search icon?

Store Design
,
1

remove the border in search icon

niceeee_0-1681714710000.png
niceeee_0-1681714710000.png641×515 98.4 KB

2

Hey @niceeee

Follow these steps:

  1. Go to Online Store
  2. Edit Code
  3. Find theme.liquid file
  4. Add the following code in the bottom of the file above
3

Add this code to your base.css

.search__input field__input:focus { box-shadow: none !important; }
4

Hi @niceeee

This is Victor from PageFly - Shopify Page Builder App, I’d like to suggest this idea:

Online Store ->Theme ->Edit code

Assets ->Base.css or theme.css

.search__input field__input:focus { 
    box-shadow: none !important; 
}

Hope you find my answer helpful!

Best regards,

Victor | PageFly

5

still there

niceeee_0-1681716812230.png
niceeee_0-1681716812230.png521×178 3.62 KB

6

Hi @niceeee

I hope you are doing good and welcome to the Shopify Community!
I am San from MS Web Designer.

Please add this css in your bottom of the base.css file:

.search__input.field__input {box-shadow: none !important;}

Regards,

San

7

My bad, please use this code

.search__input.field__input:focus { box-shadow: none !important; }