Newsletter sign-up form with success message using BEM CSS

This is pretty good but there are some accessibility issues

1. the error should not be in a label. It should be in a paragraph and have an aria-live attribute on it and a unique ID
2. the error should not be display none by default. Aria-live elements should be present in the dom at all times so the browser knows to watch them for changes. Instead the error element should be present just with no content inside
3. To programmatically link the error and input, use aria-desciribedby on the input pointing to the error element's ID
4. clamped font sizes must not use viewport units for the middle font size. Instead you must use calc to transform those viewport units into rem. This is extremely important as at the moment this is ignoring users font size settings

Other than that all this looks good previewing on mobile

Great job!

I would suggest querying all the elements first and then passing them as function parameters. Then you can use the same elements and it is not necessary to query them again. This is generally considered a good practice.

It is also better to avoid complicated regular expressions, as they almost always do not work as intended. I would suggest using one of the popular npm libraries in this case.

Keep coding and have a nice day!

hello, the project is very well made. I like the fact that you are aware of accessibility features and used BEM in your CSS. I want to implement it in my future projects aswell. CSS is well written and name convention also in HTML looks nice. learned a lot from your code! thanks. keep up! <3

one little detail tho: there is no error message popping up when user enters invalid email :P