Card, Stepper, TabStrip and other Layout components not rendering correctly

[Alvin]

Hi,

I'm using the Drawer component as a navigation menu widget. When I try to lay out content in the kendo-drawer-content area the content is correctly rendered except when it is a layout component; then styling simply breaks. For example, grids are rendered correctly but cards, steppers, tabstrips, panelbars, etc. lose their structure/styling (see Stackblitz: https://stackblitz.com/edit/kendo-drawer-component-ehlmsd for some examples).

Am I doing something wrong or is this a bug?

Thanks in advance for your assistance.

[Martin Bechev]

Hi Al,

Thank you for the provided details.

I checked the demo and noticed that in styles.scss file the styles for some of the used components are missing. Adding the styles for the TabStrip, Card and Stepper fix the layout of the widgets:

@import "~@progress/kendo-theme-default/scss/appbar/_index";
@import "~@progress/kendo-theme-default/scss/drawer/_index";
@import "~@progress/kendo-theme-default/scss/grid/_index";

@import "~@progress/kendo-theme-default/scss/tabstrip/_index";
@import "~@progress/kendo-theme-default/scss/card/_index";
@import "~@progress/kendo-theme-default/scss/stepper/_index";

Here is the updated example:

https://stackblitz.com/edit/kendo-drawer-component-veurcz?file=styles.scss

I hope this helps. Let me know if any further questions come up.

Regards,
Martin
Progress Telerik

[Alvin]

Thanks Martin