How To Keep only the below border from the Newsletter Section Input Form's? DAWN THEME

Store Design
1

On the home page, I added a new section(newsletter section) through the customization menu and I would like to completely remove all the borders on the top, left, and right, and keep only the below border by default and even when the input field is active or clicked by the user.

Please refer to the picture below for clarification,

InkedCapture2.jpg
InkedCapture2.jpg1823×530 60.3 KB

Thank you,

URL: Abbasi (theabbasiandsons.myshopify.com)

Password: testingpage

Any help would be much appreciated

2

Hi, @justauser

You can try this code

  1. Go to Online Store-> Theme->Edit code
  2. Asset-> base.css ->paste the below code at the bottom of the file.
.field:after {
    box-shadow: unset;
    border-bottom: 1px solid black;
}
3

@Ahsan_ANC Hi, your code is working but when I hover over or click the input field all the borders are reappearing, is there anything that can be done here? :slightly_smiling_face:

Thanks