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 scss/js

Rino 340

@Rhinozer0s

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


Hey coders,

this is my first project in JavaScript! I would really appreciate it, if you just check my script and give me some suggestions for improvement. This would help me a lot.

Thanks 🤝😎

Community feedback

@ShamSuther

Posted

Congratulations on completing the challenge! ✨🎉 You did a great job with the design and the JavaScript code looks pretty accurate. I have a suggestion that might make the design even better. Instead of adding all the invalid input properties directly as inline styles in JS, you could consider adding them to a class in CSS. This would make it easier to manage and update the design in the future.

input.invalid{ 
border : 1px solid rgb(236, 62, 62);
color : rgb(236, 62, 62);
background-color:  rgb(252, 208, 208);
}";

With this approach, you can easily add or remove those properties to an element just like that.

input.classList.add("invalid");
input.classList.remove("invalid");

I hope you find this somewhat helpful, keep up the fantastic work, and enjoy coding! 😊💻✨

Marked as helpful

2

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