How can I modify the input color in the Dawn theme newsletter component?

Hi. I’d like to change color of text and input on newsletter component to a different than default in the Dawn theme (white).

I managed to change text color in css sheet but can’t change the border color of the input.

Do you know how can I change it?

1 Like

Hi there,

Can you share your website link? The fix for this would be a similar code as the below:

input {border:none !important}

Please note that the above code would affect all input elements.

Cheers!

Is there a way to change only this one input? :slightly_smiling_face:

https://larosa-d891.myshopify.com/

hey, Missrose, for this input specifically, it seems it would work using this rule:

.newsletter-form .field::after {
    border-color: blue;
}

and then you replace blue with whatever color you want. Writting transparent is also a possible choice

Hi @missrose ,

To change the border color for this newsletter section only, please follow the instructions below.

  1. From your Admin Page, click Online Store > Themes >Actions > Edit code
  2. In the Asset folder, open the base.css
  3. Paste the code below at the very bottom of the file.

NOTE: Change the black to the color you want

input#NewsletterForm--template--16530492817638__16644701735182c9a4 {
    outline: 2px solid black;
}

Below is the code that should change the border color of that specific input

.newsletter-form .newsletter-form__field-wrapper .field:after {
  border-color: red !important;
}