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

Single column comming soon page (Sass, JS, mobile first)

#sass/scss#accessibility
Rosi 440

@strosi

Desktop design screenshot for the Ping single column coming soon page coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


Hey everyone :) Here is another solution from the newbie challenges. This time I paid more attention to CSS reset and used min(), max() and clamp() functions for setting font-sizes and some widths and paddings. Decided to add success confirmation on submitting correct form and found out this a little difficult for had to modify some of the written code. So the overall feeling after this challenge is that I need to write more scalable code... I would be greatful for any suggestions about that.

Community feedback

Benja.min 740

@BenjaDotMin

Posted

I really like what you did with the validation animation. Subtle but it really helps add quality. Would you mind if I suggested you add:

  • .notify__field{z-index:1;}

That will stop your error text overlapping the input during animation, and look even better :)

Good stuff :)

Marked as helpful

1

Rosi 440

@strosi

Posted

@BenjaDotMin thank you! I applied your suggestion and it really looks better :)

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