Remove border around input fields

[Danish864]

Hi. I want to remove border from my input fields. I want only bottom line . i have tried some css but when i click in the input field border again comes. can you please help me with this?

Also can you please remove placeholder also when i click in it.
I want it to look like this simple.

Website Url: https://cozo-store.myshopify.com/pages/contact
Password: cozo

[Moeed · Accepted solution]

Hey @Danish864 

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 </body> tag

<style>
.field__input {
    box-shadow: unset !important;
}
</style>

RESULT:

If I managed to help you then, don't forget to Like it and Mark it as Solution!

Best Regards,
Moeed

[niraj_patel]

Hello @Danish864 
would you like to share your store URL and password if any please.
so i can check and provide you possible solution for your question.

[Danish864]

i have updated the post with website url and password. Thank you

[niraj_patel · Accepted solution]

You can add code by following these steps

1. Go to Online Store -> Theme -> Edit code.
2. Open your theme.liquid file

3. Paste the below code before </body> on theme.liquid
<style>
  .contact .field__input:focus{
      box-shadow: unset !important;
   }
</style>

Was my reply helpful? Click Like to let me know!
Was your question answered? Mark it as an Accepted Solution.

[Moeed · Accepted solution]

Hey @Danish864 

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 </body> tag

<style>
.field__input {
    box-shadow: unset !important;
}
</style>

RESULT:

If I managed to help you then, don't forget to Like it and Mark it as Solution!

Best Regards,
Moeed

[Danish864]

when you click into the input field. borders will come again.

[Moeed]

I have updated my reply, check it again.

Best Regards,

Moeed