Input
Nice inputs with many variants.
Default
The input is a functional part in an application so to implement it we have the vs-input
component.
Label
To add a label to the input with the property vs-label
.
Label Placeholder
The placeholder can become a label by being active to write with the property vs-label-placeholder
WARNING
This property overrides the vs-label
and thevs-placeholder
Icons
The input can have icons the property to add them is vs-icon
and we can also manipulate the position at the end with the propertyvs-icon-after
.
TIP
Vuesax use the Google Material Icons font library. For a list of all available icons, visit the official Material Icons page.
Colors
You can change the color of the edges when the user is active in the input with the property vs-color
, You can use the main colors: primary
,success
, danger
,warning
, dark
or HEX and RGB colors.
WARNING
There is only support for HEX and RGB colors
Validations
You can validate the input in a simple way and without so many complications using the property vs-valid.sync
that will return us if the input is valid or not, to be able to know what the validation type is the propertyvs-type
.
If you need a custom validation, the property vs-validation-function
.
Valid: { "email": false, "number": false, "url": false, "password": false, "custom": false }