Working with validation states.

By default, Slate uses HTML5 validation on all forms, but you can also use class based validation. This is useful if you are using a backend system or something like Parsley to validate the form. It's easily configured to use the same classes used by those systems, whatever they may be.

Using HTML validation

It is enabled by default. Simply code your form up in HTML and browser based validation will work out of the box:

$form-skin: (
  // Components
  components: (
		...
    validation: true
  ),
  // Skins
  skins: (
    ...
    validation: $input-skin,
  ),
);

Using class based validation

If you wish to use classes, set `'use-classes': false` to true. The classes declared on the next three lines will be used instead to drive the validation states on the inputs, labels and your own validation messages.

$input-skin: (
	...
	
  // Validation
  'validation': (

    'use-classes': true,

    'invalid-class': 'invalid',
    'valid-class': 'valid',
    'required-class': 'required',

    'valid-color': $positive,
    'invalid-color': $warning,
    'required-color': $negative,
    'valid-input-border-color': $positive,
    'invalid-input-border-color': $warning,
    'required-input-border-color': $negative,

  ),
);