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

Office Lite Landing Page

Nick 760

@Nick331102

Desktop design screenshot for the Officelite coming soon site coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
2junior
View challenge

Design comparison


SolutionDesign

Solution retrospective


I'm looking for any general feedback about where I can improve this project. More specifically, I can't figure out why I cant get the error or success messages to show for the email validation in the form. Thanks

Community feedback

Davide 1,725

@Da-vi-de

Posted

Hi, nice result on this challenge, although it's not mobile first approach!

  • There's a typo in your HTML, the closing main tag misses /, also i'd recommend checking the report and try to resolve the issues.

  • In JS you add the class show but in CSS that class has display: block it should be display: unset because you set display: none to email__error, email__success but this isn't enough yet. First you need to remove the class in your else statement, you can't just add the class, you also need to remove it! And second either use an id for selecting emailSuccess and emailError or different class, styled classes shouldn't be used for selectig.

Hope it helps, happy coding :-)

Marked as helpful

1

Nick 760

@Nick331102

Posted

@Da-vi-de Thank you for the feedback

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