Rendering Changes in 13.0.0
The Kendo UI for Angular 13.0.0 release introduces changes in the rendering of a number of components.
Icons
With the R2 2023 release, the default icon type in the Kendo UI for Angular components and Kendo UI themes is changed from font
to svg
. This change marks the next milestone in a series of improvements related to Content Security Policy (CSP). For more detailed information, refer to the Migrating Font Icons to SVG Icons article.
Dialog Edit Forms
We have made changes to the rendering of the edit forms within several components, including the Grid, TreeList, Gantt, Scheduler, Editor, DateTimePicker, and TimePicker. Previously, these forms were displayed horizontally, but now they are displayed vertically. Additionally, the action buttons in these components edit forms have been realigned to the bottom left of the form and are no longer stretched. The "Submit" button, which represents the primary action, is positioned before the "Cancel" button. As a result of these changes, it may be necessary to refactor any custom styles that were applied to the edit forms.
BreadCrumb
- Removed the
k-flex-none
class from thek-breadcrumb-item
element. - Removed the
k-flex-none
andk-cursor-pointer
classes from thek-breadcrumb-link
element. - Removed the
k-flex-none
andk-cursor-pointer
classes from thek-breadcrumb-root-link
element. - Replaced the
k-flex-wrap
class with!k-flex-wrap
inside thek-breadcrumb-container
element in collapse mode. - The item text is now wrapped in a span element
<span class="k-breadcrumb-item-text">
.
BottomNavigation
- The
k-bottom-nav-#{$themeColor}
class has been renamed tok-bottom-nav-#{$fillMode}-#{$themeColor}
.
ColorGradient
- Changed the ColorGradient alpha and hue slider drag handles from
<a class="k-draghandle"></a>
to<span class="k-draghandle"></span>
.
ColorPalette
- Removed
k-colorpalette-table-wrap
table wrapper. - Removed
k-palette
class from the ColorPalette table.
DropDownTree
- Replaced the
k-popup-dropdowntree
class withk-dropdowntree-popup
. The legacyk-popup-dropdowntree
class is still available for backward compatibility until R3 2023.
ExpansionPanel
- The class
k-expander-indicator
used for the ExpansionPanel icon<span class="k-icon k-i-chevron-up"></span>
has been relocated to a higher level, now applied to a wrapper container<span class="k-expander-indicator"></span>
.
MultiSelectTree
- Changed the
k-multiselect-tree
class tok-multiselecttree
. - Changed the
k-list-container
element fromspan
todiv
. - Replaced the
k-popup-dropdowntree
class withk-multiselecttree-popup
. The legacyk-popup-dropdowntree
class is still available for backward compatibility until R3 2023. - Added the
k-multiselecttree-popup
class to the MultiSelectTree popup.
Scheduler
- Removed the
k-scheduler-views-wrapper
class from the Scheduler views wrapper.
Slider and RangeSlider
- Removed
k-slider-wrap
wrapper.