Submitted over 3 years ago

Coming Soon Page with CSS Animations and CSS-Only Validation

ApplePieGiraffe• 30,545

@ApplePieGiraffe

Preview site View code

This is a solution for...

Ping single column coming soon page

HTML
CSS
JS

1newbie

View challenge

Design comparison

SolutionDesign

Solution retrospective

Hey, everybody!

This was a nice, simple project that I enjoyed! 😃

I once again chose to use CSS-only form validation (and included some validation icons from the last challenge I completed) and added some CSS animations.

Any feedback on both the design and code is welcome and appreciated! 😊

Happy coding! 😁

Oh, and, @zuolizhu, the VS Code extension Live Sass was so much nicer and simpler to work with (compared to NPM and node-sass)! 😉

Community feedback

BerylBucket• 280

@BerylBucket

Posted over 3 years ago

Looks pretty good, almost an exact match!

Only problem I see is that the social media icons on the bottom are cut off a little bit. Perhaps you could check the svg viewboxes.

ApplePieGiraffe• 30,545

@ApplePieGiraffe

Posted over 3 years ago

@BerylBucket

Thanks for the feedback! 😀

As far as I can tell, the social media icons look fine on Chome, Firefox, and Edge, but for some reason, bits of the SVGs are cut off (like you mentioned) in Safari (I think because Safari won't render overflow: visible for some reason).

I'll do some more investigation!

Please log in to post a comment

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