Input
Nice inputs with many variants.
Default
The input is a functional part in an application, For implementing it we have the vs-input
component.
Label
Add a label to the input with the property label
.
Label Placeholder
The placeholder can become a label when the input is focused. Use the property label-placeholder
for making this.
WARNING
This property overrides the label
and the placeholder
Icons
The input can have icons. Use the property icon
. You can also also manipulate the icon's position with the property icon-after
.
TIP
Vuesax uses the Google Material Icons font library. For a list of all available icons, visit the official Material Icons page.
FontAwesome and other fonts library are supported. Simply use the icon-pack
and val-icon-pack
parameters with fa
or fas
. You still need to include the Font Awesome icons in your project.
Colors
You can change the color of the borders when the focus the input with the property color
. You are able to use the Main Colors or RGB and HEX colors.
WARNING
There is only support for HEX and RGB colors
Validations
You can add a state for example of in affirmative response to a validation with success
and if it is necessary to add a description or help to the user you can do it with the property description
TIP
Each of the states you can change the text, for example in the case of danger-text
for the state of danger.