Theming button-link

Flow
1

I am trying to make a minor change to a button that is using the button-link theme. What I want to do is change the background color when the button is in focus, but I can not seem to get it to work. To test just changing the background color I inserted the following, which does not work, in my theme and compiled it.

.v-button-link { background: RED; } Can anyone show me how to change the background color when a link button is in focus?
Thank you

2

This should work, you call addStyleName(“link”) to the button first:

.v-button-link:focus {
  background: red;
}
3

That does not seem to be working.

4

Java

Button link = new Button("Lorem Ipsum");
link.addStyleName("link");

CSS

.v-button-link:focus {
  background: red;
}

See attachment for result.
16720.png

5

Oh, my bad. What theme are you using? The example above was for Valo.

6

I am using reindeer as my base theme. I have some customization to that, but none that deail with the button or button-link theme.

7

This works for me in reindeer:

.v-button.link:focus {
  background: red;
}
8

I had “.v-button-link” not “.v-button.link”.