Skip to content
  • Learning paths
  • Challenges
  • Solutions
  • Articles
  • Unlock Pro
  • Log in with GitHub
Solution
Submitted about 3 years ago

Responsive Page using semantic elements in HTML5, SCSS and ES6

accessibility, sass/scss, bem
xZAYEDx•250
@xZAYEDx
A solution to the Ping single column coming soon page challenge
View live sitePreview (opens in new tab)View codeCode (opens in new tab)

Solution retrospective


Open for criticism 😁 Let me know if i have made any errors in my JavaScript and what could have I done to avoid it🎯

Code
Select a file

Please log in to post a comment

Log in with GitHub

Community feedback

  • Nguyen Nguyen•340
    @jesuisbienbien
    Posted about 3 years ago

    Hi Zayed,

    Congrats on completing this challenge. Though, I believe there're a few things you need to fix:

    • There's something wrong with the submit button and the illustration. On desktop, the illustration is underneath the submit button, and vice versa for the mobile view. They should be a few rem apart instead of lying on top of e/o.

    • When you submit a blank input, the error message is supposed to say "Whoops! It looks like you forgot to add your email". You can find the instruction under the README.md file.

    • When I submitted an incomplete email (i.e. mail@mail ), it's supposed to be error but it turns blue instead.

    • The submit button should have a box-shadow.

    If you have any questions, let me know. I also completed this challenge recently. You can check it out under my profile.

    Happy coding :D

    Marked as helpful
  • Qstar12•70
    @Qstar12
    Posted about 3 years ago

    Great job!

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
Frontend Mentor logo

Stay up to datewith new challenges, featured solutions, selected articles, and our latest news

Frontend Mentor

  • Unlock Pro
  • Contact us
  • FAQs
  • Become a partner

Explore

  • Learning paths
  • Challenges
  • Solutions
  • Articles

Community

  • Discord
  • Guidelines

For companies

  • Hire developers
  • Train developers
© Frontend Mentor 2019 - 2025
  • Terms
  • Cookie Policy
  • Privacy Policy
  • License

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub