Trying to replace default Kendo loading Indicator post SASS style change, but can't

1 Answer 65 Views
Styling
Mike
Top achievements
Rank 1
Mike asked on 15 Sep 2023, 02:11 PM

Hi there,

I'm in the middle of migrating my site to the new SASS css for the new Progress release (Telerik.UI.for.AspNew.Mvc5.2023.2.829), and I'm trying to override the default animated spinning black circle icon with one of the old loading image gifs from one of your classic css styles which matches the site better.

For example, if you override the css with:

.k-loading-image {
    background-position: center;
    background-image: url(images/kendo/loading-image.gif) !important;
    background-repeat: no-repeat;
}

You end up with the new loading image displaying on-top-of / alongside the SASS default loading animation (see attached image), instead of replacing it.

This seems to be the case with old Dojo examples provided by yourselves in the Forum:

https://www.telerik.com/forums/progress-loading---k-loading-image-doesn-t-work-correctly

Can you please provide a way of overriding the loading indicator based on the new SASS style sheets?

Many thanks,

Mike

1 Answer, 1 is accepted

Sort by
1
Accepted
Martin
Telerik team
answered on 20 Sep 2023, 09:13 AM

Hello, Mike,

Here is a small example how you can override the loading icon. 

Let me know how that works for you.

Regards,
Martin
Progress Telerik

Stay tuned by visiting our public roadmap and feedback portal pages! Or perhaps, if you are new to our Kendo family, check out our getting started resources
Mike
Top achievements
Rank 1
commented on 22 Sep 2023, 01:54 PM

Works a treat Martin - thanks for your help :)
Tags
Styling
Asked by
Mike
Top achievements
Rank 1
Answers by
Martin
Telerik team
Share this question
or