Sass and Javascript

Hey ho :) Good solution so far. Your layout is really accurate.

For your question for the Email input:

• Set a "required" attribute and the "pattern" attribute and set an RegEx for Email validation in it. For example

<input type="email" id="email"  placeholder="Email Address" pattern="/[\w\-\._]+@[\w\-\._]+\.\w{2,10}/" required>

You should set the 'label' html element to each input element.

Link for further Reading

for example

<label for="email"></label>
<input type="email" id="email">

or

<label for="email">
<input type="email" id="email">
</label>

Technical you don't need Javascript for clientsite formvalidation. You can it do only with CSS pseudo-classes.

For example

input:invalid {
  border: 2px dashed red;
}

input:invalid:required {
  background-color: red;
}

input:valid {
  border: 2px solid green;
}

MDN Webdocs CSS Tricks

Hi there 👋

Congratulate on finishing your project 🎉. The design looks beautiful 😃.

The email has the type of email because it helps the people who uses screen readers 👍. And also when you work with the backend it helps to get the email address easily. You can check if the email is all lowercase if not then show warn to put lowercase email 🍀

Happy coding ☕