Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Newsletter Sign-up Form (HTML, CSS, JS)

@arogersrenee

Desktop design screenshot for the Newsletter sign-up form with success message coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
2junior
View challenge

Design comparison


SolutionDesign

Solution retrospective


Everything is working except sometimes the screen refreshes really fast. I can tell the code is working but I don't know why the error state or the success screen flashes so quickly. Does anyone have any solution or input for this?

Community feedback

Yup 710

@Yup03

Posted

Nice challenge @arogersrenee . As an answer to your question , the fast refresh is caused by the action of submitting the form . And you can prevent it like this

 form.addEventListener("submit", (e) => {
            e.preventDefault();
//Instead of e.preventDefault
            validateEmail();
        })

It looks good on mobile screens But i think it will be also nice if you fix the responsiveness on larger screens

Besides this i think it's all good

Marked as helpful

1

@arogersrenee

Posted

@Yup03 Thanks! Missed my parenthesis. I made the breakpoint a bit smaller to account for responsiveness. I wish they provided a solution for tablet rather than only mobile and desktop.

1

Please log in to post a comment

Log in with GitHub
Discord logo

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord