sunweb

Textarea

component textarea form-element

Definition


Text area enables the user to interact with and input text multiline.

Handlebars

Message 1
Message 2
Loading...

Javascript

Loading...

Text area with text.

Handlebars

Message 1
Message 2
Loading...

Javascript

Loading...

States


c-textarea > .is-disabled

The disabled state blocks the users interaction and modifies the appearance to let them know that edition is not possible.

Message 1
Message 2
.is-disabled > c-textarea

In some cases, the textarea is not disabled at component level but instead one ancestor is marked as disabled. This is mainly done when loading data to let the users know that the component is not useful at that moment.

Message 1
Message 2

c-textarea > .has-success

The success state let the user know that the filled information is correct.

Message 1
Message 2

c-textarea > .has-warning

The warning state let the user know that the filled information has an issue.

Message 1
Message 2

c-textarea > .has-error

The error state let the user know that the filled information has an error.

Message 1
Message 2

Modifiers


c-textarea > .c-textarea--highlighted

The highlighted modifier changes the color when an option is selected.
It is used in contexts when is useful to let the users know that an options is choosen (i.e. search filters or booking steps).

Message 1
Message 2