Input
Input fields allow the user to interact with by entering data. (e.g. email address, account name, search terms, etc.). Currently, we are not using components for the font inputs. They are implemented by Symfony forms.
Default input
unrefactoredThis component is only documented here but is not in a state to be used. Please feel free to refactor it first and document refactored version here before using it.
Fluid:
Responsive:
Material design input
unrefactoredThis component is only documented here but is not in a state to be used. Please feel free to refactor it first and document refactored version here before using it.
Fluid:
Responsive:
Password input
unrefactoredThis component is only documented here but is not in a state to be used. Please feel free to refactor it first and document refactored version here before using it.
Fluid:
Responsive:
Usage
Name / Type | Usage | Selector |
One line | Input short texts (e.g. address, name, company name) | input type="text" |
Multiple lines | Input long texts (e.g. NPS on SRP) | textarea |
Search field | Search Input in navigation | input type="text" |
Integrated label | Customer account password | input type="text" class="float-label__target-input" |
Guidelines
- ● Input fields can have different status: inactive, active (focus), error, success.
- ● Some, but not all input fields can have a validation.
- ● Password inputs have an option to show or hide the input.