search

vaadin / web-components

A set of high-quality standards based web components for enterprise web applications. Part of Vaadin 20+
https://vaadin.com/docs/latest/components
462 stars 83 forks source link

[material] Elements that react to hover #1593

Open xelra opened 6 years ago

xelra commented 6 years ago

I've been comparing different implementations of Material Design and I've come to the conclusion that the input fields on https://material-ui-next.com/demos/text-fields/ are close to perfect. They have a really great feel to them and I was experimenting for hours why that is.

I think that is because of how they implemented hover. The hover state will only be triggered with the mouse above the input field (where the input text is). If the mouse is above the label, the hover state is not triggered. This makes the "hover area" much smaller, but it has a much more natural feel to it. Mostly that's because the mouse will change from a pointer to a cursor and back, exactly when the hover state triggers.

It would be really great, if the Vaadin Material theme could mimick that behavior.

jouni commented 6 years ago

This is technically easy to change. A PR would be great, if you have the time.

jouni commented 6 years ago

This is no longer relevant, IMO, as the updated Material Design spec only has the filled and outlined text fields styles.

jouni commented 6 years ago

It’s currently unclear if we want to keep the previous text field style along with the new filled and outlined styles, which is why I’m keeping this issue open.