Setting background-color of the outline button when hovering

1 Answer 1775 Views
Button
Kristof
Top achievements
Rank 1
Iron
Iron
Kristof asked on 06 Jul 2021, 11:48 AM

Hi,

We have a kendoButton with look "outline":
https://www.telerik.com/kendo-angular-ui/components/buttons/button/styling/#toc-outline-button

We created a custom theme with the Progress Sass Theme Builder:
Progress Sass Theme Builder (telerik.com)

When we hover over the outline-kendoButton, the background-color is black, just like in the sample on the website
https://www.telerik.com/kendo-angular-ui/components/buttons/button/styling/#toc-outline-button

 

What is the most appropriate way to change the hover-color of this button?

Can we modify that color in our theme?

 

thx !

1 Answer, 1 is accepted

Sort by
0
Hetali
Telerik team
answered on 07 Jul 2021, 08:21 PM

Hi Kristof,

In order to change the background color of the Kendo UI Outline Button on hover, please use the following CSS:

.k-button.k-outline:hover {
  background: pink;
}

In this StackBlitz example, I have changed the hover background color of the Outline Button.

I hope this helps. Please let me know if I can further assist you.

Regards,
Hetali
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

Tags
Button
Asked by
Kristof
Top achievements
Rank 1
Iron
Iron
Answers by
Hetali
Telerik team
Share this question
or