/Sign-Up-Form

This is a simple sign-up form implemented using HTML, CSS, and JavaScript. The form allows users to enter their personal information and create an account. It includes validation for each input field to ensure that the required information is provided correctly.

Primary LanguageCSS

Sign Up Form

This is a simple sign-up form implemented using HTML, CSS, and JavaScript. The form allows users to enter their personal information and create an account. It includes validation for each input field to ensure that the required information is provided correctly.

Usage

To use this sign-up form, follow these steps:

  1. Open the Sign-Up-Form in a web browser by clicking here or copy this link: https://shahir-47.github.io/Sign-Up-Form/ and paste it in the address bar of your web browser.

Dependencies

This sign-up form relies on the following files:

  • normalize.css: This CSS file provides a consistent styling across different browsers by normalizing their default styles.
  • style.css: This CSS file contains the custom styles for the sign-up form.
  • icon.png: This image file is used as the favicon for the web page.
  • cover.png: This image file is used as the background image for the form.

Make sure to keep all these files in the same directory as the HTML file for proper functionality.

Validation

The JavaScript code (script.js) is responsible for validating the input fields. It performs the following checks:

  • Each field is required and must be filled in. If any field is left empty, an error message will be displayed.
  • The email field must contain a valid email address. If an invalid email is entered, an error message will be displayed.
  • The phone number field must contain a valid phone number with at least 11 digits. If an invalid phone number is entered, an error message will be displayed.
  • The password field must be at least 8 characters long. If a password shorter than 8 characters is entered, an error message will be displayed.
  • The confirm password field must match the password field. If the passwords do not match, an error message will be displayed.

Styling

The sign-up form is styled using CSS. It includes various CSS classes and styles to create a visually appealing and user-friendly interface. The form layout is responsive and adjusts to different screen sizes.

Please refer to the CSS code in the provided style.css file for a detailed understanding of the styles applied.

Author

This sign-up form was created by Shahir Ahmed in 2023.

For any questions or inquiries, please contact the author at ahmeds@dickinson.edu.