text-decoration Underline on hover of a button

Flow
1

Hi, is it possible to set text-decoration Underline on hover of a button?

this is my code but it does not run.

Button onHoverButton = new Button("Test link");
onHoverButton.addThemeName("button-link");

The css is:

:host([theme~="button-link"]) :hover{
    text-decoration: Underline;
}
2

You probably have to target the [part=‘label’] within the button

3

the css is targeting the wrong part of the button and the hover state is incorrectly applied. Haven’t tried but this should work:

:host(:hover) [part="label"] {
  text-decoration: underline;
}```

or, in styles.css:
```vaadin-button:hover::part(label) {
  text-decoration: underline;
}```
4

thanks, used this solution.

:host([theme~="button-link"]:hover) [part="label"] {
    text-decoration: underline;
}