States
|
|
Active The input is available. |
Disable The input is unavailable. You can’t fill information. |
|
Default Unput default status, when it is not selected. It can be empty or filled. |
|
|
|
Hovered When user hover the input. |
|
|
|
Selected The user can enter content in the input, or select with tab. |
|
|
|
Error The input contains errors. |
|
|
|
Warning The content of the number input generates changes that can have an impact on the rest of the experience
Warning message is mandatory and have to explain why the input at this status.
|
|
|
Do/Don't
|
DO |
DON’T |
If input has a max or min of character - mention it. |
Info text should be replace by an error text when needed. |
|
|
|
|
DO |
DON'T |
Warning number inputs are informationals and don’t have to block the course of the user. |
Warning number inputs block the course of the user. |
|
|
|
|
|
|
|
|
|