Message Input
Styling API reference for the Message Input component.
- Usage
- Styling
CSS Selectors
The following CSS selectors can be used in stylesheets to target the various parts and states of the component.
- Root element
-
vaadin-message-input
- Disabled
-
vaadin-message-input
[disabled]
Field
- Input field wrapper
-
vaadin-message-input
> vaadin-text-area - Input field
-
vaadin-message-input
> vaadin-text-area::part(input-field) - Hovered input field
-
vaadin-message-input
> vaadin-text-area:hover - Focused input field
-
vaadin-message-input
> vaadin-text-area[focused] - Non-empty input field
-
vaadin-message-input
> vaadin-text-area[has-value]
Button
- Send button
-
vaadin-message-input
> vaadin-button - Send button text
-
vaadin-message-input
> vaadin-button::part(label) - Hovered button
-
vaadin-message-input
> vaadin-button:hover - Focused button
-
vaadin-message-input
> vaadin-button[focused] - Button for non-empty field
-
vaadin-message-input
> vaadin-text-area[has-value] ~ vaadin-button