LIVE DEMO: https://sphariab.github.io/form-validation/
for installation:
- npm install
- gulp build
- gulp (to run on http://localhost:3000)
This is responsive form
Used:
- preprocessor SCSS.
- preprocessor Pug.
- Task manager Gulp for compilation styles and templates, minification styles and scripts.
- Responsiveness breakpoints: 480/768/1024px, Mobile first
- Validate.js, underscore libraries for form fields validation, error messages show. On click field it becomes focus. On click "Tab" or "Enter" starts it's validation. If validation failed - show error message. On click "Submit" button - shows first not valid field. On any click - validation resets, messages hide.
- CVV tooltip on click "?" icon, on click out of icon it is hidden.
- On submit if form is valid page reloads (standart behavior).
- BEM naming.