In this activity, you'll be creating a sign up form. You should aim to make your version look as identical as possible to the provided version. Matching the given mockups with absolute 100% accuracy is not expected, however, you should prioritize the objectives listed below.
- Responsive design:
- The form must be centered horizontally on any screen size (i.e. there is equal distance to the left and right of the form).
- The input field lengths should change size depending on the size of the screen, so that the whole field is visible.
- There should be multiple input fields of different types.
- The password input field must validate its user inputs.
- This means that this input field should use attributes for validation to display a built-in tooltip message when a user tries to click the submit button with an invalid input.
- Example: a password less than 12 characters long.
- This means that this input field should use attributes for validation to display a built-in tooltip message when a user tries to click the submit button with an invalid input.
- Some input fields should use the
required
attribute, meaning that the user cannot submit the form without entering an input into the required field.
The following fonts are available via Google Fonts:
- Inter - used for all text content