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 with success message with Typescript

@FevenSeyfu

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


What challenges did you encounter, and how did you overcome them?

The challenge I have faced was vite not loading svg images after some trials by setting up vite.config to include svg in assets and moving images to public which did not work fully I have used typescript to set the src of images.

Community feedback

@Kansoldev

Posted

Hey there Feven, I wanted to help point out some issues for you. I noticed that when you submit the form the first time after validating the email address, it goes to the next page quite alright, but when you click dismiss and return back to the homepage, and click that submit button again without entering anything into the form, it will work which is wrong

I am also currently doing this challenge and I figured that this happens because you are not reseting the form when it gets submitted successfully, so you may want to do that.

Also, you might want to check the second UI that shows after you submit the form, as it's not properly aligned on mobile. Hope this helps, wish you the best.

Marked as helpful

0

@FevenSeyfu

Posted

@Kansoldev

Thank you for your feedback I have fixed the issue with form reset after dismissing the success message I have now disabled form from submitting a valid email .

0

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