DropDownList loading animation cropped

[Sebastian]

Dear Telerik Team,

when using the DropDownList state [loading]="true" with Kendo UI Bootstrap Theme the loading animation does not display correctly - it is cropped. Do you have any advise how to fix this?

Thanks and best regards

Sebastian

[Svet]

Hi Sebastian,

Thank you for the screenshot demonstrating the issue.

I tried to reproduce the undesired behavior but I could not. Please check the following sample plunker demonstrating a DropDownList component in loading state using the Kendo bootstrap theme:

https://plnkr.co/edit/NEOJOBQa0mQJ22WxljTC?p=preview

It seems to be working as expected.

It is possible that the reported behavior is caused by some third party or custom CSS that interferes with Kendo bootstrap theme. Comparing the applied styles from the provided sample plunker with the applied styles in the particular project can help in finding the cause for the issue.

Please send us an isolated example, a sample plunker or runnable project, demonstrating the issue so that I can provide further assistance for this case. Thank you in advance.

Regards,
Svetlin
Progress Telerik

[Sebastian]

Hi Svetlin,

thanks for your reply. Your Plunkr works fine because it is using DropDownList. In my post I referred to DropDownList but I meant Combobox - sorry my fault. I changed your Plunkr to use a <kendo-combobox> and the display issue occurs too - see https://plnkr.co/edit/mg2vS1uYwSTtNjTaKcQ6.

There is still a difference to my issue: in my case the loading spinner is cropped where the gray button (on the right) ends. I am not using any third party CSS, just Kendo UI Bootstrap and the referenced Bootstrap.4.0.0-beta2 package.

However you can see the issue in the Plunkr mentioned above. I was able to do a quick fix by adding this CSS to my app:

/* Display fix for loading animation in Combobox control */
.k-combobox .k-select .k-i-loading {
    top: 0 !important;
    margin-top: 0 !important;
    position: relative !important;
    right: 0 !important;
}

But this is just a hack. I prefer an integrated solution...

Regards,

Sebastian

[Svet]

Hi Sebastian,

Thank you for the provided feedback and updated sample plunker.

Indeed, this is a bug on our side. I logged an issue in our public GitHub repository that can be tracked at the following link:

https://github.com/telerik/kendo-theme-bootstrap/issues/366

I have also updated your account's Telerik points for reporting this issue.

Please accept our apology for any inconvenience you may get until the issue is resolved. We will do our best to fix it is as soon as possible.

Regards,
Svetlin
Progress Telerik