1 Answer, 1 is accepted
Hi Tommy,
You can style the close button of the Dialog component through a similar CSS selector:
.k-window-actions.k-dialog-actions {
background-color: black;
color: grey;
}I have modified this sample with the style above so you can test it at your end:
https://stackblitz.com/edit/react-n3lsjc?file=index.html
Regards,
Vessy
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/.
Rank 1
There were some minor errors in the CSS selector. See below.
.k-button.k-button-icon.k-window-action.k-dialog-action. k-dialog-close {
background-color: black; color: grey; }
Hi, Tommy, the provided link to the StackBlitz sample in my previous reply appeared broken, apologies for that. I have updated it, you can see how to style the whole close button with the provided style.
To style the close button element directly, you will need to apply the background-color with "!important" statement in order to overwrite its default transparent background:
.k-window-actions.k-dialog-actions .k-button.k-dialog-close {
background-color: black !important;
color: grey;
}
Test it here: