Sign-up Page With CSS Animations And CSS-Only Form Validation

Community feedback

• 

  Dusvy_M•390

  @dovelmPosted almost 3 years ago

  I like this effects!!!

  2

  ---

  

  T

  ApplePieGiraffe•30,545

  @ApplePieGiraffePosted almost 3 years ago

  @dusvimarin

  Haha, thank you! 😊

  0
• 

  AliAbuhumra•230

  @aliabuhumraPosted about 3 years ago

  What is the benefit of your situation tag (label) , Then you hid tag lavel display :none;, Is it because of Accessibility or because of another?

  1

  ---

  

  T

  ApplePieGiraffe•30,545

  @ApplePieGiraffePosted about 3 years ago

  @AliABUHAMRA

  Yup! I didn't want the label elements themselves to be seen, but they should still be present for semantics and accessibility. That way, I could still make my solution according to the design but have labels available for screen readers to use. 👍

  1

  

  AliAbuhumra•230

  @aliabuhumraPosted about 3 years ago

  @ApplePieGiraffe Thanks that was helpful

  1
• 

  Rahul Krishna•35

  @krishrahul98Posted about 4 years ago

  Great Work.

  1

  ---

  

  T

  ApplePieGiraffe•30,545

  @ApplePieGiraffePosted about 4 years ago

  @krishrahul98

  Thank you!

  1
• 

  Connor Z•5,115

  @zuolizhuPosted about 4 years ago

  I understood these days people build out projects using JS frameworks such as React, and they relied on those JavaScript-code-generated-Virtual DOMs and don't really care about the "ancient" HTML anymore (I saw a situation where using JavaScript to check if the input field is empty 🤣). "Anti-JavaScript" and diving deeply with the pure HTML and CSS is absolutely worth it!

  I love how tiny your project is (comparing 2x size if using react) and the animations just make the user experience feels nice and smooth🤩.

  You don't have to use node-sass in your package, you can just use a vscode extension called Live Sass.

  You can also break your main.scss into small pieces and import to main.scss which can make it easier to organize. And some simple scss architecture might also help for your big project 😎.

  Looking forward your next project!

  Happy coding! 😁

  1

  ---

  

  T

  ApplePieGiraffe•30,545

  @ApplePieGiraffePosted about 4 years ago

  @zuolizhu

  Thanks so much for the feedback! 😊

  To be honest, I'm trying to use HTML and CSS as much as I can in my projects so that I can put off diving into JS frameworks just a little bit longer—but I'll get to that fun, eventually! 😁

  I decided to use a single SCSS file for this project because I initially thought I wouldn't need to write very much code (but that's I often feel when I first start a project—only to find out the truth a while later). 😅

  And thanks for the link to Live Sass—that'll be very convenient!

  Happy coding! 🙌

  1