Newsletter sign up form using JS HTML and CSS

Hi guys, the project is not yet done on my side, Like I said on my previous project. I prefer to have an ugly style but having all feature working V1 than the opposite. Right now I'm struggling to understand what we need to do with the submited form. Do we need to custom a popup with the confirmation message or redirect to another page with confirmation message?

Nevertheless, I decided to submit a partially done solution because I have yet another question and I plan to search through the already submitted one the different ways of sending the form.

My issue right now is: I'm planing to change the input box css class from

• default: when we are not inside the input text area(text kinda grey and alpha transparency)
• active: when we are typing in the input text area(the blue color that we need to use for the design)
• error: addventListener on the submit button, if {email address not valid} => style in red the text area else {open confirmation window} I'm done with default and active using eventListener no problem with that.

But I don't know what to look for or where to look at when I click submit with empty message or missing @. There is no console.log(e) or console.log(submit) I only have a popup at the input textarea saying that I miss an @ in my email address.

Thank you for the help, I will update my project when I will move forward the the JS resolution and finally with the css syle matching the objective.

Sorry for the long input, Thomas.