Base Apparel coming soon page with HTML, SASS, JS

Community feedback

• 

  Rafael Maia Chieregatto•320

  @rafaelmaiachPosted almost 5 years ago

  Hey, congrats for your solution.

  Some feedback I can give:

  1. I would replace alert("Email Address can't be empty!"); to an error message below the input field. This prevents the page from being blocked by alert and the user has a cleaner and more good looking feedback

  2. What I like to do when I have some conditions inside a function is to put the invalid conditions first and just return if they are matched, so the good scenary can be written in an easier way to read. For example:

  function validateEmail(e) {
      if (input.value == "") {
          // do something
          return;
      }
          
      if (input.validity.typeMismatch) {
          input.style.border = "2px solid hsl(0, 93%, 68%)";
          invalidText.style.display = "block";
          iconError.style.display = "block";
      } else {
            input.style.border = "1px solid hsl(0, 36%, 70%)";
            invalidText.style.display = "none";
            iconError.style.display = "none";
            input.value = "";
      }
   }
  

  3. Maybe you could create a helper function that takes care of the feedback elements styling that are being repeated based on passed parameters.

  2

  ---

  

  umutbozdag•130

  @umutbozdagPosted almost 5 years ago

  Thanks!

  0