Releases
All notable changes of the kendo-themes project will be documented in this file. See Conventional Commits for commit guidelines.
v14.2.0
 (6/29/2026)14.2.0 (2026-06-29)
🚀 Features
- introduce scrollbar styles to k-body (f9f0358955)
- diagram: add diagram selection tool styles (b3213452e8)
- grid: enhance grid grouping modes (1a333a0fbb)
- html: add diagram selection tool test (a97ce8ffad)
- multiselect: add select all functionality (3e13245707)
🩹 Fixes
- window border is being cut when larger border radius is set (3bcf420115)
- add relative colors to theme swatches (04e314e734)
- remove per component scrollbar-related variables (7108ec74ab)
- update the sizing of the loading icon to match the icon size (7b8e44402c)
- syntax issues in compiled css (e4ee9153d4)
- revert spreadsheet scroller z-index (f7cc6afeba)
- badge: update base badge colors (97760f8b24)
- bootstrap: selected segmented control button text in urban swatch (2389110e72)
- deps: pin versions blocked by Harness registry age-gate (fa481b63ac)
- deps: add empty token for public registry in dependabot config (7d81d8d738)
- deps: use secret reference for dependabot registry token (4fb50c5fbe)
- expansion-panel: expander title text transform (6bfa411226)
- grid: column menu item alignment (bae5dc95c2)
- grid: sticky borders have different color when states are applied (9ee2a3e9bd)
- grid: grid selection styles spilling over grouping column cells (097f4c730d)
- grid: remove ellipsis from checkbox/radio cells (440d6434f5)
- grid: add row should not inherit styles from header (75faea557d)
- html: grid group actions menu rendering (4473f2b51b)
- html: remove wrong classes from calendar (faea5acab9)
- html: component accessibility fixes (d3bd96f696)
- html: correct scheduler templates (d74704c64b)
- loader: update the loader sm size in meridian (796bec54b7)
- material: grouping rows and group cells do not match design (19a1af4cbc)
- meridian: prevent calendar from jumping when changing the months (f55d32d034)
- meridian: scheduler agenda view misalignment (d0d9cce273)
- meridian: prevent group footer double borders (1c2ccd2a97)
- meridian: move card backdrop-filter to ::before to fix dialog scoping (3b6e9bdb6a)
- pager: revert previous/next icons from chevron to caret-alt (97c68e7831)
- popup: inherit border-radius for coloreditor inside popup (47bcc75865)
- textarea: rounded full should be less rounded (f3093d53e0)
- timeline: match card callout background to card color (fcbf62335e)
v14.1.0
 (5/19/2026)14.1.0 (2026-05-19)
Bug Fixes
- add fallback to the kendo-translucency-base css var (3aca60e)
- correct invalid css (5c33ad5)
- meridian: bottom-nav item background (cc10f37)
- meridian: fix window bottom border-radius in resize (f45a7dc)
- meridian: pager buttons gap (8874e7d)
- meridian: remove blur on transparent popups (352687d)
- meridian: use correct shadows for sticky and pinned grid containers (2946c79)
- spreadsheet scroller (d21e254)
- chat: retry button gap (b2e04d9)
- grid: columnmenu item icon gap (721e03a)
- grid: remove hover state from grid header rows (844af23)
- html: change icons to v5 namings (2f3c0e8)
- html: update buttons to xs in tabstrip (6e208a5)
- meridian: backdrop-filter causes overflow to break (34e0da1)
- meridian: increase gap between slider track and buttons (cbcbf1d)
- meridian: input adornments focus (8132044)
- meridian: menu active/selected state makes the item jump (b8dd497)
- meridian: nested panelbar items focus (7f4b286)
- meridian: window prompt container bg (40fc488)
- tabstrip: active item border (8b54de1)
- tabstrip: update tabstrip item spacings (41240ef)
- toolbar: scroll container cuts off focus outline (a7ac024)
- list: item without text has wrong height (6064a97)
- meridian: animations on blured popups (7749596)
- meridian: timeselector highlight alignment (6f5f119)
- skill: correct dropdown-list mixin name in evals (41742ac)
- skills: rewrite iconography — remove false CSS variable claim (a20e0ee)

Features
v14.0.0
 (5/11/2026)14.0.0 (2026-05-11)
Bug Fixes
- correct color tokens usage (72e4ecb)
- fluent: update border-width units for a correct calc expression (f82f9da)
- html: add default border-radius to scroll buttons (97c7aed)
- grid: update pinned and sticky container styles (1e69164)
- grid: pin cell overflow should be clipped (2cf31fa)
- grid: streamline grid styles (69e20fe)
- grid: unpin icons have wrong color (a94db3e)
- table: streamline table styles (c30bb27)
- chat: suggestions border is cutting out on the first and last elements (627056a)
- listbox: prevent long item text from overflowing action buttons (765dabb)
- loader: update loader-container to use overlay (cfad0d4)
- pdf-viewer: add CSS custom properties for text layer scaling (pdfjs v5) (65d3b60)
Features
- derive border radii from a single step (0e629d0)
- derive spacing from a single step (9a5b9ff)
- remove light and dark theme colors from styles, swatches, specs and utils (f73dd3a)
- revise themeColors across components (ba854ac)
- elevation: reduce elevation scale from 9 to 5 levels (8dad38f)
- bootstrap: convert hex to oklch and remove obsolete palettes (46afd8a)
- classic: convert hex to oklch and remove obsolete palettes (de94e87)
- default: convert hex to oklch and remove obsolete palettes (c908a70)
- fluent: convert hex to oklch and remove obsolete palettes (58e360f)
- material: convert hex to oklch and remove obsolete palettes (fca68f0)
- meridian: introduce meridian theme (7302e2e)
- html: add xsmall size to the Button component (a2a433d)
- html: use segmented control component in other components (1f1062f)
- html: replace caret icons across components with chevrons (3642fc9)
- button: add styles for xsmall size (c19ee9a)
BREAKING CHANGES
- meridian: Starting with this release, @progress/kendo-theme-meridian is the new recommended theme for Kendo and Telerik products. It replaces @progress/kendo-theme-default as the default starting point for new applications.
@progress/kendo-theme-default is now in maintenance mode. It will continue to receive bug fixes, styles for new components, and compatibility updates, but will no longer receive visual redesigns or new design concepts.
Existing applications can continue using Kendo Default theme and migrate to Meridian on their own schedule. To learn more about this change, please refer to the dedicated breaking change article in the Progress Design System documentation.
v13.1.1
 (3/23/2026)13.1.1 (2026-03-23)
Bug Fixes
- grid: align pinned container with scrollbar area (8f02379)
- input: nested input should not have box-shadow (8ad1e40)
- html: fix demos (ee7ba53)
- html: update grid k-selected and aria-selected combos (3bcdc96)
- segmented-control: make icon-only component height consistent with text-based component (9d9ff6e)
v13.1.0
 (3/17/2026)13.1.0 (2026-03-17)
Bug Fixes
- html: add rounded full to prompt box endAffix icon button (ebe6c3e)
- html: add a11y sr-only element to grid empty headers (6fe06ee)
- fix property declaration warnings (d670d52)
- segmented-control: add units to padding for calc compatibility (c2690bc)
- grid: fix virtualization issues with sticky and pinned containers (465abb3)
- remove zwsp unicode usage across themes (ba8c783)
- html: remove calendar-md class from jquery classic calendar (98b1a42)
- html: remove obsolete k-widget class from specs (5a4b807)
- list: incorrect alignment in rtl mode (d3db5f4)
- remove obsolete k-widget class from styles (84e46a1)
Features
- add variables for vertical popup spacings (cbfa407)
- html: add ARIA specs for dropdowns, panels and lists (bceaf58)
- html: add aria to column and filter menu, column chooser, filter (f142627)
- html: add aria to editors, scrollview, specialized buttons and viewers (25f73ac)
- html: add aria to filemanager and chart-wizard (821b832)
- html: add aria to orgchart, pager, taskboard (e68eaf8)
- html: add aria to smartbox, filebox, chat (a84c411)
- html: add aria to spreadsheet (13dcf1f)
- html: add gantt aria (cc12364)
- html: add grid aria (0fc8987)
- html: add grid pinned rows and sticky groups templates (d8d607a)
- html: add property grid aria (321055c)
- html: add scheduler, remove href from anchors (af662a8)
- html: add treelist aria and templates (edf5454)
- html: add a11y to date, time, color pickers, calendars (9411f0b)
- html: add accessibility attributes to html rendering (d2b17ce)
- html: add aria for chip, chiplist, tooltip, popover, and progressbars (33fe470)
- html: add aria to navigation, layout and dialogs components (4dee6c0)
v13.0.1
 (2/16/2026)13.0.1 (2026-02-16)
Bug Fixes
- material: remove the hover/focus borders for buttons inside outline pickers (0f37537)
- chat: should use k-color-app-surface as a background (b32d507)
- file-box: scroll gradient should use k-color-app-surface as an end color (da0a0f1)
- forms: do not apply margin to first children in vertical forms (5ad47dc)
- html: add rounded full to prompt box affix icon buttons (ea4a41d)
- html: all built-in buttons should have full roundness (d6bc61a)
- html: built-in buttons in prompt-box should be always visible (d53faa8)
- html: chat default tools should be small size (da69fa0)
- input: flat inputs should have transparent background color (cc23607)
- material: add missing border-radii module (9dfa400)
- suggestion: scroll gradient should use k-color-app-surface as an end color (07f6239)
- html: update segmented-control size smartBox (f1d1455)
- smart-box: fix style glitches (73617d0)
v13.0.0
 (2/9/2026)13.0.0 (2026-02-09)
Bug Fixes
- tabstrip: remove bottom border of selected tabs in scrollable mode (31d994a)
- chat: decrease min-height (127b774)
- fluent: resolve calc related parse errors (274b1b2)
- html: remove redundant themeColor and roundness from components (c94dbd1)
- material: resolve unit test sass warnings (c0cfa8b)
- resolve unit tests sass warnings (1cc38b0)
- fluent: do not use global built-in index function (9bbd1de)
- html: remove reduntant component option classes (e469603)
- columnmenu: add angular-specific icon wrapper spacing in column menu (626e890)
- html: remove listbox redundant size class (0ae6956)
- html: remove loader container utility text classes (8fae06a)
- html: remove redundant signature classes (06c004a)
Features
- chat: enhance styles with new and improved features (873580d)
- file-box: add styles (bf5d9c2)
- html: add prompt-box component (814a401)
- html: add segmented control rendering and tests (da0d1e1)
- html: add smart-box component rendering and tests (baf91f5)
- html: add support for overflow menu to tabstrip specs and templates (03d8a01)
- html: enhance chat rendering with new and improved features (252041e)
- html: enhance treeview rendering (e164789)
- html: extract file-box component (f8507e4)
- list: enhance rendering with modern grouping, icons and actions (d458dde)
- list: enhance styles (c1d7740)
- motion: add stretchy easing (2c45c46)
- prompt-box: add styles (eb646a9)
- segmented-contro: add styles (c751a50)
- smart-box: add styles (3370960)
- tabstrip: add overflow menu styles (34893ae)
- treeview: enhance styles (46e15d4)
- grid: add pinned row/group row styles (c173d4e)
- grid: add sticky group header and footer styles (df4908f)
- html: add grid sticky container spec (254e6af)
- add default component options (00995e4)
- html: update spec and tests with new default options rendering (6987a83)
BREAKING CHANGES
- Starting with the R1 2026 release, the component option classes (size, roundness, fill mode, theme color) are no longer rendered in the HTML when they match the default values. The default options are now controlled through SCSS variables (e.g., $kendo-button-default-size, $kendo-button-default-roundness) and the respective styles are applied directly to the main component class. This allows different themes to define their own defaults and enables easier customization. Additionally, the theme color classes are now separate from the fill mode classes (e.g., k-button-solid k-button-primary instead of k-button-solid-primary). To learn more about these changes, please refer to the dedicated article in the Progress Design System documentation.
v12.3.0
 (12/1/2025)v12.2.3
 (11/7/2025)v12.2.2
 (11/6/2025)v12.2.1
 (11/3/2025)v12.2.0
 (10/28/2025)12.2.0 (2025-10-28)
Bug Fixes
- breadcrumb: wrong focus indicator in Default a11y theme (5287353)
- chat: skeleton and message-reference should be rendered outside the text (699e6cb)
- chip: update color for outline chip with warning themeColor (dc3b9d3)
- html: chat header should use themeColor inherit (25081c6)

- grid: longer filter menu operators should be truncated (5fb887d)
- list: add selected hover state variables for list items (9a10eae)
- multiselect: prevent custom value from overlapping items in virtual lists (ae77e56)
- pager: use flexible width for page size (64ce3bf)
- fluent: use correct grid group dropclue height (e07725c)
- list: not working sizing sass variables (6bd0951)
Features
v12.1.0
 (10/6/2025)12.1.0 (2025-10-06)
Bug Fixes
- fluent: prevent unchecked checkboxes from showing checkmark on hover (0cc53aa)
- html: correct icon positioning in Grid/List view switcher (8121e6f)
- bootstrap: resolve validation message cut-off in Upload component (3456369)
- fluent: set proper background color for tabbed column menu (a84a409)
- streamline components z-indexes (2db7ec4)
- html: map controls positioning classes (3f9694b)
- tabstrip: add position relative to k-tabstrip (b12666c)
- window: not resizing properly from sides in RTL (a1161cb)
- adaptive: update scheduler time-period text (8e017d1)
- badge: base outline badges should use base-on-surface color (e1c0fd4)
- bootstrap: update variables to use design tokens (d60f2f9)
- calendar: buttons in header should inherit their styles from the flat button (0c3a700)
- card: avatar inside card should adheres to the avatar component's sizing options (6c590b7)
- chip: update interactive states styles to use correct design tokes (935a126)
- classic: update variables to use design tokens (53d44af)
- core: no logical properties should be used with cardinal directions (8d32f2b)
- default: update variables to use design tokens (18eb632)
- drawer: update scrollbar colors (f4fb966)
- filter: update text colors (b8cb4d3)
- fluent: update main and main dark swatch colors (84a8f6f)
- gantt: update tokens (1608df2)
- loader: should use themeColor-on-surface instead of themeColor (4a45547)
- material: update variables to use design tokens (2f0d49e)
- pdf-viewer: update annotations colors (8c15348)
- rating: update colors (486b790)
- scrollview: delete unnecessary rules and update navigation colors (55994d3)
- stepper: prevent item focus indicator clipping (61391f7)
- datetimepicker: add size specific widths (0c28e61)
- mixed-decls sass warnings (fecec9a)
- private variables sass warnings (ec8ed3d)
Features
v12.0.1
 (9/1/2025)12.0.1 (2025-09-01)
Bug Fixes
- calendar: empty cells should not be interactive (03e9f30)
- default: update incorrect colors in the nordic swatch (3e33afb)
- html: remove draggable=true attribute from grid grouping header (11c3230)
- input: adornments icon padding (081af6b)
- map: fix layer RTL styles (fcbe297)
- utils: variable customization leads to an error (48c7057)
v12.0.0
 (8/21/2025)12.0.0 (2025-08-21)
Bug Fixes
- fluent: address postcss-calc warnings (23905b7)
- material: incorrect hover styling on disabled solid button (646e170)
- grid: allow horizontal scrolling of grid content (f742be6)
- notification: correct line height (67efaa2)
Features
- fluent: update styles to Fluent 2 design guidelines (6065177)
- chat: enhance component styles with improved and new features (238c864)
- html: enhance Chat component with new features (d6a06ed)
BREAKING CHANGES
-
fluent: Starting with the R3 2025 release, the Telerik and Kendo UI Fluent theme will align with Fluent 2 design guidelines. As a result, the theme will no longer follow Fluent 1 standards for metrics, layouts, fonts, elevation, and typography. To learn more about this change, please refer to the dedicated breaking change article in the Progress Design System documentation.
In order to apply Fluent 1 colors in your application, try out the bundled Fluent 1 color swatch - it maintains a similar color palette while benefiting from the modern Fluent 2 guidelines.
-
chat: The Chat component's rendering and styles have been significantly updated to support modern conversational interfaces. This release introduces notable enhancements in the Chat rendering and adds new features such as a header, expandable and full-width messages, single and multiple file attachments, file pinning, interactive bubble states, an animated typing indicator, etc.
v11.3.2
 (8/8/2025)v11.3.1
 (8/7/2025)v11.3.0
 (8/6/2025)11.3.0 (2025-08-06)
Bug Fixes
- html: align form specs with product requirements (672925d)
- toolbar: prevent scrollable toolbar overflowing (204f68b)
- grid: fix command cell in grid stack layout (176e494)
- html: update tests with correct command cell rendering in grid stack layout (bbae139)
Features
- bootstrap: update styles to match Bootstrap 5.3 (5e6dc1e)
v11.2.0
 (7/21/2025)11.2.0 (2025-07-21)
Bug Fixes
- prompt: prompt border-radius (9f9c3a4)
- grid: add min-height to stack cell content and remove grouping aggregates items styles (e0487c5)
- grid: improve dirty cell indicator position (620f9c5)
- grid: improve stack header cell contrast ratio in a11y swatch (df8dfbc)
- toolbar: focus indicator is cropped (de9d482)
Features
v11.1.0
 (7/7/2025)11.1.0 (2025-07-07)
Bug Fixes
- switch: $kendo-switch-on-thumb-disabled-border variable is not applying (113ea9b)
- add missing default typography font-weight values (64c532c)
- button: focus and selected states lack clear visual differentiation (9e87069)
- grid: streamline grid state styles (3702b51)
- material: use correct colors for marquee (a98ef1c)
- charts: add display properties to diagram and gauge (66f8230)
- add suggestion styles (d88d6ae)
- html: add suggestion spec (5d22cdf)
Features
- grid: add highlight state styles (ac739eb)
- html: add grid highlighted state (d51e944)
- add speech-to-text-button styles (ea22243)
- html: add form grid layout template (96cd330)
- html: add speech-to-text-button spec and templates (db123b8)
- html: allow usage of colspan in formfield (1f4e971)
- grid: add styles for grid stack layout (a1d8e3e)
- html: add tests and templates for grid-stack-layout (f988f61)
v11.0.2
 (5/15/2025)v11.0.1
 (5/13/2025)v11.0.0
 (5/7/2025)11.0.0 (2025-05-07)
Bug Fixes
- coloreditor: update color gradient canvas sizes (0d8aed6)
- toolbar: button badge is being cut (7e31085)
Features
- material: update styles to Material 3 design guidelines (4bcf754)
- drop legacy color system support (57a4ed2)
BREAKING CHANGES
-
material: Starting with the R2 2025 release, the Telerik and Kendo UI Material theme will align with Material 3 design guidelines. As a result, the theme will no longer follow Material 2 standards for metrics, layouts, fonts, elevation, and typography. To learn more about this change, please refer to the dedicated breaking change article in the Progress Design System documentation.
In order to apply Material 2 colors in your application, try out the bundled Material 2 color swatch - it maintains a similar color palette while benefiting from the modern Material 3 guidelines.
-
With R2 2025, the legacy color system is no longer supported. The new color system is now the default and only option. To learn more about this change, please refer to the dedicated breaking change article in the Progress Design System documentation.
v10.6.0
 (4/28/2025)v10.5.0
 (3/31/2025)v10.4.0
 (3/21/2025)10.4.0 (2025-03-21)
Bug Fixes
- material: button font-family has wrong value (f92f085)
- pdf-viewer: add missing annotation styles (08fb856)
Features
- action-buttons: enhance alignments and positions (4376f29)
- action-sheet: enhance component styles (ad12206)
- html: enhance action-sheet specs (867749f)
- enhance column-menu styles (261541b)
- html: enhance column-menu spec (21ef3dc)
- html: enhance pager spec (fec7c6c)
- add column-menu sizing styles (1d34952)
v10.3.1
 (3/5/2025)v10.3.0
 (3/4/2025)v10.2.0
 (2/4/2025)10.2.0 (2025-02-04)
Bug Fixes
- tabstrip: center content in stretched horizontal tabs (00c1f6a)
- tabstrip: move rtl styles inside mixin (98df004)
- toolbar: fix scrollable overlay starting point (6fa6ce3)
- update sizing related styles for ColorEditor, ColorGradient, ColorPalette (9b235c2)
- colorgradient: slider draghandle is cut off in adaptive mode (910224a)
- dataviz: chart legend font-size is incorrect (bb15b00)
- html: fix toolbar and tabstrip scrollingPosition prop (8849fa9)
- html: replace toolbar and tabstrip scroll buttons with spans (a5756b0)
- html: toolbar scroll buttons should be around by default (6917fb0)
- html: wrong icon for expanded suggestions and settings (2d6dde1)
- tabstrip: correct scrollable overlay in rtl (7bb5f50)
- tabstrip: items wrapper should not shrink (b59c5fb)
- toolbar: correct scrollable overlay in rtl (0f0c298)
- chip: fix text clipping inside chip label (7d09b2e)
- colorpicker: change dimensions of input-inner when it is a direct child of icon-picker (746058e)
- dataviz: revert chart label font-size (85305da)
- dock-manager: content inside unpinned container does not resize properly (b81c4ce)
- html: menu popup should be rendered on a root level (997173c)
- html: toolbar scrollable items container should be a div (e6f0b64)
- html: use textbox for otp input (ebda767)
- fluent: use correct variable for input suffix disabled text (9b51e50)
Features
v10.1.0
 (12/23/2024)10.1.0 (2024-12-23)
Bug Fixes
- bootstrap: add missing icon styles mixin (7e81c25)
- bootstrap: headings font-families don't provide fallback values (2ff3a4a)
- notification: wrong icon size when long content is rendered (1fac8f8)
- pager: select value in adaptive pager has wrong vertical alignment in Safari (6e648fb)
- spreadsheet: allow clicking inside the filtered area (e5df0a7)
- add missing time-marker dependency (40b704c)
- fluent: replace k-alt with k-table-alt-row (9c721bc)
- gantt: tasks resizing indicators should point both left and right (a969ece)
- html: add checkbox checked template (dfcaf0c)
- html: add chip label to Grid chips (c9de930)
- html: add icons to ImageEditor action pane buttons (d6e7c9d)
- html: add k-filterable class to header cell with column menu in Grid (c9ef117)
- html: add k-grid-aria-root to Treelist in Gantt (e09d493)
- html: add k-grid-draggable-header to Grid groupable header (342b7f0)
- html: add k-sr-only span inside empty Pivotgrid cell (c57509f)
- html: add k-tabstrip-item class to tabstrip item element (40d95f3)
- html: add toolbar-button class to toolbar buttons in AI prompt (58f3cea)
- html: fix alt row in Grid grouping template (a7da1fd)
- html: move Grid selection aggregates outside of aria-root (848b733)
- html: move on/off Switch label to templates (86f6d15)
- html: remove angular specific styles and specs from toolbar (99bd6a9)
- html: remove Grid grouping drop clue from templates (d1edb3b)
- html: remove k-alt from Grid row (5981f19)
- html: remove k-drag-cell from header empty cell in Grid, Treelist and Gantt (a974de9)
- html: remove k-editable class from Grid and Filemanager (34f133f)
- html: remove k-header class from tabstrip (9642807)
- html: remove k-height-container from Grid (c85350d)
- html: remove k-selectable class from Gantt (4b88313)
- html: remove k-tab-on-top class from tabstrip (97b8fbe)
- html: remove k-treelist-group class from Treelist (a1eccf1)
- html: remove k-virtual-content from Grid (84cf6ce)
- html: removed k-touch-action-auto from Grid cells (c0990f4)
- html: update DateTimePicker container class and adaptive buttons classes (186ef38)
- html: update hidden class in expansion panel (631ca6a)
- html: update ImageEditor action pane checkbox label (fc71db8)
- imageeditor: widen the action pane to fit action buttons with icons (1d8800d)
- slider: incorrect draghandle states (1081b23)
- splitter: add touch-action: none style to splitbar (ec493ac)
- input: allow base input box-shadow customization (3eb5d9b)
- pdf-viewer: link annotations are not clickable (11857c2)
- checkbox: svg check icon always uses fallback color (9e40412)
- html: use GridToolbar in angular grid test (79859ba)
- radio: svg check icon always uses fallback color (7696f64)
Features
- html: add propertygrid spec (e728b14)
- grid-layout: add component module (7fc165a)
- stack-layout: add component module (5438509)
- dock-manager: add support for floating panes (dbbce4b)
- html: add otp spec (592948b)
- html: add toolbar adaptive specs (72570d2)
- html: enhance TabStrip rendering with sizing options and hidden scroll buttons (74220b4)
- otp: add component styles (42c071b)
- tabstrip: add styles for different sizes and hidden scroll buttons (c493dd3)
- toolbar: add adaptive styles (97e3731)
- colorpicker: add styles for sizing and adaptive rendering (52c4429)
- html: add colorPicker sizing and adaptive rendering (63d31ce)
v10.0.1
 (11/8/2024)v10.0.0
 (11/6/2024)10.0.0 (2024-11-06)
Bug Fixes
- add missing panel styles (f30c677)
- do not include legacy color variables in swatches (762b711)
- grid: fix broken sticky row styles (6bb26e7)
- menu: scroll wrapper position (56372b7)
- core: change the main field to point all.css in package.json (534da7d)
- bootstrap: fix swatches disabled state (b4b9b3d)
- classic: fix swatches disabled state (68a4c19)
- colorgradient: remove duplicated vars with invalid values (fe5762e)
- default: fix swatches disabled state (4290e91)
- html: ai prompt toolbar classes (1900795)
- scheduler: recurring events have incorrect margin in rtl (c2fdcc6)
Features
- bootstrap: detach the theme from twbs/bootstrap (35ad29e)
- bootstrap: migrate theme to the dart-sass module system (0d4583b)
- classic: migrate theme to the dart-sass module system (11f910f)
- core: migrate to the dart-sass module system (19bdedb)
- default: migrate theme to the dart-sass module system (b4db551)
- fluent: migrate theme to the dart-sass module system (c1d9891)
- material: migrate theme to the dart-sass module system (a04a40c)
- utils: migrate to the dart-sass module system (82f0cb5)
- bootstrap: remove margin utils from the theme (25c73b9)
- classic: remove margin utils from the theme (21b73cc)
- default: remove margin utils from the theme (29a211e)
- fluent: remove margin utils from the theme (c4f6c3d)
- material: remove margin utils from the theme (6b6812a)
BREAKING CHANGES
-
default: Starting with the R4 2024 release, all Kendo themes are now migrated to the SASS module system. This breaking change is due to the
node-sasspackage reaching its official end of life.For more information, please refer to the following links:
- https://sass-lang.com/blog/the-module-system-is-launched/
- https://github.com/sass/node-sass/commit/107ded9434cfca43dbd9dfbaeb5c349228bf5cee
If you are currently using
node-sassas a dependency and compiler, note that it is no longer supported in this version. To ensure compatibility, switch todart-sass(sass) by following the official installation steps.The import syntax of the theme has also changed to reflect the new
dart-sasssyntax. Below are examples of the old and new syntax:// Old syntax (node-sass); @import "@progress/kendo-theme-default/dist/all.scss";// New syntax (dart-sass); @use "@progress/kendo-theme-default/scss/all.scss" as *; -
bootstrap: Effective with the R4 2024 release, twbs/bootstrap is removed as a dependency of the Kendo UI Bootstrap theme. This means that customizing bootstrap scss variables will no longer have an effect on our components, as the theme will be detached i.e. not depending upon. However, we will provide mostly the same look and feel through variables that have the same values.
In order to continue using twbs/bootstrap along with the Kendo Bootstrap theme, make sure to add a it as a dependency to your project.
-
bootstrap: Starting with the R4 2024 release, all Kendo themes are now migrated to the SASS module system. This breaking change is due to the
node-sasspackage reaching its official end of life.For more information, please refer to the following links:
- https://sass-lang.com/blog/the-module-system-is-launched/
- https://github.com/sass/node-sass/commit/107ded9434cfca43dbd9dfbaeb5c349228bf5cee
If you are currently using
node-sassas a dependency and compiler, note that it is no longer supported in this version. To ensure compatibility, switch todart-sass(sass) by following the official installation steps.The import syntax of the theme has also changed to reflect the new
dart-sasssyntax. Below are examples of the old and new syntax:// Old syntax (node-sass); @import "@progress/kendo-theme-bootstrap/dist/all.scss";// New syntax (dart-sass); @use "@progress/kendo-theme-bootstrap/scss/all.scss" as *; -
classic: Starting with the R4 2024 release, all Kendo themes are now migrated to the SASS module system. This breaking change is due to the
node-sasspackage reaching its official end of life.For more information, please refer to the following links:
- https://sass-lang.com/blog/the-module-system-is-launched/
- https://github.com/sass/node-sass/commit/107ded9434cfca43dbd9dfbaeb5c349228bf5cee
If you are currently using
node-sassas a dependency and compiler, note that it is no longer supported in this version. To ensure compatibility, switch todart-sass(sass) by following the official installation steps.The import syntax of the theme has also changed to reflect the new
dart-sasssyntax. Below are examples of the old and new syntax:// Old syntax (node-sass); @import "@progress/kendo-theme-classic/dist/all.scss";// New syntax (dart-sass); @use "@progress/kendo-theme-classic/scss/all.scss" as *; -
material: Starting with the R4 2024 release, all Kendo themes are now migrated to the SASS module system. This breaking change is due to the
node-sasspackage reaching its official end of life.For more information, please refer to the following links:
- https://sass-lang.com/blog/the-module-system-is-launched/
- https://github.com/sass/node-sass/commit/107ded9434cfca43dbd9dfbaeb5c349228bf5cee
If you are currently using
node-sassas a dependency and compiler, note that it is no longer supported in this version. To ensure compatibility, switch todart-sass(sass) by following the official installation steps.The import syntax of the theme has also changed to reflect the new
dart-sasssyntax. Below are examples of the old and new syntax:// Old syntax (node-sass); @import "@progress/kendo-theme-material/dist/all.scss";// New syntax (dart-sass); @use "@progress/kendo-theme-material/scss/all.scss" as *; -
fluent: Starting with the R4 2024 release, all Kendo themes are now migrated to the SASS module system. This breaking change is due to the
node-sasspackage reaching its official end of life.For more information, please refer to the following links:
-
core: Starting with the R4 2024 release, all Kendo themes are now migrated to the SASS module system. This breaking change is due to the
node-sasspackage reaching its official end of life.For more information, please refer to the following links:
- https://sass-lang.com/blog/the-module-system-is-launched/
- https://github.com/sass/node-sass/commit/107ded9434cfca43dbd9dfbaeb5c349228bf5cee
If you are currently using
node-sassas a dependency and compiler, note that it is no longer supported in this version. To ensure compatibility, switch todart-sass(sass) by following the official installation steps. -
utils: Starting with the R4 2024 release, all Kendo themes are now migrated to the SASS module system. This breaking change is due to the
node-sasspackage reaching its official end of life.For more information, please refer to the following links:
- https://sass-lang.com/blog/the-module-system-is-launched/
- https://github.com/sass/node-sass/commit/107ded9434cfca43dbd9dfbaeb5c349228bf5cee
If you are currently using
node-sassas a dependency and compiler, note that it is no longer supported in this version. To ensure compatibility, switch todart-sass(sass) by following the official installation steps.The import syntax of the theme has also changed to reflect the new
dart-sasssyntax. Below are examples of the old and new syntax:// Old syntax (node-sass); @import "@progress/kendo-theme-utils/dist/all.scss";// New syntax (dart-sass); @use "@progress/kendo-theme-utils/scss/all.scss" as *; -
typography: the margin utility classes have been removed
v9.1.0
 (10/14/2024)9.1.0 (2024-10-14)
Bug Fixes
- addressing spacing related issues across components (340c122)
- loader: wrong secondary color (90db422)
- html: add missing context-menu first/last classes (6b35f98)
- html: add missing menu first/last classes (d57f8c1)
- html: correct dockmanager tabstrip first/last classes (4191e04)
- html: correct dockmanager toolbar button sizes (c5475a3)
- html: correct pager double disabled button state (15c0697)
- html: correct pdf-viewer toolbar button-group fillmode (dc97812)
- html: correct scheduler toolbar-specific classes (7849f74)
- html: correct typo in k-scheduler-task-text class (67aaf25)
- html: remove checkbox warnings from specs (d8fe713)
- html: remove splitter warnings from specs (6ae1777)
- html: svg icon names with numbers are not considered (00e7bb6)
- importing theme in a class creates a wrong selector (165ec66)
- listview: adjust loading mask rendering (93cb992)
- calendar: use correct name for module (9b13e6d)
- grid: missing sticky rows styles (c1bf80e)
- editor: table resizing tool misalignment in non-iframe mode (6cf8e0f)
- window: long titles are not truncated (e71a3fe)
Features
- dataviz: add chart overlay styles (f1f607d)
- html: add fillMode option in the Toolbar spec (c7c8ab2)
- html: add PDFViewer annotations spec and tests (90b853e)
- pdf-viewer: add styles related to pdf annotations (dedc15c)
- toolbar: add fillMode option styles (dbe414d)
- html: update menu spec to match the design revision (a55bae5)
- menu: apply menu styles to match the design revision (c7c4e0b)
- html: update tabstrip spec and tests (7d36a44)
- tapstrip: apply the new design (e5f2d43)
- html: add chip action template (58ea02c)
- html: add timedurationpicker templates (824587f)
- html: make chip avatar image configurable (7cfc7d6)
v9.0.0
 (7/29/2024)9.0.0 (2024-07-29)
Features
- bootstrap: detach utils package (c2870e0)
- classic: detach utils package (7b119ff)
- default: detach utils package (5d3910d)
- fluent: detach utils package (69a3e9b)
- material: detach utils package (e5f86d9)
- utils: implement responsive layout system (f81250e)
BREAKING CHANGES
- fluent: The utilities package is now decoupled from the themes package.
Effective with the R3 2024 release, the utilities package is now independent of the themes package. This means that, moving forward, components will selectively import only the utilities they require, rather than the entire utilities package. This adjustment does not impact the styling of components but is designed to improve the system's flexibility and modularity.
For developers using utility classes for custom layouts, you will now need to manually import the utilities as a separate stylesheet on your pages. For step-by-step instructions on how to do this, please visit: https://www.telerik.com/design-system/docs/utils/get-started/installation/
- material: The utilities package is now decoupled from the themes package.
Effective with the R3 2024 release, the utilities package is now independent of the themes package. This means that, moving forward, components will selectively import only the utilities they require, rather than the entire utilities package. This adjustment does not impact the styling of components but is designed to improve the system's flexibility and modularity.
For developers using utility classes for custom layouts, you will now need to manually import the utilities as a separate stylesheet on your pages. For step-by-step instructions on how to do this, please visit: https://www.telerik.com/design-system/docs/utils/get-started/installation/
- classic: The utilities package is now decoupled from the themes package.
Effective with the R3 2024 release, the utilities package is now independent of the themes package. This means that, moving forward, components will selectively import only the utilities they require, rather than the entire utilities package. This adjustment does not impact the styling of components but is designed to improve the system's flexibility and modularity.
For developers using utility classes for custom layouts, you will now need to manually import the utilities as a separate stylesheet on your pages. For step-by-step instructions on how to do this, please visit: https://www.telerik.com/design-system/docs/utils/get-started/installation/
- bootstrap: The utilities package is now decoupled from the themes package.
Effective with the R3 2024 release, the utilities package is now independent of the themes package. This means that, moving forward, components will selectively import only the utilities they require, rather than the entire utilities package. This adjustment does not impact the styling of components but is designed to improve the system's flexibility and modularity.
For developers using utility classes for custom layouts, you will now need to manually import the utilities as a separate stylesheet on your pages. For step-by-step instructions on how to do this, please visit: https://www.telerik.com/design-system/docs/utils/get-started/installation/
- default: The utilities package is now decoupled from the themes package.
Effective with the R3 2024 release, the utilities package is now independent of the themes package. This means that, moving forward, components will selectively import only the utilities they require, rather than the entire utilities package. This adjustment does not impact the styling of components but is designed to improve the system's flexibility and modularity.
For developers using utility classes for custom layouts, you will now need to manually import the utilities as a separate stylesheet on your pages. For step-by-step instructions on how to do this, please visit: https://www.telerik.com/design-system/docs/utils/get-started/installation/
v8.2.1
 (7/16/2024)v8.2.0
 (7/15/2024)v8.1.0
 (7/3/2024)8.1.0 (2024-07-03)
Bug Fixes
- pivotgrid: configurator button content overflows in ff (674ad32)
- table: focused table cells are not interactive (81a578d)
- dropdownlist: keep the height of empty dropdownlist (de3985c)
- fluent: incorrect palette name (7cedbb5)
- bottom-navigation: correct typography inconsistencies (e3ce2e4)
- card: correct typography inconsistencies (e4cc6fe)
- chat: correct typography inconsistencies (f5bc974)
- upload: correct typography inconsistencies (0f37a0f)
- window: correct typography inconsistencies (aa6f295)
Features
v8.0.1
 (5/10/2024)v8.0.0
 (5/7/2024)8.0.0 (2024-05-07)
Bug Fixes
- html: appbar should not have fillMode (1d2eef6)
- generate sass swatches compatible with the new color system (b510c58)
- incorrect color mapping in the new color system (634edce)
- loader: loader container stays underneath windows and dialogs (7ec89a7)
Features
- core: add a function that automatically generates the color variations (8be6f9a)
- utils: generate utility classes with css variables (94d993b)
- calendar: update styles to match design guidelines (3657cd0)
- drawer: update styles to match universal rendering (b042afa)
- floating-label: update styles to match the universal rendering (93ae817)
- panelbar: update styles to match universal rendering (d58280e)
- bootstrap: enable color system (45cc0b8)
- classic: enable color system (831b390)
- default: enable color system (0d08db2)
- fluent: enable color system (422ad07)
- material: enable color system (2dc48a0)
- bootstrap: integrate radii module (df28c2c)
- bootstrap: integrate spacing module (5821954)
- bootstrap: integrate typography module (7c83f2a)
- classic: implement spacing module (0c89d65)
- classic: integrate radii module (7161644)
- classic: integrate typography module (4e02f97)
- core: implement radii module (f963232)
- core: implement spacing module (7b863e5)
- core: implement typography module (8954987)
- default: integrate radii module (abd3f5f)
- default: integrate spacing module (3a7741b)
- default: integrate typography module (f4a6d94)
- fluent: integrate radii module (648bc00)
- fluent: integrate spacing module (c24f703)
- fluent: integrate typography module (43955ba)
- material: integrate radii module (667b4e5)
- material: integrate spacing module (0b934b3)
- material: integrate typography module (4f70d1e)
- utils: integrate radii module (228cac1)
- utils: integrate spacing module (a83b524)
- utils: integrate typography module (aa155a1)
BREAKING CHANGES
- fluent: This commit enables the new Color System,
which introduces a new way of implementing and customizing the colors.
If the user has customized some of the old color variables like
$kendo-color-primary,$kendo-body-bg,$kendo-base-bg, etc, they would need to migrate their customizations by following the Migration Guide which can be found in the Progress Design System Docs. - material: This commit enables the new Color System,
which introduces a new way of implementing and customizing the colors.
If the user has customized some of the old color variables like
$kendo-color-primary,$kendo-body-bg,$kendo-base-bg, etc, they would need to migrate their customizations by following the Migration Guide which can be found in the Progress Design System Docs. - bootstrap: This commit enables the new Color System,
which introduces a new way of implementing and customizing the colors.
If the user has customized some of the old color variables like
$kendo-color-primary,$kendo-body-bg,$kendo-base-bg, etc, they would need to migrate their customizations by following the Migration Guide which can be found in the Progress Design System Docs. - classic: This commit enables the new Color System,
which introduces a new way of implementing and customizing the colors.
If the user has customized some of the old color variables like
$kendo-color-primary,$kendo-body-bg,$kendo-base-bg, etc, they would need to migrate their customizations by following the Migration Guide which can be found in the Progress Design System Docs. - default: This commit enables the new Color System,
which introduces a new way of implementing and customizing the colors.
If the user has customized some of the old color variables like
$kendo-color-primary,$kendo-body-bg,$kendo-base-bg, etc, they would need to migrate their customizations by following the Migration Guide which can be found in the Progress Design System Docs.
v7.2.1
 (3/5/2024)7.2.1 (2024-03-05)
Bug Fixes
- table: table-list group row is misaligned in safari (3b43974)
- html: include mjs files in npm package (eeef577)
- remove k-valid state styles (571a863)
- grid: missing grid filtercell start border (b5992ac)
- html: consolidate grid filter row rendering with a11y spec (4fcce30)
- listbox: transfer actions to use correct icon (182e7fe)
- spreadsheet: file icon overlaps elements in export to pdf popup (79d2879)
- utils: set correct module id in package json (e2d8670)
- gantt: remove gantt splitter double border (05a7ecf)
- fluent: columnmenu should use the same elevation level as popup (b4b4741)
v7.2.0
 (1/22/2024)v7.1.0
 (1/15/2024)7.1.0 (2024-01-15)
Bug Fixes
- floating-label: correct rtl focused label position (0e60745)
- card: content shrinks in horizontal orientation and action buttons with horizontal layout (0ec00d0)
- filemanager: remove content splitter double border (7d939b5)
- filemanager: toolbar shadow not visible in material theme (bb52658)
- drawer: content element is not visible (541dde7)
- show multiselecttree placeholder text (a04fad2)
- common: incorrectly set current time marker width (3a2ac98)
- grid: sizing in grid hierarchy (c71f610)
Features
- bootstrap: implement color system (21e3916)
- classic: implement color system (2e73df4)
- default: implement color system (c985322)
- fluent: implement color system (5a8bbc8)
- gantt: update selectors to match updated rendering (4efe6e5)
- material: implement color system (bfc5c60)
- input: add support for prefix and suffix (f3af6f6)
- input: add valid state styles (980476d)
- add prompt component styles (6c8e441)
- multiselecttree: unifiy input rendering (f23adca)
- notification: unify groups rendering (5749af0)
- timeline: unify Timeline rendering (80395e4)
- card: unify rendering (4923219)
- tooltip: unify rendering (512dd81)
v7.0.2
 (11/6/2023)v7.0.1
 (10/2/2023)7.0.1 (2023-10-02)
Bug Fixes
- grid: dropdown operator height does not match input height (83254f3)
- multiselect: disabled state of chips is not visible in material theme (6ccf535)
- spreadsheet: sheets bar overflows past container dimensions (2c57d43)
- icon: loading animation has incorrect dimensions (a18fac9)
- icon: modifier does not have the correct size (527b301)
v7.0.0
 (9/26/2023)7.0.0 (2023-09-26)
Bug Fixes
- panelbar: use relative position (a616b48)
- scheduler: use relative position (efe968f)
- tabstrip: use relative position (b56a173)
- tilelayout: use relative position (92063bc)
- input: remove background from flat pickers in fluent (23eceaa)
- fab: keep absolute position for FAB (1dcb41b)
- fluent: forward variables in order to be configurable (53a1141)
- fixes custom property typos in fluent (351da75)
Features
- common: introduce indicators helper and move the current time styles there (5987896)
- implement elevation system (132e0a4)
- spreadsheet: implement styles for new design (72cc8ac)
- toolbar: add styles for flat toolbar (545e003)
- dock-manager: add component styles (ed33323)
- pdf-viewer: update styles to match unified rendering (7522c7e)
- detach font icons from the themes (de49a95)
- html-spec: add additional classes to font and svg icons (d40bae5)
BREAKING CHANGES
-
detach font icons from the themes
Starting with the R3 2023 release, the font icons font is no longer bundled in the themes distribution. This is done as part of a series of improvements related to content security policy(CSP). Continue using font icons in your project can still be achieved by loading the font and related styles separately through CDN or directly from the kendo-font-icons package.
- Add a k-font-icon class for all font icons
- Add a k-icon class for all svg icons
-
common: Extracted the current time marker styles
from the Scheduler component and made them component-agnostic. The
$kendo-scheduler-current-time-colorvariable is replaced with the$kendo-current-time-colorvariable.
What's Changed
- chore: add CheckboxGroup & CheckboxItem Component spec by @zhpenkov in https://github.com/telerik/kendo-themes/pull/4667
- chore: add RadioGroup & RadioItem Component spec by @zhpenkov in https://github.com/telerik/kendo-themes/pull/4665
- Spreadsheet v2 by @Juveniel in https://github.com/telerik/kendo-themes/pull/4661
- chore: add floating-label templates by @zhpenkov in https://github.com/telerik/kendo-themes/pull/4647
- chore: enable grouped updates for dependabot by @Juveniel in https://github.com/telerik/kendo-themes/pull/4684
- chore(deps-dev): bump the dev-dependencies group with 16 updates by @dependabot in https://github.com/telerik/kendo-themes/pull/4687
- chore(deps-dev): bump the sass-dependencies group with 2 updates by @dependabot in https://github.com/telerik/kendo-themes/pull/4686
- chore: update lockfileVersion to 3 by @inikolova in https://github.com/telerik/kendo-themes/pull/4668
- chore(html): enable listbox export by @kikostadinov in https://github.com/telerik/kendo-themes/pull/4681
- chore(colorgradient): fix class typo by @kikostadinov in https://github.com/telerik/kendo-themes/pull/4689
- chore(html): remove extra wrappers from textbox templates by @kikostadinov in https://github.com/telerik/kendo-themes/pull/4680
- chore(html): remove states from pager spec by @kikostadinov in https://github.com/telerik/kendo-themes/pull/4673
- chore: CheckBox label position templates by @zhpenkov in https://github.com/telerik/kendo-themes/pull/4672
- chore: RadioButton label position templates by @zhpenkov in https://github.com/telerik/kendo-themes/pull/4671
- fix(fab): keep absolute position for FAB by @magdalenaan in https://github.com/telerik/kendo-themes/pull/4654
- Unify rendering for the PDFViewer by @magdalenaan in https://github.com/telerik/kendo-themes/pull/4629
- chore: update recommended extensions by @Juveniel in https://github.com/telerik/kendo-themes/pull/4693
- Dock manager styles by @epetrow in https://github.com/telerik/kendo-themes/pull/4638
- chore: add toolbar templates by @zhpenkov in https://github.com/telerik/kendo-themes/pull/4651
- fix(fluent): forward variables in order to be configurable by @kspeyanski in https://github.com/telerik/kendo-themes/pull/4696
- chore: add colorpalette templates by @zhpenkov in https://github.com/telerik/kendo-themes/pull/4694
- chore: add colorgradient templates by @zhpenkov in https://github.com/telerik/kendo-themes/pull/4695
- feat: Elevation by @kspeyanski in https://github.com/telerik/kendo-themes/pull/4659
- [Fluent]: Fix custom property typos by @epetrow in https://github.com/telerik/kendo-themes/pull/4706
- chore: regen docs by @epetrow in https://github.com/telerik/kendo-themes/pull/4708
- chore: add colorpicker templates by @zhpenkov in https://github.com/telerik/kendo-themes/pull/4697
- chore: add editor templates by @zhpenkov in https://github.com/telerik/kendo-themes/pull/4699
- chore: add coloreditor templates by @zhpenkov in https://github.com/telerik/kendo-themes/pull/4700
- chore: add listview templates by @zhpenkov in https://github.com/telerik/kendo-themes/pull/4703
- feat(common): introduce indicators helper and move the current time styles there by @JoomFX in https://github.com/telerik/kendo-themes/pull/4670
- chore: add progressbar templates by @zhpenkov in https://github.com/telerik/kendo-themes/pull/4705
- chore: add dialog templates by @zhpenkov in https://github.com/telerik/kendo-themes/pull/4683
- chore(html): add support for more icons in Listbox spec by @zhpenkov in https://github.com/telerik/kendo-themes/pull/4710
- Components pos relative by @Juveniel in https://github.com/telerik/kendo-themes/pull/4633
- chore(html): export progressbar by @zhpenkov in https://github.com/telerik/kendo-themes/pull/4712
- chore(html): export listview by @zhpenkov in https://github.com/telerik/kendo-themes/pull/4713
- feat: detach font icons from the themes by @inikolova in https://github.com/telerik/kendo-themes/pull/4666
Full Changelog: https://github.com/telerik/kendo-themes/compare/v6.7.0...v7.0.0
v6.7.0
 (8/21/2023)6.7.0 (2023-08-21)
Bug Fixes
- chat: fix message-box button position in rtl (6ecdd1b)
- grid: remove placeholder-line explicit width (0ba0185)
- tilelayout: set padding through themes instead of inline (f5c7186)
- floating-label: invalid state displays properly in default theme (dc129a6)
- grid: add focus state styles for the column list item in the column menu (4ed7ca7)
Features
- breadcrumb: add sizes (f4b9aa2)
- html: add filter spec (eb66423)
- html: update form rendering for grid layout (559d295)
- chat: align attachments based on user who attaches them (97796b6)
- chat: rename k-bubble to k-chat-bubble (8ef2553)
- chat: update chat styles to match new rendering (b094e2d)
- html: add chat spec (3aa8e9f)
- html: add listgroup spec (c696dc6)
- html: add scrollview spec (a419dae)
- html: add skeleton helper (bcc944f)
- html: add tilelayout helpers (ddbf11b)
- pager: improve adaptivenes (709653a)
- scrollview: update scrollview styles to match new rendering (b7c5cb6)
Full Changelog: https://github.com/telerik/kendo-themes/compare/v6.6.0...v6.7.0
v6.6.0
 (7/14/2023)v6.5.1
 (7/11/2023)v6.5.0
 (7/3/2023)6.5.0 (2023-05-29)
Bug Fixes
- action-sheet: update adaptive action-sheet font-size to match design (08d3dc9)
- menu: update large menu popup font-size to match design (955e1a1)
- core: k-meta-function-exists breaks the compilation is some specific scenarios (7b9167b)
- list: empty sticky header has a wrong height (23561d4)
- list: incorrect font weight of the group header (cb6ac5c)
- scheduler: wrong border color of the dialog titlebar in the popup edit form (0a9a5ed)
Features
- chip: adjust actions target size (814f466)
- splitter: adjust collapse icon target size (dc37803)
- treeview: adjust interactive elements target size (c45354c)
Full Changelog: https://github.com/telerik/kendo-themes/compare/v6.4.0...v6.5.0
v6.4.0
 (5/29/2023)6.4.0 (2023-05-29)
Bug Fixes
- gantt: use required picker classes for native select (13e9f5d)
- grid: row resizer is not visible with sticky columns (2411983)
- scheduler: use required picker classes for native select (b3a8183)
- scheduler: prevent overwriting ongoing event border (a20f471)
- utils: fix typo to generate k-stroke- utilities (95b165a)
- editor: table tool selection not working in fluent (5c9043f)
- form: fix label position outsite of checkbox container (f10b924)
- grid: add rtl styles for grid with virtualization (93ba668)
- grid: fix grid column menu width (2d62d41)
- html: render empty label only in horizontal form (efdb49b)
- icon: wrong icon size when svg is used with k-icon-modifier (94ea968)
- menu: fix menu rtl styles (831bd80)
- pdf-viewer: wrong cursor in search panel (1139f96)
- remove icons flipping styles in rtl (7f5e54c)
- slider: fix slider rtl styles (99cb32e)
- grid: fix grid grouping template icon size in fluent (84fb58a)
- grid: fix sticky row selection (ce9d338)
- html: uodate icon sizes in components specs and tests (5c70af9)
- list: missing font-family property (92cb702)
- remove icon sizes overrides inside components (184fb82)
- actionsheet: incorrect positioning in rtl mode (1d5987a)
- grid: locked columns header misalignment (964fa03)
- icons: various style fixes for svg icons (1795653)
- input: missing border of the searchbox element (505e380)
- scrollview: fix prev and next icons position in RTL (1c4ebe3)
- swatches: update default-main-dark light and dark variables (c02b6b9)
- calendar: fix th and td cell alignment in infinite adaptive calendar (756bc1f)
- bottom-nav: rename themeColor class to match current convention (7ad724a)
- breadcrumb: adjust styles for the updated rendering (b55226c)
- html: add animation-container and reuse it in tests (5f7d756)
Features
- html: add dropzone component and use it in tests (c34b650)
- spreadsheet: adopt design revision (f2f8a57)
- list: update option-label styles to match design (7b57567)
- utils: add background position and size (1681b4f)
- html: add bottom-nav helper (1ec7eea)
- html: add breadcrumb helper (c47d013)
- html: add color-editor helper (367241b)
- html: add colorgradient helper (c0c299a)
- html: add expansion-panel helper (cb25287)
- html: add html helper for multiselecttree (006014d)
- html: add slider helper (0e2a064)
Full Changelog: https://github.com/telerik/kendo-themes/compare/v6.3.0...v6.4.0
v6.3.0
 (4/17/2023)6.3.0 (2023-04-17)
Bug Fixes
- align how we use module system with the rest of the themes (690aafa)
- chip: close icon not properly aligned (7a0fad8)
- dropdowntree: rename dropdowntree popup class (d755cb1)
- editor: remove editor z-index (11ca05a)
- fab: add styles for icon-wrapper-host element in angular (b07ffe2)
- fluent: add missing color class names (79dd700)
- grid: increase sticky content selector specificity (7780eb7)
- html: add k-picker-solid class to pager select (e536e6b)
- module-system: add missing default and global flags in module system (5ef0aca)
- module-system: remove cursor from component list since it is utils now (6c58be9)
- module-system: use scrollview for component name instead of scroll-view (e7c714d)
- progressbar: fix indeterminate animation (fad4a96)
- spreadsheet: update editor button style (7ed0999)
- swatches: update default-main-dark variables based on latest design (0142fb9)
Features
- fab: extract outline variables (cd2dac4)
- fab: extract size map variable (42e0bb1)
- grid: add row-resizer styles (c7de0cd)
- grid: add selection aggregates styles (34de2a8)
- grid: add tabbed column menu styles (75f28b7)
- html: add fab-items helper (1a99f9c)
- html: add forms helper (9af79bd)
- html: add table helper (9ac6e60)
- module-system: add functionality to verify rendered modules (26b2b07)
- module-system: integrate module system in bootstrap theme (3fa375d)
- module-system: integrate module system in classic theme (51e1ee7)
- module-system: integrate module system in default theme (0e5e949)
- module-system: integrate module system in material theme (0235af2)
- utils: extend the package (472b728)
v6.2.0
 (3/6/2023)6.2.0 (2023-03-06)
Bug Fixes
- actionsheet: update selector to match new rendering (925c27a)
- add missing dependency to utils in all components (3db490b)
- add missing values for flex-grid align, justify and place (2e4867d)
- always use optional flag when extending (d556d20)
- bootstrap swatches do not override inherited primary color (f30ce5b)
- chip: chipmenu popup not properly positioned (d096bfa)
- color-system: use separate steps for color manip in light and dark themes (d6ad992)
- do not increase horizontal padding with large size (656d978)
- dropzone: inner dropzone should not be clickable (5e3517e)
- fluent: adjust lg/xl font sizes (f19ee97)
- grid: replace k-alt selector with k-table-alt-row in grid (a1b38eb)
- icons: size and position svg icons in bootstrap, fluent and material themes (ba05f9d)
- icons: size and position svg icons in components (3bf1e5f)
- icons: update expand/collapse icons aliases (5105dad)
- pivotgrid: fix vertical alignment of pivotgrid cells (0f24a48)
- pivotgrid: scope pivot k-alt style (d9f91a7)
- remove duplicate selector for disabled (f55fb09)
- spreadsheet: remove bottom border from spreadsheet tabstrip (01a16c9)
- stepper: svg icon creates stacking index in rtl (609e5aa)
- tabstrip: icons direction in rtl (7a9a730)
- tabstrip: refactor directional styles for tabstrip and items (b564b31)
- tabstrip: unnest selectors to produce correct output when theme is nested (b827781)
- treelist: no spacing between the elements in the angular treelist filter menu (c496c3a)
- typography: streamline text overflow and text truncate styles (8058111)
- use logical text align (aa958e7)
Features
v6.1.0
 (2/3/2023)6.1.0 (2023-02-03)
Bug Fixes
- bootstrap: use logic from bootstrap dark theme to implement dark swatches (adff721)
- calendar: add missing border when calendar range spans on multiple lines (e818f19)
- calendar: update calendar range hover state to match design (de27d97)
- correctly detect kendo-is-dark-theme variable (2dcb6d8)
- drawer: fix svg-icon misplacement inside drawer items (e5352b0)
- drawer: set correct color for svg-icons in drawer items (e959682)
- dropzone: adjust selector for the new k-icon-wrapper-host element (a5baca5)
- html: hide upload input to allow select button hover (450ecbc)
- interpolate variables and functions when inside url function (eda032d)
- pager: remove grid pager overrides in bootstrap (14280f9)
- pager: remove redundant pager styles (d85c00d)
- scheduler: variables name in ocean-blue swatch (2ab572d)
- spreadsheet: correct position of cell selection (b304913)
- update nouvelle styles using the color system (42c2439)
Features
v6.0.3
 (1/17/2023)6.0.3 (2023-01-17)
Bug Fixes
- button: adjust selector for the new k-icon-wrapper-host element (31b9e62)
- explicitly invoke utils mixin (e9a4976)
- include core and icon styles with explicit mixin invokation (b2e32de)
- organize utils to generate classes upon explicit mixin invocation (27cd43f)
- utils: extend margin/padding/gap maps with backward compatible values (520103e)
- utils: set the font-size property in $kendo-utils to $kendo-font-sizes (dc1377c)
v6.0.2
 (1/16/2023)v6.0.1
 (1/13/2023)v6.0.0
 (1/11/2023)6.0.0 (2023-01-11)
Bug Fixes
- button: fix svg icon size inside icon-button (85429b7)
- calendar: remove redundant today button customization (57c5307)
- dataviz: fluent chart colors should respect series color vars (6aea0d9)
- drawer: update hierarchy function and values (6d1eec0)
- dropdowngrid: add chip dependency (8e43add)
- editor: add styles for table inside editor when not using iframe (4a4b41b)
- editor: remove disabled styling when in readonly mode (b90a255)
- fluent: use json transformer for dart sass (9457acd)
- gantt: add a stronger td selector (1a60837)
- html-spec: appbar json file name (4344578)
- html: unify treeview disabled item rendering (313ae3d)
- html: update today button to use button instead of anchor or span (0612e6e)
- icon: adjust selectors for the new k-icon-wrapper-host element (e6422ee)
- input: wrong svg icon size inside input (4b1a384)
- list: update list styles (c588984)
- material: use editor styles from default theme (605bb47)
- notification: apply box-shadow to notification to match design (d82d9d9)
- nouvelle: update popup styles (98ba8cc)
- popover: popover inner and popover content should inherit border color (9f7413f)
- popover: use correct colors for popover header (ddeb214)
- remove scripts field from published pkgs (27199fa)
- replace slash division with k-math-div function (d1de3b7)
- textarea: native textarea should have a scrollbar by default (b792500)
- timedurationpicker: fix icons dependency (72ba9a0)
- toolbar: remove redundant styles (06c5b42)
- use utility class names from utils package (6445d04)
chore
- appbar: add kendo- prefix (d0a24e6)
- dialog: prefix dialog variables with $kendo- (1634081)
- drawer: prefix vars with $kendo (e295ce5)
- drop IE support (7e0487c)
- editor: prefix editor variables with $kendo- (23c1bb6)
- editor: remove obsolete editor styles (a920070)
- grid: add grouping drop container styles (34bcc02), closes #3776
- icons: update icon sizes and add kendo prefix to vars (c09c4cb)
- listbox: prefix variables with $kendo- (8c6c4eb)
- loader: add kendo- prefix (51e669a)
- notification: prefix variables with $kendo- (93466a0)
- prefix popover variables with
$kendo-(fc9e021) - prefix root variables with
$kendo-(3ca4739) - progressbar: prefix variables with $kendo- (41c1a29)
- remove tilde from import path (1f8951c)
- remove usages of
$spacervariable (32a6899) - rename $spacing to $kendo-spacing (abdff63)
- treelist: prefix variables with $kendo- (61ffde9)
- update listview styles (414e586)
- upload: prefix upload variables with $kendo- (d28ff89)
- use functions and mixins only from theme-core (5d3fcbe)
- window: prefix window variables with $kendo- (bc3a7bd)
Features
- add default ocean blue a11y swatch (8ca8d04)
- button: extract focus ring opacity variable (f6098db)
- dialog: add styles for themeColor property (1653efd)
- dialog: update styles to match updated rendering (bd996b2)
- fab: remove styles for fab shape property (e21f33e)
- forms: add sizes (b9f3c05)
- grid: add grid sm and md sizes (9c197f3)
- grid: update grid header rendering (a1ad23f)
- grid: update styles to support chiplist in grid grouping (d9e5e9f)
- html-spec: add appbar structure (d537306)
- html-spec: add data-table json (7b5bfd1)
- html-spec: add dialog json spec (23b5227)
- html-spec: add dropdownlist structure (b15d45c)
- html-spec: add editor json spec (4d98287)
- html-spec: add forms structure (1012846)
- html-spec: add grid json spec (434fbc4)
- html-spec: add grid-layout structure (e51c51d)
- html-spec: add listbox structure (9209c58)
- html-spec: add listview json (037f522)
- html-spec: add loader structure (bd9bdba)
- html-spec: add notification structure (cb59c8c)
- html-spec: add pager structure (be10cfa)
- html-spec: add progressbar structure (a64a9bb)
- html-spec: add table json (cb48e7d)
- html-spec: add textbox structure (c1d8f3a)
- html-spec: add toolbar structure (30610c9)
- html-spec: add treelist structure (ba9ac25)
- html-spec: add upload json spec (91dfe38)
- html-spec: add window json spec (6418223)
- html: add appbar html helper (fcd8c45)
- html: add chunk-progressbar html helper (16e552e)
- html: add dialog html helper (3521a8d)
- html: add disabled prop to buttongroup (6c60b08)
- html: add editor html helper (e69cb35)
- html: add html helper for toolbar (5373b45)
- html: add listbox html helper (4ffe868)
- html: add listview html component (0f77b2c)
- html: add loader html helper (4009e62)
- html: add notification helper (c71ca2b)
- html: add pager html helper (a3d56b9)
- html: add progressbar html helper (5af1ff1)
- html: add upload html helper (5191a33)
- html: add window html helper (afa1a72)
- icons: use kendo-icons package in themes (0cfacca)
- listbox: wrap listbox actions in k-listbox-actions container (47f6048)
- multiselect: update chip list rendering to comply with accessibility standards (fcab7e5)
- notification: add notification action/s classes (46f5154)
- pager: add pager sizes (adcb88b)
- prefix variables with
$kendo-(e9732c9) - progressbar: expose chunk-progressbar specific classes (48bb6c0)
- progressbar: expose k-progressbar-value class (52e7882)
- toolbar: add toolbar sizes (1db2cb1)
- update chart tooltip animation (4c364a0)
- upload: update upload styles to match new rendering (53dfbd6)
- use focus-indicator mixin for contrast shadows (18560fe)
- use utility class names from utils package (e4ab60e)
- window: add styles for themeColor property (e3bad3d)
- window: update styles to match updated rendering (85ed870)
Reverts
- revert several commits that broke the build (df19412)
BREAKING CHANGES
- Prefix variables with
$kendo-to avoid conflicts with other libraries.
Streamline variable names to use the same naming convention:
- size suffixes are now size infixes.
- add missing medium size
## Misc variables
| Old name | New name |
|---|---|
| $dark-theme | $kendo-is-dark-theme |
| $base-bg | $kendo-base-bg |
| $base-text | $kendo-base-text |
| $base-border | $kendo-base-border |
| $base-gradient | $kendo-base-gradient |
| $link-text | $kendo-link-text |
| $link-hover-text | $kendo-link-hover-text |
| $grid-cols | Removed. See @progress/kendo-theme-utils package for alternatives |
| $grid-rows | Removed. See @progress/kendo-theme-utils package for alternatives |
| $grid-gap | Removed. See @progress/kendo-theme-utils package for alternatives |
## Typography
| Old name | New name |
|---|---|
| $enable-typography | $kendo-enable-typography |
| $font-family | $kendo-font-family |
| $font-family-monospace | $kendo-font-family-monospace |
| N/A | (new) $kendo-font-family-sans-serif |
| $font-size | $kendo-font-size |
| $font-size-xs | $kendo-font-size-xs |
| $font-size-sm | $kendo-font-size-sm |
| $font-size-md | $kendo-font-size-md |
| $font-size-lg | $kendo-font-size-lg |
| $font-size-xl | $kendo-font-size-xl |
| $line-height | $kendo-line-height |
| $line-height-xs | $kendo-line-height-xs |
| $line-height-sm | $kendo-line-height-sm |
| $line-height-md | $kendo-line-height-md |
| $line-height-lg | $kendo-line-height-lg |
| $line-height-xl | $kendo-line-height-xl |
| $line-height-em | $kendo-line-height-em |
| $font-weight-light | $kendo-font-weight-light |
| $font-weight-normal | $kendo-font-weight-normal |
| N/A | (new) $kendo-font-weight-medium |
| N/A | (new) $kendo-font-weight-semibold |
| $font-weight-bold | $kendo-font-weight-bold |
| $letter-spacing | $kendo-letter-spacing |
| $h1-* | $kendo-h1-* |
| $h2-* | $kendo-h2-* |
| $h3-* | $kendo-h3-* |
| $h4-* | $kendo-h4-* |
| $h5-* | $kendo-h5-* |
| $h6-* | $kendo-h6-* |
| $paragraph-* | $kendo-paragraph-* |
| $code-* | $kendo-code-* |
| $pre-* | $kendo-pre-* |
| $display1-* | $kendo-display1-* |
| $display2-* | $kendo-display2-* |
| $display3-* | $kendo-display3-* |
| $display4-* | $kendo-display4-* |
## Action buttons
| Old name | New name |
|---|---|
| $actions-* | $kendo-actions-* |
## Actionsheet
| Old name | New name |
|---|---|
| $actionsheet-* | $kendo-actionsheet-* |
## Adaptive
| Old name | New name |
|---|---|
| $adaptive-* | $kendo-adaptive-* |
## Badge
| Old name | New name |
|---|---|
| $kendo-badge-padding-x-sm | $kendo-badge-sm-padding-x |
| $kendo-badge-padding-y-sm | $kendo-badge-sm-padding-y |
| $kendo-badge-font-size-sm | $kendo-badge-sm-font-size |
| $kendo-badge-line-height-sm | $kendo-badge-sm-line-height |
| $kendo-badge-min-width-sm | $kendo-badge-sm-min-width |
| $kendo-badge-padding-x-md | $kendo-badge-md-padding-x |
| $kendo-badge-padding-y-md | $kendo-badge-md-padding-y |
| $kendo-badge-font-size-md | $kendo-badge-md-font-size |
| $kendo-badge-line-height-md | $kendo-badge-md-line-height |
| $kendo-badge-min-width-md | $kendo-badge-md-min-width |
| $kendo-badge-padding-x-lg | $kendo-badge-lg-padding-x |
| $kendo-badge-padding-y-lg | $kendo-badge-lg-padding-y |
| $kendo-badge-font-size-lg | $kendo-badge-lg-font-size |
| $kendo-badge-line-height-lg | $kendo-badge-lg-line-height |
| $kendo-badge-min-width-lg | $kendo-badge-lg-min-width |
## Bottom navigation
| Old name | New name |
|---|---|
| $bottom-nav-* | $kendo-bottom-nav-* |
## Breadcrumb
| Old name | New name |
|---|---|
| $breadcrumb-* | $kendo-breadcrumb-* |
## Button
| Old name | New name |
|---|---|
| $kendo-button-padding-x-sm | $kendo-button-sm-padding-x |
| $kendo-button-padding-y-sm | $kendo-button-sm-padding-y |
| $kendo-button-font-size-sm | $kendo-button-sm-font-size |
| $kendo-button-line-height-sm | $kendo-button-sm-line-height |
| $kendo-button-calc-size-sm | $kendo-button-sm-calc-size |
| $kendo-button-inner-calc-size-sm | $kendo-button-sm-inner-calc-size |
| $kendo-button-padding-x-md | $kendo-button-md-padding-x |
| $kendo-button-padding-y-md | $kendo-button-md-padding-y |
| $kendo-button-font-size-md | $kendo-button-md-font-size |
| $kendo-button-line-height-md | $kendo-button-md-line-height |
| $kendo-button-calc-size-md | $kendo-button-md-calc-size |
| $kendo-button-inner-calc-size-md | $kendo-button-md-inner-calc-size |
| $kendo-button-padding-x-lg | $kendo-button-lg-padding-x |
| $kendo-button-padding-y-lg | $kendo-button-lg-padding-y |
| $kendo-button-font-size-lg | $kendo-button-lg-font-size |
| $kendo-button-line-height-lg | $kendo-button-lg-line-height |
| $kendo-button-calc-size-lg | $kendo-button-lg-calc-size |
| $kendo-button-inner-calc-size-lg | $kendo-button-lg-inner-calc-size |
## Calendar
| Old name | New name |
|---|---|
| $calendar-* | $kendo-calendar-* |
## Captcha
| Old name | New name |
|---|---|
| $captcha-* | $kendo-captcha-* |
## Card
| Old name | New name |
|---|---|
| $card-* | $kendo-card-* |
## Chat
| Old name | New name |
|---|---|
| $chat-* | $kendo-chat-* |
## Chip
| Old name | New name |
|---|---|
| $kendo-chip-padding-x-sm | $kendo-chip-sm-padding-x |
| $kendo-chip-padding-y-sm | $kendo-chip-sm-padding-y |
| $kendo-chip-font-size-sm | $kendo-chip-sm-font-size |
| $kendo-chip-line-height-sm | $kendo-chip-sm-line-height |
| $kendo-chip-calc-size-sm | $kendo-chip-sm-calc-size |
| $kendo-chip-padding-x-md | $kendo-chip-md-padding-x |
| $kendo-chip-padding-y-md | $kendo-chip-md-padding-y |
| $kendo-chip-font-size-md | $kendo-chip-md-font-size |
| $kendo-chip-line-height-md | $kendo-chip-md-line-height |
| $kendo-chip-calc-size-md | $kendo-chip-md-calc-size |
| $kendo-chip-padding-x-lg | $kendo-chip-lg-padding-x |
| $kendo-chip-padding-y-lg | $kendo-chip-lg-padding-y |
| $kendo-chip-font-size-lg | $kendo-chip-lg-font-size |
| $kendo-chip-line-height-lg | $kendo-chip-lg-line-height |
| $kendo-chip-calc-size-lg | $kendo-chip-lg-calc-size |
## Color editor
| Old name | New name |
|---|---|
| $coloreditor-* | $kendo-color-editor-* |
## Color gradient
| Old name | New name |
|---|---|
| $colorgradient-* | $kendo-color-gradient-* |
## Color palette
| Old name | New name |
|---|---|
| $colorpalette-* | $kendo-color-palette-* |
## Color preview
| Old name | New name |
|---|---|
| $color-preview-* | $kendo-color-preview-* |
## Dataviz
| Old name | New name |
|---|---|
| $series-* | $kendo-series-* |
| $chart-* | $kendo-chart-* |
| $treemap-* | $kendo-treemap-* |
## Date time picker
| Old name | New name |
|---|---|
| $datetime-* | $kendo-datetime-* |
## Draggable
| Old name | New name |
|---|---|
| $drag-clue-* | $kendo-drag-hint-* |
| $drop-hint-* | $kendo-drop-hint-* |
## Dropdown tree
| Old name | New name |
|---|---|
| $dropdowntree-* | $kendo-dropdowntree-* |
## Dropzone
| Old name | New name |
|---|---|
| $dropzone-* | $kendo-dropzone-* |
## Expansion panel
| Old name | New name |
|---|---|
| $expander-* | $kendo-expander-* |
## Floating action button
| Old name | New name |
|---|---|
| $kendo-fab-padding-x-sm | $kendo-fab-sm-padding-x |
| $kendo-fab-padding-y-sm | $kendo-fab-sm-padding-y |
| $kendo-fab-padding-x-md | $kendo-fab-md-padding-x |
| $kendo-fab-padding-y-md | $kendo-fab-md-padding-y |
| $kendo-fab-padding-x-lg | $kendo-fab-lg-padding-x |
| $kendo-fab-padding-y-lg | $kendo-fab-lg-padding-y |
## File manager
| Old name | New name |
|---|---|
| $filemanager-* | $kendo-file-manager-* |
## Filter
| Old name | New name |
|---|---|
| $filter-* | $kendo-filter-* |
## Floating label
| Old name | New name |
|---|---|
| $floating-label-* | $kendo-floating-label-* |
## Form
| Old name | New name |
|---|---|
| $kendo-form-line-height-sm | $kendo-form-sm-line-height |
| $kendo-form-line-height-lg | $kendo-form-lg-line-height |
| $kendo-form-row-spacing-sm | $kendo-form-sm-row-spacing |
| $kendo-form-row-spacing-md | $kendo-form-md-row-spacing |
| $kendo-form-row-spacing-lg | $kendo-form-lg-row-spacing |
## Gantt
| Old name | New name |
|---|---|
| $gantt-* | $kendo-gantt-* |
## Grid
| Old name | New name |
|---|---|
| $kendo-grid-padding-x-sm | $kendo-grid-sm-padding-x |
| $kendo-grid-padding-y-sm | $kendo-grid-sm-padding-y |
| $kendo-grid-header-padding-x-sm | $kendo-grid-sm-header-padding-x |
| $kendo-grid-header-padding-y-sm | $kendo-grid-sm-header-padding-y |
| $kendo-grid-group-header-padding-x-sm | $kendo-grid-sm-group-header-padding-x |
| $kendo-grid-group-header-padding-y-sm | $kendo-grid-sm-group-header-padding-y |
| $kendo-grid-cell-padding-x-sm | $kendo-grid-sm-cell-padding-x |
| $kendo-grid-cell-padding-y-sm | $kendo-grid-sm-cell-padding-y |
| $kendo-grid-filter-cell-padding-x-sm | $kendo-grid-sm-filter-cell-padding-x |
| $kendo-grid-filter-cell-padding-y-sm | $kendo-grid-sm-filter-cell-padding-y |
| $kendo-grid-edit-cell-padding-x-sm | $kendo-grid-sm-edit-cell-padding-x |
| $kendo-grid-edit-cell-padding-y-sm | $kendo-grid-sm-edit-cell-padding-y |
| $kendo-grid-group-dropclue-height-sm | $kendo-grid-sm-group-drop-hint-height |
| $kendo-grid-padding-x-md | $kendo-grid-md-padding-x |
| $kendo-grid-padding-y-md | $kendo-grid-md-padding-y |
| $kendo-grid-header-padding-x-md | $kendo-grid-md-header-padding-x |
| $kendo-grid-header-padding-y-md | $kendo-grid-md-header-padding-y |
| $kendo-grid-group-header-padding-x-md | $kendo-grid-md-group-header-padding-x |
| $kendo-grid-group-header-padding-y-md | $kendo-grid-md-group-header-padding-y |
| $kendo-grid-cell-padding-x-md | $kendo-grid-md-cell-padding-x |
| $kendo-grid-cell-padding-y-md | $kendo-grid-md-cell-padding-y |
| $kendo-grid-filter-cell-padding-x-md | $kendo-grid-md-filter-cell-padding-x |
| $kendo-grid-filter-cell-padding-y-md | $kendo-grid-md-filter-cell-padding-y |
| $kendo-grid-edit-cell-padding-x-md | $kendo-grid-md-edit-cell-padding-x |
| $kendo-grid-edit-cell-padding-y-md | $kendo-grid-md-edit-cell-padding-y |
| $kendo-grid-group-dropclue-height-md | $kendo-grid-md-group-drop-hint-height |
| $kendo-grid-padding-x-lg | $kendo-grid-lg-padding-x |
| $kendo-grid-padding-y-lg | $kendo-grid-lg-padding-y |
| $kendo-grid-header-padding-x-lg | $kendo-grid-lg-header-padding-x |
| $kendo-grid-header-padding-y-lg | $kendo-grid-lg-header-padding-y |
| $kendo-grid-group-header-padding-x-lg | $kendo-grid-lg-group-header-padding-x |
| $kendo-grid-group-header-padding-y-lg | $kendo-grid-lg-group-header-padding-y |
| $kendo-grid-cell-padding-x-lg | $kendo-grid-lg-cell-padding-x |
| $kendo-grid-cell-padding-y-lg | $kendo-grid-lg-cell-padding-y |
| $kendo-grid-filter-cell-padding-x-lg | $kendo-grid-lg-filter-cell-padding-x |
| $kendo-grid-filter-cell-padding-y-lg | $kendo-grid-lg-filter-cell-padding-y |
| $kendo-grid-edit-cell-padding-x-lg | $kendo-grid-lg-edit-cell-padding-x |
| $kendo-grid-edit-cell-padding-y-lg | $kendo-grid-lg-edit-cell-padding-y |
| $kendo-grid-group-dropclue-height-lg | $kendo-grid-lg-group-drop-hint-height |
## Image Editor
| Old name | New name |
|---|---|
| $imageeditor-* | $kendo-image-editor-* |
## Input
| Old name | New name |
|---|---|
| $kendo-input-padding-x-sm | $kendo-input-sm-padding-x |
| $kendo-input-padding-y-sm | $kendo-input-sm-padding-y |
| $kendo-input-font-size-sm | $kendo-input-sm-font-size |
| $kendo-input-line-height-sm | $kendo-input-sm-line-height |
| $kendo-input-padding-x-md | $kendo-input-md-padding-x |
| $kendo-input-padding-y-md | $kendo-input-md-padding-y |
| $kendo-input-font-size-md | $kendo-input-md-font-size |
| $kendo-input-line-height-md | $kendo-input-md-line-height |
| $kendo-input-padding-x-lg | $kendo-input-lg-padding-x |
| $kendo-input-padding-y-lg | $kendo-input-lg-padding-y |
| $kendo-input-font-size-lg | $kendo-input-lg-font-size |
| $kendo-input-line-height-lg | $kendo-input-lg-line-height |
## List
| Old name | New name |
|---|---|
| $kendo-list-font-size-sm | $kendo-list-sm-font-size |
| $kendo-list-line-height-sm | $kendo-list-sm-line-height |
| $kendo-list-header-padding-x-sm | $kendo-list-sm-header-padding-x |
| $kendo-list-header-padding-y-sm | $kendo-list-sm-header-padding-y |
| $kendo-list-header-font-size-sm | $kendo-list-sm-header-font-size |
| $kendo-list-header-line-height-sm | $kendo-list-sm-header-line-height |
| $kendo-list-item-padding-x-sm | $kendo-list-sm-item-padding-x |
| $kendo-list-item-padding-y-sm | $kendo-list-sm-item-padding-y |
| $kendo-list-item-font-size-sm | $kendo-list-sm-item-font-size |
| $kendo-list-item-line-height-sm | $kendo-list-sm-item-line-height |
| $kendo-list-group-item-padding-x-sm | $kendo-list-sm-group-item-padding-x |
| $kendo-list-group-item-padding-y-sm | $kendo-list-sm-group-item-padding-y |
| $kendo-list-group-item-font-size-sm | $kendo-list-sm-group-item-font-size |
| $kendo-list-group-item-line-height-sm | $kendo-list-sm-group-item-line-height |
| $kendo-list-font-size-md | $kendo-list-md-font-size |
| $kendo-list-line-height-md | $kendo-list-md-line-height |
| $kendo-list-header-padding-x-md | $kendo-list-md-header-padding-x |
| $kendo-list-header-padding-y-md | $kendo-list-md-header-padding-y |
| $kendo-list-header-font-size-md | $kendo-list-md-header-font-size |
| $kendo-list-header-line-height-md | $kendo-list-md-header-line-height |
| $kendo-list-item-padding-x-md | $kendo-list-md-item-padding-x |
| $kendo-list-item-padding-y-md | $kendo-list-md-item-padding-y |
| $kendo-list-item-font-size-md | $kendo-list-md-item-font-size |
| $kendo-list-item-line-height-md | $kendo-list-md-item-line-height |
| $kendo-list-group-item-padding-x-md | $kendo-list-md-group-item-padding-x |
| $kendo-list-group-item-padding-y-md | $kendo-list-md-group-item-padding-y |
| $kendo-list-group-item-font-size-md | $kendo-list-md-group-item-font-size |
| $kendo-list-group-item-line-height-md | $kendo-list-md-group-item-line-height |
| $kendo-list-font-size-lg | $kendo-list-lg-font-size |
| $kendo-list-line-height-lg | $kendo-list-lg-line-height |
| $kendo-list-header-padding-x-lg | $kendo-list-lg-header-padding-x |
| $kendo-list-header-padding-y-lg | $kendo-list-lg-header-padding-y |
| $kendo-list-header-font-size-lg | $kendo-list-lg-header-font-size |
| $kendo-list-header-line-height-lg | $kendo-list-lg-header-line-height |
| $kendo-list-item-padding-x-lg | $kendo-list-lg-item-padding-x |
| $kendo-list-item-padding-y-lg | $kendo-list-lg-item-padding-y |
| $kendo-list-item-font-size-lg | $kendo-list-lg-item-font-size |
| $kendo-list-item-line-height-lg | $kendo-list-lg-item-line-height |
| $kendo-list-group-item-padding-x-lg | $kendo-list-lg-group-item-padding-x |
| $kendo-list-group-item-padding-y-lg | $kendo-list-lg-group-item-padding-y |
| $kendo-list-group-item-font-size-lg | $kendo-list-lg-group-item-font-size |
| $kendo-list-group-item-line-height-lg | $kendo-list-lg-group-item-line-height |
## Listgroup
| Old name | New name |
|---|---|
| $listgroup-* | $kendo-listgroup-* |
## Loader
| Old name | New name |
|---|---|
| $kendo-loader-segment-size-sm | $kendo-loader-sm-segment-size |
| $kendo-loader-padding-sm | $kendo-loader-sm-padding |
| $kendo-loader-spinner-3-width-sm | $kendo-loader-sm-spinner-3-width |
| $kendo-loader-spinner-3-height-sm | $kendo-loader-sm-spinner-3-height |
| $kendo-loader-spinner-4-width-sm | $kendo-loader-sm-spinner-4-width |
| $kendo-loader-spinner-4-height-sm | $kendo-loader-sm-spinner-4-height |
| $kendo-loader-container-padding-sm | $kendo-loader-sm-container-padding |
| $kendo-loader-container-gap-sm | $kendo-loader-sm-container-gap |
| $kendo-loader-container-font-size-sm | $kendo-loader-sm-container-font-size |
| $kendo-loader-segment-size-md | $kendo-loader-md-segment-size |
| $kendo-loader-padding-md | $kendo-loader-md-padding |
| $kendo-loader-spinner-3-width-md | $kendo-loader-md-spinner-3-width |
| $kendo-loader-spinner-3-height-md | $kendo-loader-md-spinner-3-height |
| $kendo-loader-spinner-4-width-md | $kendo-loader-md-spinner-4-width |
| $kendo-loader-spinner-4-height-md | $kendo-loader-md-spinner-4-height |
| $kendo-loader-container-padding-md | $kendo-loader-md-container-padding |
| $kendo-loader-container-gap-md | $kendo-loader-md-container-gap |
| $kendo-loader-container-font-size-md | $kendo-loader-md-container-font-size |
| $kendo-loader-segment-size-lg | $kendo-loader-lg-segment-size |
| $kendo-loader-padding-lg | $kendo-loader-lg-padding |
| $kendo-loader-spinner-3-width-lg | $kendo-loader-lg-spinner-3-width |
| $kendo-loader-spinner-3-height-lg | $kendo-loader-lg-spinner-3-height |
| $kendo-loader-spinner-4-width-lg | $kendo-loader-lg-spinner-4-width |
| $kendo-loader-spinner-4-height-lg | $kendo-loader-lg-spinner-4-height |
| $kendo-loader-container-padding-lg | $kendo-loader-lg-container-padding |
| $kendo-loader-container-gap-lg | $kendo-loader-lg-container-gap |
| $kendo-loader-container-font-size-lg | $kendo-loader-lg-container-font-size |
## Map
| Old name | New name |
|---|---|
| $map-* | $kendo-map-* |
## Media player
| Old name | New name |
|---|---|
| $mediaplayer-* | $kendo-media-player-* |
## Menu
| Old name | New name |
|---|---|
| $menu-* | $kendo-menu-* |
| $kendo-menu-popup-font-size-sm | $kendo-menu-sm-popup-font-size |
| $kendo-menu-popup-line-height-sm | $kendo-menu-sm-popup-line-height |
| $kendo-menu-popup-item-padding-x-sm | $kendo-menu-sm-popup-item-padding-x |
| $kendo-menu-popup-item-padding-y-sm | $kendo-menu-sm-popup-item-padding-y |
| $kendo-menu-popup-item-padding-end-sm | $kendo-menu-sm-popup-item-padding-end |
| $kendo-menu-popup-item-icon-margin-start-sm | $kendo-menu-sm-popup-item-icon-margin-start |
| $kendo-menu-popup-item-icon-margin-end-sm | $kendo-menu-sm-popup-item-icon-margin-end |
| $kendo-menu-popup-font-size-md | $kendo-menu-md-popup-font-size |
| $kendo-menu-popup-line-height-md | $kendo-menu-md-popup-line-height |
| $kendo-menu-popup-item-padding-x-md | $kendo-menu-md-popup-item-padding-x |
| $kendo-menu-popup-item-padding-y-md | $kendo-menu-md-popup-item-padding-y |
| $kendo-menu-popup-item-padding-end-md | $kendo-menu-md-popup-item-padding-end |
| $kendo-menu-popup-item-icon-margin-start-md | $kendo-menu-md-popup-item-icon-margin-start |
| $kendo-menu-popup-item-icon-margin-end-md | $kendo-menu-md-popup-item-icon-margin-end |
| $kendo-menu-popup-font-size-lg | $kendo-menu-lg-popup-font-size |
| $kendo-menu-popup-line-height-lg | $kendo-menu-lg-popup-line-height |
| $kendo-menu-popup-item-padding-x-lg | $kendo-menu-lg-popup-item-padding-x |
| $kendo-menu-popup-item-padding-y-lg | $kendo-menu-lg-popup-item-padding-y |
| $kendo-menu-popup-item-padding-end-lg | $kendo-menu-lg-popup-item-padding-end |
| $kendo-menu-popup-item-icon-margin-start-lg | $kendo-menu-lg-popup-item-icon-margin-start |
| $kendo-menu-popup-item-icon-margin-end-lg | $kendo-menu-lg-popup-item-icon-margin-end |
## Message box
| Old name | New name |
|---|---|
| $message-box-* | $kendo-message-box-* |
## Orgchart
| Old name | New name |
|---|---|
| $orgchart-* | $kendo-orgchart-* |
## Overlay
| Old name | New name |
|---|---|
| $overlay-* | $kendo-overlay-* |
## Pager
| Old name | New name |
|---|---|
| $kendo-pager-padding-x-sm | $kendo-pager-sm-padding-x |
| $kendo-pager-padding-y-sm | $kendo-pager-sm-padding-y |
| $kendo-pager-item-min-width-sm | $kendo-pager-sm-item-min-width |
| $kendo-pager-item-group-spacing-sm | $kendo-pager-sm-item-group-spacing |
| $kendo-pager-dropdown-width-sm | $kendo-pager-sm-dropdown-width |
| $kendo-pager-padding-x-md | $kendo-pager-md-padding-x |
| $kendo-pager-padding-y-md | $kendo-pager-md-padding-y |
| $kendo-pager-item-min-width-md | $kendo-pager-md-item-min-width |
| $kendo-pager-item-group-spacing-md | $kendo-pager-md-item-group-spacing |
| $kendo-pager-dropdown-width-md | $kendo-pager-md-dropdown-width |
| $kendo-pager-padding-x-lg | $kendo-pager-lg-padding-x |
| $kendo-pager-padding-y-lg | $kendo-pager-lg-padding-y |
| $kendo-pager-item-min-width-lg | $kendo-pager-lg-item-min-width |
| $kendo-pager-item-group-spacing-lg | $kendo-pager-lg-item-group-spacing |
| $kendo-pager-dropdown-width-lg | $kendo-pager-lg-dropdown-width |
## Panelbar
| Old name | New name |
|---|---|
| $panelbar-* | $kendo-panelbar-* |
## PDF viewer
| Old name | New name |
|---|---|
| $pdf-viewer-* | $kendo-pdf-viewer-* |
## Pivotgrid
| Old name | New name |
|---|---|
| $pivotgrid-* | $kendo-pivotgrid-* |
## Popup
| Old name | New name |
|---|---|
| $popup-* | $kendo-popup-* |
## Rating
| Old name | New name |
|---|---|
| $rating-* | $kendo-rating-* |
## Scheduler
| Old name | New name |
|---|---|
| $scheduler-* | $kendo-scheduler-* |
## Scrollview
| Old name | New name |
|---|---|
| $scrollview-* | $kendo-scrollview-* |
## Signature
| Old name | New name |
|---|---|
| $kendo-signature-padding-x-sm | $kendo-signature-sm-padding-x |
| $kendo-signature-padding-y-sm | $kendo-signature-sm-padding-y |
| $kendo-signature-line-height-sm | $kendo-signature-sm-line-height |
| $kendo-signature-padding-x-md | $kendo-signature-md-padding-x |
| $kendo-signature-padding-y-md | $kendo-signature-md-padding-y |
| $kendo-signature-line-height-md | $kendo-signature-md-line-height |
| $kendo-signature-padding-x-lg | $kendo-signature-lg-padding-x |
| $kendo-signature-padding-y-lg | $kendo-signature-lg-padding-y |
| $kendo-signature-line-height-lg | $kendo-signature-lg-line-height |
## Skeleton
| Old name | New name |
|---|---|
| $skeleton-* | $kendo-skeleton-* |
## Slider
| Old name | New name |
|---|---|
| $slider-* | $kendo-slider-* |
## Split button
| Old name | New name |
|---|---|
| $kendo-split-button-arrow-padding-x-sm | $kendo-split-button-sm-arrow-padding-x |
| $kendo-split-button-arrow-padding-y-sm | $kendo-split-button-sm-arrow-padding-y |
| $kendo-split-button-arrow-padding-x-md | $kendo-split-button-md-arrow-padding-x |
| $kendo-split-button-arrow-padding-y-md | $kendo-split-button-md-arrow-padding-y |
| $kendo-split-button-arrow-padding-x-lg | $kendo-split-button-lg-arrow-padding-x |
| $kendo-split-button-arrow-padding-y-lg | $kendo-split-button-lg-arrow-padding-y |
## Splitter
| Old name | New name |
|---|---|
| $splitter-* | $kendo-splitter-* |
| $splitbar-* | $kendo-splitbar-* |
## Spreadsheet
| Old name | New name |
|---|---|
| $spreadsheet-* | $kendo-spreadsheet-* |
## Stepper
| Old name | New name |
|---|---|
| $stepper-* | $kendo-stepper-* |
## Table
| Old name | New name |
|---|---|
| $kendo-table-cell-padding-x-sm | $kendo-table-sm-cell-padding-x |
| $kendo-table-cell-padding-y-sm | $kendo-table-sm-cell-padding-y |
| $kendo-table-cell-padding-x-md | $kendo-table-md-cell-padding-x |
| $kendo-table-cell-padding-y-md | $kendo-table-md-cell-padding-y |
| $kendo-table-cell-padding-x-lg | $kendo-table-lg-cell-padding-x |
| $kendo-table-cell-padding-y-lg | $kendo-table-lg-cell-padding-y |
## Tabstrip
| Old name | New name |
|---|---|
| $tabstrip-* | $kendo-tabstrip-* |
## Taskboard
| Old name | New name |
|---|---|
| $taskboard-* | $kendo-taskboard-* |
## Tile layout
| Old name | New name |
|---|---|
| $tilelayout-* | $kendo-tile-layout-* |
## Timeline
| Old name | New name |
|---|---|
| $timeline-* | $kendo-timeline-* |
## Time selector
| Old name | New name |
|---|---|
| $time-selector-* | $kendo-time-selector-* |
## Toolbar
| Old name | New name |
|---|---|
| $kendo-toolbar-padding-x-sm | $kendo-toolbar-sm-padding-x |
| $kendo-toolbar-padding-y-sm | $kendo-toolbar-sm-padding-y |
| $kendo-toolbar-spacing-sm | $kendo-toolbar-sm-spacing |
| $kendo-toolbar-padding-x-md | $kendo-toolbar-md-padding-x |
| $kendo-toolbar-padding-y-md | $kendo-toolbar-md-padding-y |
| $kendo-toolbar-spacing-md | $kendo-toolbar-md-spacing |
| $kendo-toolbar-padding-x-lg | $kendo-toolbar-lg-padding-x |
| $kendo-toolbar-padding-y-lg | $kendo-toolbar-lg-padding-y |
| $kendo-toolbar-spacing-lg | $kendo-toolbar-lg-spacing |
## Tooltip
| Old name | New name |
|---|---|
| $tooltip-* | $kendo-tooltip-* |
## Treeview
| Old name | New name |
|---|---|
| $kendo-treeview-font-size-sm | $kendo-treeview-sm-font-size |
| $kendo-treeview-line-height-sm | $kendo-treeview-sm-line-height |
| $kendo-treeview-item-padding-x-sm | $kendo-treeview-sm-item-padding-x |
| $kendo-treeview-item-padding-y-sm | $kendo-treeview-sm-item-padding-y |
| $kendo-treeview-font-size-md | $kendo-treeview-md-font-size |
| $kendo-treeview-line-height-md | $kendo-treeview-md-line-height |
| $kendo-treeview-item-padding-x-md | $kendo-treeview-md-item-padding-x |
| $kendo-treeview-item-padding-y-md | $kendo-treeview-md-item-padding-y |
| $kendo-treeview-font-size-lg | $kendo-treeview-lg-font-size |
| $kendo-treeview-line-height-lg | $kendo-treeview-lg-line-height |
| $kendo-treeview-item-padding-x-lg | $kendo-treeview-lg-item-padding-x |
| $kendo-treeview-item-padding-y-lg | $kendo-treeview-lg-item-padding-y |
## Wizard
| Old name | New name |
|---|---|
| $wizard-* | $kendo-wizard-* |
- icons: Added kendo prefix to all icon variables:
Change variable names from $icon-* to $kendo-icon-*.
-
icons: Icons font sizes are updated as follows:
-
$kendo-icon-size-xs -> 12px (0.75 * $kendo-icon-size)
-
$kendo-icon-size-sm -> 14px (0.875 * $kendo-icon-size)
-
$kendo-icon-size-md -> 16px ($kendo-icon-size)
-
$kendo-icon-size-lg -> 20px (1.25 * $kendo-icon-size)
-
$kendo-icon-size-xl -> 24px (1.5 * $kendo-icon-size)
-
$kendo-icon-size-xxl -> 32px (2 * $kendo-icon-size)
-
$kendo-icon-size-xxxl -> 48px (3 * $kendo-icon-size)
-
icons: icons are now consumed from kendo-icons package and used in default, bootstrap, material and classic themes
-
Use utility class names from utils package
Previously, the utility classes were defined in the default theme and were consumed from the derived themes.
While no class names were changed, we did try to move to a more consistent
naming convention for the class names. For example, the class name for
display: flex was changed from k-display-flex to k-d-flex, as it's shorter
and unambiguous. Of course, the old class names are still supported and
will be removed in the next major version.
- Remove usages of
$spacervariable
The $spacer variable is removed in favour of spacing map, which yields
consistent spacing values across all components.
- Rename popover variables
| Old name | New name |
|---|---|
$popover-border-width | $kendo-popover-border-width |
$popover-border-style | $kendo-popover-border-style |
$popover-border-radius | $kendo-popover-border-radius |
$popover-font-size | $kendo-popover-font-size |
$popover-font-family | $kendo-popover-font-family |
$popover-line-height | $kendo-popover-line-height |
$popover-bg | $kendo-popover-bg |
$popover-text | $kendo-popover-text |
$popover-border | $kendo-popover-border |
$popover-shadow | $kendo-popover-shadow |
$popover-header-padding-y | $kendo-popover-header-padding-y |
$popover-header-padding-x | $kendo-popover-header-padding-x |
$popover-header-border-width | $kendo-popover-header-border-width |
$popover-header-border-style | $kendo-popover-header-border-style |
$popover-header-bg | $kendo-popover-header-bg |
$popover-header-text | $kendo-popover-header-text |
$popover-header-border | $kendo-popover-header-border |
$popover-body-padding-y | $kendo-popover-body-padding-y |
$popover-body-padding-x | $kendo-popover-body-padding-x |
$popover-actions-border-width | $kendo-popover-actions-border-width |
$popover-callout-width | $kendo-popover-callout-width |
$popover-callout-height | $kendo-popover-callout-height |
$popover-callout-border-width | $kendo-popover-callout-border-width |
$popover-callout-border-style | $kendo-popover-callout-border-style |
$popover-callout-bg | $kendo-popover-callout-bg |
$popover-callout-border | $kendo-popover-callout-border |
- Remove deprecated
$accentand$accent-contrastvariables
Use $kendo-color-primary and $kendo-color-primary-contrast instead.
- Remove redundant styling modules
The styling module was already included as part of the utils module.
- Remove redundant cursor module
The cursor module was already included as part of theme utils.
- Merge placeholder line with skeleton
The styles for the placeholder line were merged with the skeleton styles. As a result, the placeholder line is lightly darker and has rounded corners. In a future release, the placeholder line will be removed in favor of the skeleton.
- Rename root variables
This commit introduces a consistent naming convention for root variables:
- Most root variables are prefixed with
$kendo-. - If a variable is a color, it's infixed with
-color-. - If a variable had
-hovered-infix, it's now-hover-. - If a variable had
-focused-infix, it's now-focus-. - If a variable had size infix and then direction, they are reversed
Here is a list of changes:
| Old name | New name |
|---|---|
$enable-rounded | $kendo-enable-rounded |
$enable-shadows | $kendo-enable-shadows |
$enable-gradients | $kendo-enable-gradients |
$enable-transitions | $kendo-enable-transitions |
$enable-flex-classes | Removed (unused) |
$enable-grid-classes | Removed (unused) |
$use-calc-badge-size | Removed (unused) |
$use-input-button-width | $kendo-use-input-button-width |
$use-input-spinner-width | $kendo-use-input-spinner-width |
$use-input-spinner-icon-offset | Removed (unused) |
$use-picker-select-width | Removed. Use $kendo-use-input-button-width |
$padding-x | $kendo-padding-x |
$padding-y | $kendo-padding-y |
$padding-x-sm | $kendo-padding-sm-x |
$padding-y-sm | $kendo-padding-sm-y |
| N/A | New. $kendo-padding-md-x |
| N/A | New. $kendo-padding-md-y |
$padding-x-lg | $kendo-padding-lg-x |
$padding-y-lg | $kendo-padding-lg-y |
$panel-padding-x | Removed. Variable was not used consistently, so the usages were replaced with spacing map |
$panel-padding-y | Removed. Variable was not used consistently, so the usages were replaced with spacing map |
$header-padding-x | Removed. Variable was not used consistently, so the usages were replaced with spacing map |
$header-padding-y | Removed. Variable was not used consistently, so the usages were replaced with spacing map |
$nav-item-margin | Removed. Variable was not used consistently, so the usages were replaced with spacing map |
$nav-item-padding-x | Removed. Variable was not used consistently, so the usages were replaced with spacing map |
$nav-item-padding-y | Removed. Variable was not used consistently, so the usages were replaced with spacing map |
$zindex-popup | $kendo-zindex-popup |
$zindex-window | $kendo-zindex-window |
$zindex-loading | $kendo-zindex-loading |
$black | $kendo-color-black |
$white | $kendo-color-white |
$rgba-transparent | $kendo-color-rgba-transparent |
$gradient-transparent-to-black | $kendo-gradient-transparent-to-black |
$gradient-transparent-to-white | $kendo-gradient-transparent-to-white |
$gradient-black-to-transparent | $kendo-gradient-black-to-transparent |
$gradient-white-to-transparent | $kendo-gradient-white-to-transparent |
$accent | Removed. Use $kendo-color-primary |
$accent-contrast | Removed. Use $kendo-color-primary-contrast |
$primary | $kendo-color-primary |
$primary-lighter | $kendo-color-primary-lighter |
$primary-darker | $kendo-color-primary-darker |
$primary-contrast | $kendo-color-primary-contrast |
$secondary | $kendo-color-secondary |
$secondary-lighter | $kendo-color-secondary-lighter |
$secondary-darker | $kendo-color-secondary-darker |
$secondary-contrast | $kendo-color-secondary-contrast |
$tertiary | $kendo-color-tertiary |
$tertiary-lighter | $kendo-color-tertiary-lighter |
$tertiary-darker | $kendo-color-tertiary-darker |
$tertiary-contrast | $kendo-color-tertiary-contrast |
$info | $kendo-color-info |
$info-lighter | $kendo-color-info-lighter |
$info-darker | $kendo-color-info-darker |
$success | $kendo-color-success |
$success-lighter | $kendo-color-success-lighter |
$success-darker | $kendo-color-success-darker |
$warning | $kendo-color-warning |
$warning-lighter | $kendo-color-warning-lighter |
$warning-darker | $kendo-color-warning-darker |
$error | $kendo-color-error |
$error-lighter | $kendo-color-error-lighter |
$error-darker | $kendo-color-error-darker |
$dark | $kendo-color-dark |
$light | $kendo-color-light |
$inverse | $kendo-color-inverse |
$cursors | Removed (redundant) |
$body-bg | $kendo-body-bg |
$body-text | $kendo-body-text |
$subtle-text | $kendo-subtle-text |
$app-bg | $kendo-app-bg |
$app-text | $kendo-app-text |
$app-border | $kendo-app-border |
$component-bg | $kendo-component-bg |
$component-text | $kendo-component-text |
$component-border | $kendo-component-border |
$header-bg | $kendo-component-header-bg |
$header-text | $kendo-component-header-text |
$header-border | $kendo-component-header-border |
$header-gradient | $kendo-component-header-gradient |
$hovered-bg | $kendo-hover-bg |
$hovered-text | $kendo-hover-text |
$hovered-border | $kendo-hover-border |
$hovered-gradient | $kendo-hover-gradient |
$selected-bg | $kendo-selected-bg |
$selected-text | $kendo-selected-text |
$selected-border | $kendo-selected-border |
$selected-gradient | $kendo-selected-gradient |
$focused-shadow | $kendo-focus-shadow |
$primary-focused-shadow | Removed (unused) |
$disabled-bg | $kendo-disabled-bg |
$disabled-text | $kendo-disabled-text |
$disabled-border | $kendo-disabled-border |
$disabled-gradient | $kendo-disabled-gradient |
$disabled-filter | $kendo-disabled-filter |
$disabled-opacity | $kendo-disabled-opacity |
$disabled-styling | $kendo-disabled-styling |
$panel-bg | Removed. Use $kendo-component-bg |
$panel-text | Removed. Use $kendo-component-text |
$panel-border | Removed. Use $kendo-component-border |
$grouping-header-bg | Removed. Use $kendo-component-header-bg |
$grouping-header-text | Removed. Use $kendo-component-header-text |
$grouping-header-border | Removed. Use $kendo-component-header-border |
$frozen-grouping-header-text | Removed (unused) |
$frozen-grouping-header-border-width | Removed (unused) |
$placeholder-line-width | Removed (unused) |
$placeholder-line-height | Removed (unused) |
$placeholder-line-bg | Removed. $skeleton-item-bg |
$invalid-bg | $kendo-invalid-bg |
$invalid-text | $kendo-invalid-text |
$invalid-border | $kendo-invalid-border |
$invalid-shadow | $kendo-invalid-shadow |
$transition | $kendo-transition |
$breadcrumb-link-hovered-bg | $breadcrumb-link-hover-bg |
$breadcrumb-link-hovered-text | $breadcrumb-link-hover-text |
$breadcrumb-link-hovered-border | $breadcrumb-link-hover-border |
$breadcrumb-link-focused-bg | $breadcrumb-link-focus-bg |
$breadcrumb-link-focused-text | $breadcrumb-link-focus-text |
$breadcrumb-link-focused-border | $breadcrumb-link-focus-border |
$breadcrumb-link-focused-shadow | $breadcrumb-link-focus-shadow |
$breadcrumb-root-link-hovered-bg | $breadcrumb-root-link-hover-bg |
$breadcrumb-root-link-hovered-text | $breadcrumb-root-link-hover-text |
$breadcrumb-root-link-hovered-border | $breadcrumb-root-link-hover-border |
$breadcrumb-root-link-focused-bg | $breadcrumb-root-link-focus-bg |
$breadcrumb-root-link-focused-text | $breadcrumb-root-link-focus-text |
$breadcrumb-root-link-focused-border | $breadcrumb-root-link-focus-border |
$breadcrumb-root-link-focused-shadow | $breadcrumb-root-link-focus-shadow |
$breadcrumb-focused-shadow | $breadcrumb-focus-shadow |
$calendar-cell-focused-shadow | $calendar-cell-focus-shadow |
$kendo-drawer-scrollbar-hovered-color | $kendo-drawer-scrollbar-hover-color |
$kendo-drawer-hovered-bg | $kendo-drawer-hover-bg |
$kendo-drawer-hovered-text | $kendo-drawer-hover-text |
$kendo-drawer-focused-bg | $kendo-drawer-focus-bg |
$kendo-drawer-focused-text | $kendo-drawer-focus-text |
$dropdownlist-* | Removed (unused) |
$expander-header-focused-bg | $expander-header-focus-bg |
$expander-header-focused-shadow | $expander-header-focus-shadow |
$kendo-grid-hovered-bg | $kendo-grid-hover-bg |
$kendo-grid-hovered-text | $kendo-grid-hover-text |
$kendo-grid-hovered-border | $kendo-grid-hover-border |
$kendo-grid-focused-shadow | $kendo-grid-focus-shadow |
$kendo-grid-sticky-footer-hovered-bg | $kendo-grid-sticky-footer-hover-bg |
$kendo-grid-sticky-hovered-bg | $kendo-grid-sticky-hover-bg |
$kendo-grid-sticky-selected-hovered-bg | $kendo-grid-sticky-selected-hover-bg |
$panelbar-header-hovered-bg | $panelbar-header-hover-bg |
$panelbar-header-hovered-text | $panelbar-header-hover-text |
$panelbar-header-hovered-border | $panelbar-header-hover-border |
$panelbar-header-hovered-gradient | $panelbar-header-hover-gradient |
$panelbar-header-focused-bg | $panelbar-header-focus-bg |
$panelbar-header-focused-text | $panelbar-header-focus-text |
$panelbar-header-focused-border | $panelbar-header-focus-border |
$panelbar-header-focused-gradient | $panelbar-header-focus-gradient |
$panelbar-header-focused-shadow | $panelbar-header-focus-shadow |
$panelbar-header-hovered-focused-bg | $panelbar-header-hover-focus-bg |
$panelbar-header-hovered-focused-text | $panelbar-header-hover-focus-text |
$panelbar-header-hovered-focused-border | $panelbar-header-hover-focus-border |
$panelbar-header-hovered-focused-gradient | $panelbar-header-hover-focus-gradient |
$panelbar-header-selected-hovered-bg | $panelbar-header-selected-hover-bg |
$panelbar-header-selected-hovered-text | $panelbar-header-selected-hover-text |
$panelbar-header-selected-hovered-border | $panelbar-header-selected-hover-border |
$panelbar-header-selected-hovered-gradient | $panelbar-header-selected-hover-gradient |
$panelbar-header-selected-focused-bg | $panelbar-header-selected-focus-bg |
$panelbar-header-selected-focused-text | $panelbar-header-selected-focus-text |
$panelbar-header-selected-focused-border | $panelbar-header-selected-focus-border |
$panelbar-header-selected-focused-gradient | $panelbar-header-selected-focus-gradient |
$panelbar-header-selected-hovered-focused-bg | $panelbar-header-selected-hover-focus-bg |
$panelbar-header-selected-hovered-focused-text | $panelbar-header-selected-hover-focus-text |
$panelbar-header-selected-hovered-focused-border | $panelbar-header-selected-hover-focus-border |
$panelbar-header-selected-hovered-focused-gradient | $panelbar-header-selected-hover-focus-gradient |
$panelbar-item-hovered-bg | $panelbar-item-hover-bg |
$panelbar-item-hovered-text | $panelbar-item-hover-text |
$panelbar-item-hovered-border | $panelbar-item-hover-border |
$panelbar-item-hovered-gradient | $panelbar-item-hover-gradient |
$panelbar-item-focused-bg | $panelbar-item-focus-bg |
$panelbar-item-focused-text | $panelbar-item-focus-text |
$panelbar-item-focused-border | $panelbar-item-focus-border |
$panelbar-item-focused-gradient | $panelbar-item-focus-gradient |
$panelbar-item-focused-shadow | $panelbar-item-focus-shadow |
$panelbar-item-hovered-focused-bg | $panelbar-item-hover-focus-bg |
$panelbar-item-hovered-focused-text | $panelbar-item-hover-focus-text |
$panelbar-item-hovered-focused-border | $panelbar-item-hover-focus-border |
$panelbar-item-hovered-focused-gradient | $panelbar-item-hover-focus-gradient |
$panelbar-item-selected-hovered-bg | $panelbar-item-selected-hover-bg |
$panelbar-item-selected-hovered-text | $panelbar-item-selected-hover-text |
$panelbar-item-selected-hovered-border | $panelbar-item-selected-hover-border |
$panelbar-item-selected-hovered-gradient | $panelbar-item-selected-hover-gradient |
$panelbar-item-selected-focused-bg | $panelbar-item-selected-focus-bg |
$panelbar-item-selected-focused-text | $panelbar-item-selected-focus-text |
$panelbar-item-selected-focused-border | $panelbar-item-selected-focus-border |
$panelbar-item-selected-focused-gradient | $panelbar-item-selected-focus-gradient |
$panelbar-item-selected-hovered-focused-bg | $panelbar-item-selected-hover-focus-bg |
$panelbar-item-selected-hovered-focused-text | $panelbar-item-selected-hover-focus-text |
$panelbar-item-selected-hovered-focused-border | $panelbar-item-selected-hover-focus-border |
$panelbar-item-selected-hovered-focused-gradient | $panelbar-item-selected-hover-focus-gradient |
$rating-icon-focused-text | $rating-icon-focus-text |
$rating-icon-focused-shadow | $rating-icon-focus-shadow |
$rating-icon-focused-selected-shadow | $rating-icon-focus-selected-shadow |
$slider-button-focused-shadow | $slider-button-focus-shadow |
$slider-draghandle-hovered-bg | $slider-draghandle-hover-bg |
$slider-draghandle-hovered-text | $slider-draghandle-hover-text |
$slider-draghandle-hovered-border | $slider-draghandle-hover-border |
$slider-draghandle-hovered-gradient | $slider-draghandle-hover-gradient |
$slider-draghandle-focused-shadow | $slider-draghandle-focus-shadow |
$spreadsheet-insert-image-dialog-overlay-hovered-text | $spreadsheet-insert-image-dialog-overlay-hover-text |
$tabstrip-item-hovered-bg | $tabstrip-item-hover-bg |
$tabstrip-item-hovered-text | $tabstrip-item-hover-text |
$tabstrip-item-hovered-border | $tabstrip-item-hover-border |
$tabstrip-item-hovered-gradient | $tabstrip-item-hover-gradient |
$tabstrip-item-focused-shadow | $tabstrip-item-focus-shadow |
$tabstrip-content-border-focused | $tabstrip-content-focus-border |
$time-list-focused-bg | $time-list-focus-bg |
$kendo-upload-focused-shadow | $upload-focus-shadow |
$kendo-window-focused-shadow | $window-focus-shadow |
$kendo-wizard-focused-shadow | Removed (unused) |
- Added
$kendo-prefix to$spacingmap
Renamed $spacing to $kendo-spacing to avoid conflicts with other libraries.
- grid: grid grouping header indicators replaced with
- treelist: Added kendo prefix to all treelist variables:
Change variable names from $treelist-* to $kendo-treelist-*.
- grid: Grid header cell rendering updated
- grid: Added
sizeappearance property: sizecontrols the overall physical size of the grid and it's components.- currently supports small and medium (default) sizes
The size property generates component specific class name k-grid-{size}.
- grid: Added kendo prefix to all grid variables:
Change variable names from $grid-* to $kendo-grid-*.
- Removed tilde from import path:
Going forward, all imports from node_modules will not be prefixed with ~.
- Use functions and mixins only from theme-core
All, but two, functions are prefixed with k- to avoid conflicts with other libraries:
contrast-wcagis renamed tok-contrast-legacy, andyiqis renamed tok-yiq-luma-information
as the new names describe them better.
Note: k-contrast-legacy is deprecated and will be removed.
- Added kendo prefix to all listview variables
Change variables names from $listview-* to $kendo-listview-*.
-
editor: The Editor now uses div containers instead of table
-
editor:
k-editor-toolbar-wrapwrapper removed -
editor: Toolbar component is used for the Editor toolbar
-
editor: Window component is used for all Editor popups
-
editor: Form component is used inside popups
-
editor: All inputs inside popups are replaced with the respective component: TextBox, NumericTextBox, etc
-
editor: The following classes are renamed:
-
k-resizablerenamed tok-editor-resizable -
k-editor-table-wizard-dialogrenamed tok-editor-table-wizard-window -
editor: Added kendo prefix to all editor variables:
Change variable names from $editor-* to $kendo-editor-*.
-
upload: The following classes are being renamed:
-
k-dropzone-hover/hoveredrenamed tok-hover -
k-file-group-wrapper,k-file-invalid-group-wrapper,k-multiple-files-group-wrapper,k-multiple-files-invalid-group-wrapperrenamed tok-file-icon-wrapper -
k-file-groupreplaced withk-file-icon -
k-file-name-size-wrap classreplaced withk-file-info -
k-file-informationclass replaced withk-file-summary -
upload actions buttons wrapper renamed from
k-upload-statustok-upload-actions -
upload: The following classes are being removed:
-
k-upload-status-totalremoved fromk-upload-status -
k-validation-iconremoved from upload-status icon -
k-file-name-invalidremoved from k-file-name -
k-text-successand k-text-error removed fromk-validation-message -
upload: Updated rendering of the upload area with button and input
-
upload: Added kendo prefix to all upload variables:
Change variable names from $upload-* to $kendo-upload-*.
- loader: Added kendo prefix to all loader variables:
Change variable names from $loader-* to $kendo-loader-*.
-
fab: Remove styles for fab shape property
-
window: The following classes are being renamed:
-
k-window-actionsrenamed tok-window-titlebar-actions -
k-window-buttongroup,k-window-buttonsrenamed tok-window-actions -
window: The following classes are being removed:
-
k-window-titlelessremoved -
k-dialog-*classes removed -
window: By default, the color of the titlebar is now the base color and can be changed via the new themeColor property of the component
-
dialog: The following classes are being renamed:
-
k-dialog-actionsrenamed tok-dialog-titlebar-actions -
k-dialog-buttongroupandk-dialog-buttonsrenamed tok-dialog-actions -
dialog: By default, the color of the titlebar is now the base color and can be changed via the new themeColor property of the component
-
dialog: Added kendo prefix to all dialog variables:
Change variable names from $dialog-* to $kendo-dialog-*.
- window: Added kendo prefix to all window variables:
Change variable names from $window-* to $kendo-window-*.
-
notification: The following changes have been made to the notification classes:
-
removed
k-notification-wrap -
added
k-notification-actionsandk-notification-actionclasses -
notification: Added kendo prefix to all notification variables:
Change variable names from $notification- to $kendo-notification-
- listbox: Added kendo prefix to all listbox variables:
Change variable names from $listbox-* to $kendo-listbox-*.
-
listbox: The following classes have been renamed:
-
k-listbox-toolbarrenamed tok-listbox-actions -
k-listbox-toolbar-leftrenamed tok-listbox-actions-left -
k-listbox-toolbar-rightrenamed tok-listbox-actions-right -
k-listbox-toolbar-toprenamed tok-listbox-actions-top -
k-listbox-toolbar-bottomrenamed tok-listbox-actions-bottom -
progressbar: Add kendo prefix to all progressbar variables:
Change variable names from $progressbar-* to $kendo-progressbar-*.
-
progressbar: The following changes are introduced:
-
added
k-progressbar-valueclass -
renamed css variable name from
--kendo-progressbar-progressto--kendo-progressbar-value -
progressbar: Changes to the following Progressbar classes:
-
added
k-chunk-progressbarclass -
added
k-progressbar-chunksclass -
k-itemclass is replaced withk-progressbar-chunk -
appbar: Added kendo prefix to all appbar variables:
Change variable names from $appbar-* to $kendo-appbar-*.
- drawer: Added kendo prefix to all drawer variables:
Change variable names from $drawer-* to $kendo-drawer-*.
- drop IE support
- forms: Added
sizeappearance property.
The size appearance property generates component specific class name k-form-{size}.
- forms: Added kendo prefix to all form variables
Change variable names from $form-* to $kendo-form-*.
-
pager: Added
sizeappearance property: -
sizecontrols the overall physical size of the pager and it's components.
Generates pager specific class name k-pager-{size}.
- pager: Added kendo prefix to all pager variables:
Change variable names from $pager-* to $kendo-pager-*.
- pager: Replaced pager numbers with buttons:
The rendering ot the Pager component has been changed to use buttons instead of spans.
- toolbar: Added
sizeappearance property.
The size appearance property generates component specific class name k-toolbar-{size}.
- toolbar: Added kendo prefix to all toolbar variables
Change variable names from $toolbar-* to $kendo-toolbar-*.
- html: The
k-overflow-anchorclass is renamed tok-toolbar-overflow-button.
v5.12.0
 (11/28/2022)5.12.0 (2022-11-28)
Bug Fixes
- core: add missing styles for sized spacer (2e76d19)
- correct theme colors in default main and main-dark swatches (d256ea4)
- html-spec: pack schemas for release (0e3d58c)
- popover: set height to inner element to display callout correctly and add a visual test (e0b72a1)
- scheduler: remove default browser focus outline (b523f1f)
- scheduler: remove default browser focus outline of the k-scheduler-content element (7a0df77)
- switch: missing border utility dependency (d569cf3)
- treelist: missing text utility dependency (2ffbcc2)
Features
v5.11.0
 (11/7/2022)5.11.0 (2022-11-07)
Bug Fixes
- action-sheet: titblebar font size should be 16px (dfe83f7)
- content in adaptive actionsheet should not exceed 360px width (803dc21)
- core: transfer mixins to theme core (d2b8246)
- extract core folder to theme core (3ba661f)
- filemanager: add spacing between labels and values in the preview pane (b20d88f)
- html-spec: incorrect selector used for combobox inner input (1abffc9)
- notification: add z-index to guarantee notifications stay on top (bcae231)
- nouvelle: ensure all icon related variables are contained in the icons module (d16f3f1)
- tabstrip: do not overlap tabstrip and content area (7f59331)
- tabstrip: remove z-index from tabstrip-items and tabstrip-content (af0f859)
- tranfer component system to theme core (54dbb02)
Features
- add alignement classes for tabstrip items (ca4957c)
- core: add function for checking if element is in list (53b19b6)
- core: add function for working with nullable variables (1f8671a)
- core: add function to convert rgba to solid colors (920abe9)
- html-sepc: add json schema validation (9bba6e6)
- nouvelle: use color system for input and picker type components (35f8b52)
- utils: add row and col gap utility classes (317d0dc)
v5.10.0
 (10/21/2022)5.10.0 (2022-10-21)
Bug Fixes
- action-sheet: use clamp instead of max for sizing action sheet container (e2c9af9)
- actionsheet: remove item outline (65dc76f)
- calendar: incorrect default view width with week column (b5fefc3)
- nouvelle: use uitls internally (39f8cbe)
- pdf-viewer: add utils dependency (606e880)
- spreadsheet: hide borders behind disabled/merged cells (ee85f78)
- spreadsheet: overflow: hidden on .k-spreadsheet-fixed-container (7fdfd65), closes telerik/kendo#16396
Features
v5.9.0
 (10/17/2022)5.9.0 (2022-10-17)
Bug Fixes
- bottom-navigation: add border colors in fluent theme (57c41fd)
- bottom-navigation: add gap between icon and label in fluent theme (28cf41a)
- bottom-navigation: nav items min-height in fluent theme (4963bfd)
- calendar: allow range deselection in fluent (c26e3bc)
- calendar: navigation scrollbar should not be accessible (13fd191)
- calendar: remove double scrollbar placeholder in calendar (9848262)
- calendar: remove fixed calendar width and rely on sizes instead (5fdd61b)
- calendar: use correct cell sizes (5cc4d4a)
- calendar: year, decade and century view cells should be 2x of month cells (99bc56d)
- color-preview: add missing styling for size 'none' (ab54dd8)
- coloreditor: add focus for colorgradient inside coloreditor (13c95e3)
- colorgradient: allow draghandle overflow (5823e15)
- colorgradient: correctly position slider-track in rtl direction (5a2439a)
- colorgradient: remove border around canvas in fluent (8b68463)
- colorpalette: adjust disabled state to match fluent design (e6ef6ea)
- colorpalette: improve selected-hover tile state (6899a9c)
- colorpalette: remove white lines between tiles (d571e83)
- editor: readonly editor can resize inner table content (49b209a)
- fluent: make box-shadows exactly the same as the ones in ms fluent (4b1d9f1)
- fluent: remove redundant config map from params (871e771)
- gantt: add hover colors for tasks in fluent theme (716ae39)
- gantt: fix hover color for delayed tasks in fluent (5d837ea)
- gauge: pointer and track have no color in fluent theme (b7add52)
- grid: add k-reorder-cue as k-grouping-dropclue alias (10da8ce)
- grid: align sort order icon in fluent theme (09a8f1b)
- grid: change action buttons block-start padding (83628fe)
- grid: match sort icon spacing with fluent design (560f244)
- grid: remove specific sort icon classes in fluent theme (0196f52)
- grid: search field should not change popup width (5c30699)
- input: remove input button outline on focus (12ac503)
- input: set focus border color to transparent when fillMode is none (54d37ca)
- menu: add padding-inline-end to items in vertical menu in fluent (ddec977)
- menu: give first item in menu group initial focus (080fc83)
- menu: remove double outline of items in context menu (7ac8bca)
- pager: increase pager input width in fluent (d5cd172)
- panelbar: fix typo that prevents setting a background color in panelbar item in fluent (6677d8c)
- progressbar: label moves down after initial interaction with progressbar in fluent theme (a77e34a)
- progressbar: scope progressbar status styles in fluent (5fb334c)
- radio and checkbox ripple (2efd826)
- scheduler: update selection color in fluent (be5dab7)
- signature: apply opacity to the disabled signature in fluent (d61b085)
- signature: large signature should retain size when drawing (ee61f9c)
- signature: remove k-signature-canvas outline on focus-visible (af7b834)
- signature: update line color to match design (6d3d600)
- signature: update signature line disabled state to match design (fb3bf14)
- skeleton: add animations in fluent (00d1b28)
- skeleton: fix wave animation in fluent (c115516)
- skeleton: wave animation in fluent (d84aac6)
- slider: fix active and focus state in fluent (3b04c92)
- slider: update focus, active and disabled states as per designs in fluent (dfefacf)
- splitbutton: move delimiter to k-button-icon element in fluent theme (8336e56)
- spreadsheet: theme styles are defined outside of theme mixin in fluent theme (0534c12)
- table: update selected table colors in fluent (45f3a22)
- timeline: bottom part of the card should be visible (9e6b966)
- timeline: prev/nav card should not be visible in fluent (bd972a8)
- timeselector: add list title padding to height var in fluent theme (3143bee)
- timeselector: hide time separator in fluent theme (7bf6792)
- toolbar: wrong or missing toolbar item focus styles (60fe96b)
- treelist: add margin between expand/collapse icon and item's text in fluent theme (37578db)
- utilities: add alies for col-span (c8c0fbe)
Features
- bootstrap: use theme core in bootstrap theme (e3d1458)
- calendar: add sizes to calendar in fluent theme (b743389)
- classic: use theme core in classic theme (bf5de86)
- extend action sheet styles to allow for custom content (073230b)
- extract functions into core package (33c7680)
- extract meta for components as a separate package (ea5c201)
- filter: add focus styles (fbb1e69)
- icon: add clock-arrow-rotate icon (bf78deb)
- material: use theme core in material theme (dd9252a)
- nouvelle: use theme core in nouvelle theme (71d0733)
- timedurationpicker: add component styles (6f35b78)
v5.8.1
 (9/13/2022)v5.8.0
 (9/12/2022)5.8.0 (2022-09-12)
Bug Fixes
- chat: use correct shadow for bubble states in fluent theme (6b68b9c)
- coloreditor: set default width based on design in fluent theme (7fbdc7c)
- coloreditor: use smaller footer padding to comply with the design in fluent theme (26054a0)
- colorgradient: alpha slider opacity is not visible in fluent theme (cc511ae)
- colorgradient: prevent canvas from overflow in fluent theme (e01c8c9)
- colorgradient: use smaller font-size for input labels in fluent (e07811b)
- column-menu: apply disabled color in fluent theme (35b18f0)
- fluent: import scrollbar utils (af4dbcd)
- gantt: rtl mode does not align tasks to correct side in fluent theme (4df5e50)
- grid: remove top padding from filter menu container in fluent theme (527eb1c)
- imageeditor: match border color with design in fluent theme (19bd995)
- pdf-viewer: search panel offset calculation causes canvas displacement (73ed102)
- pivotgrid: add outline none to focus cells (3d9a938)
- progressbar: match chunks spacing with design in fluent theme (a5044ec)
- splitter: fix styles in fluent theme (b7edb5f)
- stepper: match styles with design in fluent theme (a6ca694)
- table: use interpolation for sizing in fluent theme (3de1404)
- taskboard: remove preview pane double border in fluent theme (34973cd)
- taskboard: reverse rtl preview pane position in fluent theme (5ffff8a)
- taskboard: use correct font style for preview pane header in fluent theme (4127649)
- utils: generate correct value for column-reverse util (def4ef8)
- utils: generate missing table layout aliases (7ff11be)
- wizard: remove content padding in fluent theme (85a8b1f)
Features
- chat: add fluent styles (6a5f907)
- fluent: add adaptive styles (787639b)
- gantt: add fluent styles (0407434)
- pdf-viewer: add fluent styles (62d9f9b)
- pivotgrid: add fluent styles (e3a4634)
- scrollview: add fluent styles (a5ce29c)
- spreadsheet: add fluent styles (3dfe954)
- timeline: add fluent styles (d3559ef)
v5.7.0
 (9/5/2022)5.7.0 (2022-09-05)
Bug Fixes
- add calc function when calculating line-height-em (0f7a691)
- add important utils for position (4d6e1dd)
- button: add default to -button-padding-y-lg value (f6b1afe)
- calendar: incorrect cell height (a80d70e)
- calendar: remove hidden from out of range cells to allow customization with themebuilder (75efce8)
- card: improve callout styles and remove unnecessery variables (7e8ab03)
- charts: add chart tooltip popup styles when not a direct child (c3ec811)
- colorgradient: change icon selector to a more generic one (869fb83)
- colorpicker: import missing coloreditor dependency (64dbc07)
- daterangepicker: allow $kendo-daterange-picker-input-width customization (8dee65a)
- dropdowngrid: import missing table dependency (53a72b8)
- editor: add support for k-i-caret-br (3d16bf2)
- fluent: add missing form-label bottom margin (c0e61fb)
- fluent: fix input layout when component size is set to none (d34b7be)
- fluent: use correct floating-label y offset value (6347439)
- grid: add support for sort-asc-small and sort-desc-small icons (f1196db)
- html: k-icon-button class is added twice to dropdown button (cf89feb)
- notification: add suport for k-i-x icon (d0f2e9f)
- pager: add support for pager icons (7897467)
- panelbar: panelbar item focus should not have outline (d891696)
- pivotgrid: add focus state to empty cell in header (af75b45)
- popover: improve callout styles and remove unnecessery variables (26055ad)
- scheduler: add support for caret-alt-left and right icons (59df4a5)
- scheduler: add support for k-i-arrow-rotate-cw (afc91fa)
- slider: change icon selectors for prev and next buttons (88fbe81)
- splitter: icons spacing selector (f7d2a70)
- utils: add missing position aliases (afd8f2c)
- utils: fixes invalid css property values (bd88a5e)
Features
- action-buttons: add fluent styles (9e958a7)
- action-sheet: add action-sheet fluent styles (b48b622)
- appbar: add fluent styles (6800d89)
- avatar: add avatar styles for fluent (b42be03)
- badge: update styles to match updated badge component options (83d705d)
- bottom-nav: add fluent styles (2413b73)
- breadcrumb: add fluent styles (d2401f1)
- captcha: add fluent styles (5061c1f)
- card: init fluent styles (b9dc65a)
- checkbox: add checkbox styles (5e1a3da)
- chip: add fluent styles (128d7f0)
- color-preview: add fluent styles (b77834e)
- coloreditor: add fluent styles (a5b6dec)
- colorgradient: add fluent styles (1c32a05)
- colorpalette: add fluent styles (4e65289)
- colorpicker: add fluent styles (ec277f0)
- dataviz: add fluent styles (69108b5)
- drawer: add fluent styles (e8787e8)
- dropzone: add fluent styles (aab27ec)
- expansion-panel: add fluent styles (5511620)
- fab: add fluent styles (031bae5)
- filemanager: add fluent styles (105b94e)
- filter: add fluent styles (38e8419)
- fluent: add badge styles (6d0a622)
- fluent: add editor styles (6edaa00)
- fluent: add floating-label styles (b328b6e)
- fluent: add fluent inpust as individial modules (1b0e951)
- fluent: add notification styles (0c0b52a)
- fluent: add panelbar fluent styles (2944772)
- fluent: add styles for fluent slider (f689b13)
- fluent: add styles to listview (6275b46)
- fluent: add tabstrip styles (1a3abc9)
- fluent: add tooltip styles (9a90e32)
- fluent: add validator styles (434c282)
- forms: add fluent styles (812a0f8)
- grid: add fluent styles (7dab140)
- html: add badge html helper (c651ffa)
- html: streamline interactive class names (4a46e3e)
- imageeditor: fluent styles (2d75552)
- input: add fluent styles (a526954)
- list: add fluent styles (4a48b82)
- listbox: add fluent styles (40fa874)
- listgroup: add fluent styles (fb28d06)
- loader: add fluent styles (cfb6f93)
- map: add fluent styles (41115dc)
- mediaplayer: fluent styles (c856947)
- menu-button: add fluent styles (635aba5)
- menu: add fluent styles (172d46e)
- messagebox: add fluent styles (7f7ff1e)
- orgchart: add fluent styles (59f1a3b)
- pager: add fluent styles (e00a13f)
- pdf-viewer: update component to match latest design (8e25562)
- popover: add styles to Fluent (7ab846c)
- progressbar: add progressbar fluent styles (a0cf62e)
- radiobutton: add radio button styles (fd0a868)
- rating: add fluent styles (591d0b0)
- responsivepanel: fluent styles (6e4bc47)
- ripple: add fluent styles (a9f1359)
- scheduler: add scheduler fluent styles (c38b9b6)
- scroller: add fluent styles (640c9f1)
- signature: add fluent styles (d54703a)
- skeleton: add fluent styles (e6a9ddb)
- split-button: add fluent styles (70758cf)
- splitter: add fluent styles (cde3496)
- stepper: add fluent styles (d44a71f)
- streamline interactive class names (041a9ee)
- switch: add fluent styles (5bb39cc)
- table: add fluent styles (21af0f2)
- taskboard: add fluent styles (1132383)
- tilelayout: add styles to Fluent (cb8aeee)
- timeselector: add fluent styles (17317b4)
- toolbar: add fluent styles (c56e076)
- toolbar: add focus state for k-toolbar-item (59f8ca9)
- treelist: add fluent styles (21dcadb)
- treeview: add fluent styles (6a260eb)
- upload: add upload fluent styles (41758f0)
- virtual-scroller: add fluent styles (20dfa5a)
- wizard: add fluent styles (c79af6f)
v5.6.0
 (7/25/2022)5.6.0 (2022-07-25)
Bug Fixes
- bootstrap: align spacing and font size in button input and chip (db2d4f8)
- button: tweak large size so it's compatible with guidelines for mobile (34752f1)
- calendar: add size property to calendar component (d9333b5)
- calendar: focus selector in material (bb2ff70)
- calendar: remove outline at focus state (f319907), closes telerik/kendo#15502 #3653
- grid: make cell-inner element as wide as parent th cell (f2fdc5c)
- grid: remove highlighting of header row in detail grid (e992dfe)
- grid: use correct var for header cell spacing (36e4b25)
- input: tweak large size so it's compatible with guidelines for mobile (7972c1b)
- list: tweak large size so it's compatible with guidelines for mobile (29bb58e)
- make the -chip-spacing to be overwrittable #3665 (55c4abd)
- progressbar: expose width property and set default value (ad776ca)
- remove space before comma in selectors (932ee9c)
- treeview: tweak large size so it's compatible with guidelines for mobile (fdc2a56)
- utils: change grid-column-span full to 1/-1 (7a195e5)
Features
- action-sheet: add styles for adaptive behaviour (356e528)
- button: add fluent styles (08f217f)
- calendar: add calendar fluent styles (7bddac5)
- calendar: add sizes for calendar component (0dc4981)
- dialog: add dialog fluent styles (e8c64d3)
- html: add signature helper (7443084)
- icon: add icons to fluent theme (356c8aa)
- overlay: add overlay fluent styles (b44f8eb)
- popup: add popup fluent styles (ecfec54)
- progressbar: add circular progressbar styles (2b30b41)
- signature: add signature component styles (a71e6d6)
- time-selector: add sizes for time-selector component (00195fe)
- typography: add fluent styles (b87fb8f)
- window: add window fluent styles (c47e42c)
v5.5.0
 (6/13/2022)5.5.0 (2022-06-13)
Bug Fixes
- avatar: align avatar image to top (3103874)
- color-picker: reduce horizontal padding of inputs, so value is almost never clipped (40997af)
- drawer: drawer should not be wider than its parent (52a8c6b)
- input: ensure outline input and picker use the same border-color (5a8a651)
- input: merge input-ripple styles in input styles (7be8b2b)
- input: remove child button border for flat input and pickers (6a97e09)
- make flat input and picker bottom radius 0 so it can accept different rounding (f78fbb7)
- material: apply input ripple on the correct sides (d95a5ee)
- material: update input and picker colors to match latest material spec (e07ad4d)
- panelbar: expose $panelbar-border-style variable (cf5afac)
- scope solid input and picker styles (66e9357)
- slider: add absolute positioned tick for slider (21f931c)
- switch: switch should accept k-rtl modifier (db182a6)
- toolbar: revert shading for indirect child button components (aa2c385)
Features
v5.4.1
 (5/5/2022)v5.4.0
 (5/2/2022)5.4.0 (2022-05-02)
Bug Fixes
- add missing styles to numeric-filter-menu (d923974)
- chip: chip text color to depend on the base-text color rather than button-text (773465c)
- daterangepicker: update swap button alignment to match design (62d9043)
- dropdown: update hover background-color and text to match design (95c5a9d)
- extract menu-button styles as a separate module (b20201a)
- extract split-button styles as a separate module (b52a8ba)
- floatinglabel: allow usage of k-invalid and k-focus classes (aec2ea9)
- gantt: dependency validation tooltip adjustments (bf7c6e8)
- input: add inline-start border to input button in default and material (133d29f)
- input: apply $invallid-border to invalid focus state outline input and picker in default theme (983ee4f)
- input: apply correct border-radius on :focus-within (e5ebc2b)
- input: apply correct hover border-color to input in default theme (b4da2c1)
- input: apply correct styles to focused outline picker when hovered (9cec247)
- input: ensure correct styles are applied to input and picker when in invalid state (4cce02a)
- input: ensure inputs and pickers have identical padding across all fill modes (d0af743)
- input: fix flat picker :focus:hover behavior in bootstrap (6939394)
- input: give flat input and picker border-radius on focus to match design (7a1cbdc)
- input: give flat picker background-color on hover state (1e54437)
- input: update flat input border-color on focus to match design (275748c)
- input: update flat picker focus border and shadow in bootstrap to match design (dfe9966)
- input: update input border-color in material to match design (a33b563)
- input: update input focus border-color in default to match design (fd01025)
- input: update outline picker text and border color in bootstrap to match design (d2e9c1c)
- input: update picker focus background-color and border-color in bootstrap (6ac2e1d)
- input: update solid input focus border in material to match design (8e0e266)
- menu: add missing button dependency (d070d37)
- menu: apply focus styles to the inner k-link element (3480b4e)
- menu: make scroll button selector more specific (e517d27)
- scheduler: align recurrence icon in bootstrap theme (d79bc71)
- treeview: allow sizing customization through default treeview variables (61b180d)
- update outline input and picker border-colors to match design (469a96b)
Features
v5.3.1
 (4/7/2022)v5.3.0
 (4/4/2022)5.3.0 (2022-04-04)
Bug Fixes
- actionsheet: use subtle text variable for description styling (043ca4a)
- add clear button to json option file (9bda9f6)
- button: allow $kendo-solid-button-shade-function to be customized (83f8965)
- button: remove forced aspect ratio (8e41299)
- chat: add pre-wrap to chat messages (78a5e6d)
- chip: add box-shadow none on focus (86b845d)
- chip: text color in dark swatches (1682fcc)
- chip: update solid chip background color to match design (18353e9)
- colorgradient: use subtle text variable for input labels (860853a)
- colorpalette: use k-selected for selected state (92fdec8)
- dropdowngrid: reset data table border width in popup (af33de2)
- dropdowntree: wrong padding of the check-all element (ba3f72e)
- dropzone: use subtle text variable for note styling (8a416c1)
- expansion-panel: use subtle text variable for sub title styling (53ca03c)
- floating-label: add offset in front of floating-label in material theme (5322dfc)
- floating-label: address comments (4cb59c8)
- floating-label: allow label to be clickable in order to focus associated input (4a2acb8)
- floating-label: apply correct transitioning and alignment in rtl direction (f4e423d)
- floating-label: ensure styles are applied when using k-empty class (fdebefa)
- floating-label: ensure styles are applied when using k-focus class (8c6c318)
- form: action buttons overflow (4dbd1f3)
- grid: allow th cell alignment when sortable is enabled (a6adf50)
- grid: incorrect header sorting icon selector (eec44f5)
- html: add k-input-loading-icon class to loading icon (f38780b)
- html: avatar rounded option value (865dc33)
- html: remove rounding option from radio buttons readme (48fb0f7)
- html: remove unneeded attributes from map (9993a73)
- html: update validation icon classes (7cdc86a)
- input: allow placeholder text color customization on generic input (86270a9)
- input: correctly handle native disabled inputs (bd3b646)
- input: hover shadow variables not present in the code (5629d40)
- pager: ensure text inside pager does not wrap when pager is not responsive (9dd7c2b)
- taskboard: use hover color for focus state (f81ba93)
- textarea: add padding when using directive (1a0cbab)
- textbox: add necassery disabled styles (b9b9797)
Features
- add default ocean blue swatch (867ee02)
- common/loading: add variables for loading indicator (d271873)
- html: add action buttons html helper (bc5a49f)
- html: add captcha html helper (c50a695)
- html: add colorpalette html helper (1445f1c)
- html: add dropdowngrid helper (8e32c81)
- html: add floating label html helper (61c792c)
- html: add html helper for ButtonGroup (2347fd0)
- html: add html helper for daterangepicker (5efcbaf)
- html: add popover html helper (07202ac)
- html: add typography html helper (48f244e)
- scheduler: add ongoing event styles (60c6108)
- utils: add aspect-ratio utility classes (51dfc5a)
- utils: add utility classes for white space wrapping (c4d4a28)
v5.2.0
 (2/21/2022)5.2.0 (2022-02-21)
Bug Fixes
- add important utils for flex-*, justify and align (5823691)
- add important utils for overflow (2a1101a)
- add important utils for resize (bd0edd1)
- button: font awesome icons in icon button are not properly aligned (ece376e)
- button: use kendo-button-border-radius variable in button styles (ee6a073)
- calendar: long month names overlapping in infinite calendar navi… (68a97b3)
- change default border radius in bootstrap theme (f1db475)
- change default border radius in material theme (54a6aa9)
- change default border radius in the default theme from 2 to 4 pixels (9c0ac14)
- chip: fix cut text at bottom of chip (97e1bc4)
- dataviz: set default barcode height (cae3bfc)
- dataviz: set default QR code height (e648409)
- docs: resolve sass variables before docs generation (80e37c4)
- floating-label: fix rtl display when floatiating label is placed inside container with [dir=rtl] (14e401e)
- form: set daterangepicker on a single line (2b0e8d1)
- functions: escape percent character (44598e6)
- html: add k-focus to menu item instead of menu link (8ca69f7)
- input: conditionally set spinner offset to calculated or auto (04d5b35)
- input: excess text is not properly cut (60c5834)
- input: missing styles for kendo icons in suffix and prefix (78d1cae)
- list: empty items have a wrong height (ebd716e)
- menu: set focus styles to menu items via k-focus class for keyboard navigation purposes (ebbadf5)
- notification: customizable theme variables (ed8ae78)
- pivotgrid: add missing padding between icon and text in pivotgrid cells (e84fe7c)
- pivotgrid: add vertical borders for the legacy pivot rendeing in Material theme (c9194cd)
- rename border-radius to kendo-border-radius (54698d6)
- stepper: label overflow doesnt work (78777c0)
- textarea: set display to inline-flex (75a6da4)
- utilize border radius variables in classic theme (69968ac)
Features
- add disabled state variables for input and picker high-level components (d85b305)
- filemanager: add left and right borders to splitbar according to updated designs (48d0eae)
- gantt: add dependency validation tooltip styles (ebd1031)
- icons: add new icons to the font (12d3c17)
- improve component options sizings as per desing (d927a16)
v5.1.1
 (1/24/2022)v5.1.0
 (1/24/2022)v5.0.1
 (1/19/2022)v5.0.0
 (1/18/2022)5.0.0 (2022-01-18)
Bug Fixes
chore
- scheduler: remove legacy styles for kendo-angular-scheduler toolbar (94e093b)
Features
- autocomplete: add size, rounded and fill customization to autocomplete (de93be6)
- avatar: add rounded customization to avatar (9d663e4)
- button: add size, shape and color customization to button (db31d3f)
- checkbox: add sizing property to checkbox (b60493d)
- chip: add size rounded customization to chip (1c2c8c0)
- color-picker: add size, shape and color customization to color picker (ea83616)
- combobox: add size, shape and color customization to combobox (3454223)
- date-input: add size, rounded and full customization to date input (c19da4f)
- date-picker: add size, rounded and full customization to date picker (b137bca)
- daterange-picker: add size, rounded and full customization to date range picker (5f48054)
- datetime-picker: add size, rounded and full customization to date-time picker (9d98b62)
- dropdown-grid: add size, shape and color customization to dropdown grid (b8f7f05)
- dropdown-list: add size, shape and color customization to dropdown list (1a529a8)
- dropdown-tree: add size, shape and color customization to dropdown tree (7907d94)
- fab: standartize appearance options (6a9dfdb)
- html: add html helper for multiselect (55cf915)
- input: add new high-level input component (6f45cf0)
- list: add size customization to list (1509542)
- masked-textbox: add size, rounded and fill customization to masked textbox (995dc3f)
- menu-button: add size customization to menu button (45a0864)
- menu: add size customization to menu list and menu items (7e0b9d1)
- multiselect: add size, rounded and fill customization to multiselect (11a2cab)
- numeric: add size, rounded and fill customization to numeric (8e16cd2)
- radio: add sizing property to radio (afb6cc3)
- searchbox: add size, rounded and fill customization to searchbox (0e75886)
- switch: add size and rounded customization to switch (10a7a02)
- table: add sizing to table component (ae7b643)
- textarea: add size, rounded and fill customization to textarea (cc6c6fb)
- textbox: add size, rounded and fill customization to textbox (797937e)
- time-picker: add size, rounded and full customization to time picker (c8db5cb)
- treeview: add sizing property to treeview (0b92f78)
infra
- publishing: do not include flattened dependencies in distributions (6dd9537)
BREAKING CHANGES
- fab: Convert monolithic FAB styles to multiple class names.
Styles are split in multiple class names with each being scoped to a single FAB appearance property:
shape- controls if the FAB is square or not;size- controls the overall physical size of a FAB;themeColor- controls which color is used to style a FAB;fillMode- controls how the color is applied;rounded- controls what border radius is applied to a FAB.- fab: the shape option now supports
rectangleandsquare. - fab: themeColor class is now composite -
k-fab-{fillMode}-{themeColor}. - fab: Add kendo prefix to all FAB variables
- treeview: Add sizing property to TreeView
- multiselect: Use high-level input for multiselect base
Multiselect reuses the input base component size, rounded and fill component options.
- multiselect: Use chip list for item selection
- chip: Add kendo prefix to all avatar variables
Change variable names from $chip-* to $kendo-chip-*.
- table: Add kendo prefix to all table variables
Change variable names from $table-* to $kendo-table-*.
- list: List size is now applied by a dedicated class.
- list: Rename list state variables.
- list: Add kendo prefix to all list variables
Change variable name from $list-* to $kendo-list-*.
- menu: Convert monolithic menu styles to multiple class names
- menu-button: Convert monolithic menu button styles to multiple class names
- avatar: Removed shape option from avatar.
The avatar has fixed width and height, thus no dedicated shape option is needed. Instead, the avatar has rounded appearance property set to circle by default.
The styles of the avatar are split into multiple class names with each being scoped to a single appearance property:
sizecontrols the overall physical size of an avatar;themeColorcontrols which color is used to style an avatar;fillModecontrols how the color is applied;roundedcontrols what border radius is applied to an avatar.
Each property generates component specific class name k-avatar-{size},
k-avatar-{fillMode}, k-avatar-{fillMode}-{themeColor}.
Note: without fillMode, there is no way to apply themeColor, that's why
the themeColor class is composite.
The only notable exception is rounded, which sets the same class name
for all components -- k-rounded-{rounded}.
You can find more information about the values of each property in the documentation of the button component -- /docs/components/avatar.
- avatar: Add kendo prefix to all avatar variables
Change variable names from $avatar-* to $kendo-avatar-*.
- daterange-picker: Use high-level input for date range picker base
Date range picker reuses the input base component size, rounded and fill component options.
- datetime-picker: Use high-level input for date-item picker base
Date-time picker reuses the input base component size, rounded and fill component options.
- time-picker: Use high-level input for time picker base
Time picker reuses the input base component size, rounded and fill component options.
- date-picker: Use high-level input for date picker base
Date picker reuses the input base component size, rounded and fill component options.
- date-input: Use high-level input for date input base
Date input reuses the input base component size, rounded and fill component options.
- color-picker: Use high-level picker for color picker base
Color picker reuses the picker base component size, rounded and fill component options.
- dropdown-grid: Use high-level picker for dropdown grid base
Dropdown grid reuses the picker base component size, rounded and fill component options.
- dropdown-tree: Use high-level picker for dropdown tree base
Dropdown tree reuses the picker base component size, rounded and fill component options.
- dropdown-list: Use high-level picker for dropdown list base
Dropdown list reuses the picker base component size, rounded and fill component options.
- combobox: Use high-level input for combobox base
Combobox reuses the input base component size, rounded and fill component options.
- autocomplete: Use high-level input for autocomplete base
Autocomplete reuses the input base component size, rounded and fill component options.
- searchbox: Use high-level input for searchbox base
Searchbox reuses the input base component size, rounded and fill component options.
- masked-textbox: Use high-level input for masked textbox base
Masked textbox reuses the input base component size, rounded and fill component options.
- numeric: Use high-level input for numeric textbox base
Numeric textbox reuses the input base component size, rounded and fill component options.
- textarea: Use high-level input for textarea base
Textarea reuses the input base component size, rounded and fill component options.
- textbox: Use high-level input for textbox base base
Textbox reuses the input base component size, rounded and fill component options.
- input: Add new high-level input and picker component
Previously, the various form components did not share or reuse code. Now, we have have to base components: input and picker, that hold the bulk of styling needed. In addition, styles are split in multiple class names with each being scoped to a single component appearance property:
sizecontrols the overall physical size of a component;themeColorcontrols which color is used to style a component;fillModecontrols how the color is applied;roundedcontrols what border radius is applied to a component.
Each property generates component specific class name k-input-{size},
k-input-{fillMode}, k-input-{fillMode}-{themeColor}.
Note: without fillMode, there is no way to apply themeColor, that's why
the themeColor class is composite.
The only notable exception is rounded, which sets the same class name
for all components -- k-rounded-{rounded}.
You can find more information about the values of each property in the documentation of each respective component -- /docs/components/....
- input: Remove residual styles
No further customization is applied to input and picker components when hosted inside other components, except in very few specific cases.
- input: Add kendo prefix to all variables
Change variable names from $input-* to $kendo-input-*.
- radio: Add sizing property to radio
There is a new aptly named property, size, for radio button which
controls the overall physical size of a radio button.
- radio: Add kendo prefix to all radio variables
Change variable names from $radio-* to $kendo-radio-*.
- checkbox: Convert monolithic checkbox styles to multiple class names
Previously, k-checkbox held all the styling information related to
the checkbox component. Now, styles are split in multiple class names
with each being scoped to a single checkbox appearance property:
sizecontrols the overall physical size of a checkbox;roundedcontrols what border radius is applied to a checkbox.- checkbox: Add kendo prefix to all checkbox variables
Change variable names from $checkbox-* to $kendo-checkbox-*.
- switch: Convert monolithic switch styles to multiple class names
Previously, switch class names held too much styling information that made customizing the switch hard. Now, styles are split in multiple class names with each being scoped to a single switch appearance property:
sizecontrols the overall physical size of a switch;trackRoundedcontrols what border radius is applied to the switch track;thumbRoundedcontrols what border radius is applied to the switch thumb.
You can find more information about the values of each property in the documentation of the button component -- /docs/components/switch.
- switch: Remove residual switch styles
No further customization is applied to buttons when hosted inside other components, except in very few specific cases.
- switch: Add kendo prefix to all switch variables
Change variable name from $switch-* to $kendo-switch-*.
- button: Convert monolithic button styles to multiple class names
Previously, k-button held all the styling information related to
the button component. Now, styles are split in multiple class names
with each being scoped to a single button appearance property:
shapecontrols if the button is square or not;sizecontrols the overall physical size of a button;themeColorcontrols which color is used to style a button;fillModecontrols how the color is applied;roundedcontrols what border radius is applied to a button.
Each property generates component specific class name k-button-square,
k-button-{size}, k-button-{fillMode}, k-button-{fillMode}-{themeColor}.
Note: without fillMode, there is no way to apply themeColor, that's why
the themeColor class is composite.
The only notable exception is rounded, which sets the same class name
for all components -- k-rounded-{rounded}.
You can find more information about the values of each property in the documentation of the button component -- /docs/components/button.
- button: Remove residual button styles
No further customization is applied to buttons when hosted inside other components, except in very few specific cases.
For instance, in Material theme we would slightly dim the normal buttons and remove the shadow, which may or may not be desired.
- button: Add kendo prefix to all button variables
Change variable names from $button-* to $kendo-button-*.
-
scheduler: Remove legacy styles for kendo-angular-scheduler
-
charts: Updates the chart series colors to match the update designs
-
add compatibility swatches called ending with v4
-
html: Set global legacy property to false
-
publishing: Do not include flattened dependencies in distributions
v4.44.0
 (1/18/2022)4.44.0 (2022-01-18)
Bug Fixes
- adaptive: improve spacing between items in adaptive edit form (2ff4adf)
- add box sizing to compnents and parts of components that can be sized (3ec985a)
- add important utils for flex (26cfa9e)
- add styles for virtual scroller component (0e1c521)
- appbar: make horizontal and vertical padding symetrical (6504cad)
- autocomplete: convert styles to universal v4 rendering (dbf7bcf)
- avatar: avatar can use forward compatible border radius (0aa2ed1)
- button-group: button group shouldn't have disabled appearance (b44a2a2)
- button-group: use direction independent border radius for children (ca0f78d)
- button: add extra styles for flat button (885cc6f)
- button: add extra styles for link button (f90e61d)
- button: add extra styles for outline button (8100b97)
- button: add extra styles for solid button (3aabce4)
- button: do not override button focus shadow in button group (b806e0e)
- button: increase border radius from 2px to 4px (d4d1beb)
- button: increase button height to match the input (b262bf3)
- button: material button should not be translucent when disabled (efc209a)
- button: remove IE 9 related code (96c23ef)
- button: size inner icon of button instead the button itself (f728632)
- button: update button box shadow spread to match Bootstrap (17bcd28)
- button: use border-radius inherit for focus ring (5e9ad82)
- button: use the same appearance for active and selected button (d9ca91e)
- chat: remove border from message box buttons (38ba0dc)
- chat: remove redundant textbox styles (339c301)
- chat: scroll buttons should be as small as possible (4d32dce)
- checkbox-radio: add styles for checkbox radio wrap for better alignment (3f2e22f)
- checkbox-radio: checkboxes and radios should not shrink (d6196f5)
- checkbox-radio: use !important when hiding empty radio / checkbox lables (9c9e647)
- checkbox: classic checkbox should have 4px border radius to reflect less themes (0e2a4b8)
- checkbox: contrast base for border should be own background (6529fcb)
- checkbox: improve ripple styles (122a208)
- checkbox: remove styles for obsolete marker indicator (4edd8bd)
- color-editor: make gap between current and preview color consistent (6e2a06f)
- color-picker: convert styles to match universal rendering (9d46df1)
- color-picker: legacy colorpicker shouldbe able to use color preview (a9f445e)
- color-preview: scope transparent background to color preview mask (87a1f19)
- column-menu: ensure all child content is 100% wide (fd954fe)
- column-menu: use corretly derived padding variables (6da6b59)
- combobox: update styles to match universal v4 rendering (8408f7c)
- daterange-picker: extract daterange picker styles as a separate module (02b3560)
- dropdown-list: update styles to match universal v4 rendering (eb21b75)
- editor: ensure kendo-jquery styles for overflow anchor do not affect the other suites (efad10e)
- editor: floating toolbar should take available width (e13246d)
- editor: set default width for inputs in dialogs (ac2798a)
- ensure consistent width for inputs and pickers when inside toolbar and other containers (503e68b)
- ensure correct font sizes for xs sm md lg and xl (1615afa)
- filter: adjust styles for angular rendering (971f6cb)
- form: make form-buttons alias of action buttons (0510a42)
- forms: remove unexpected margin before a form field preceded by hidden field (4ffcd48)
- grid: column menu and filter menu should not extend beyond their popup (9281a90)
- grid: do not flex colorpicker and dropdown opearotr in grid filter row (ab713e7)
- grid: filter button is not visible in ie (b11f198)
- grid: fix background color on selected cell when hovered (75597d4)
- grid: fix buttons misalignment in grid toolbar and group indicator (aeee0ab)
- grid: improve how items are spaced in grid filter row (2138291)
- grid: remove separate hover styling on detail row container (1be1790)
- html: add class name to button icon (f19fe44)
- html: add wrapper around checkbxes when in list (d2ae815)
- html: allow children when using ButtonStatic (d664ae9)
- html: always render checkbox-wrap around checkbox (e623625)
- html: always render radio-wrap around radio (999faf0)
- html: avatar can use forward compatible border radius (22498e1)
- html: button helper should apply forward compatible class names (9b002e9)
- html: move component to its own folder (999b970)
- html: setting shape null should not render class name (c312bc4)
- html: update autocomplete classes to match v4 univesal rendering (150a3a3)
- html: update color picker html helper to reflect v4 universal rendering (7aa0c36)
- html: update combobox classes to match universal v4 rendering (2f77c30)
- html: update dateinput html helper to reflect v4 universal rendering (2aaad75)
- html: update datepicker html helper to reflect v4 universal rendering (9ec0821)
- html: update datetime picker html helper to reflect v4 universal rendering (0a8a9cc)
- html: update dropdown list classes to match universal v4 rendering (4925ef4)
- html: update masked textbox rendering to match universal v4 rendering (ec64529)
- html: update numeric classes to match v4 universal rendering (f39ac52)
- html: update time picker html helper to reflect v4 universal rendering (2a19188)
- image-editor: introduce variable to set action pane width (fff9c07)
- input: input prefix and suffix must not have height (8414a23)
- input: make all inputs to match filled material input (9731e30)
- input: use 200px default width instead of guessing (85fce4a)
- list: better alignment for checkboxes in multiline scenario (d87921a)
- listbox: fix scrolling issue (e7a81db)
- listbox: ser default width to 10 em (20 characters) (6be4719)
- list: improve list item spacing, group heading font weight and no-data container height (a1b5786)
- list: k-list-scoller shouldbe rendered in legacy rendering (ae339f9)
- list: use correct colors for various list parts (efac2c6)
- list: use correct variable values for list and items (15bfcb3)
- listview: remove redundant border rule (ef8486a)
- make scroll buttons consistent in tabstrip, spreadsheet and and chat (72ad38d)
- map: ensure buttons are properly positioned (b7af07c)
- masked-textbox: apply correct appearance in material theme (071ab28)
- maskedtextbox: update styles to match v4 universal rendering (20d3589)
- media-player: ensure correct width of quality selector (c07eb7c)
- menu-button: add styles for button arrow (bb87946)
- menu-button: menu button arrow should be as large as split button arrow (b2f746e)
- menu: add styles for selected menu item (1236f1a)
- menu: expand arrow container should center its icon (5895f6f)
- menu: menu items should be flex column not row (ce981fc)
- numeric: convert styles to v4 universal rendering (f12f787)
- pager: set default width for inputs 5 em (10 characters) (f8332af)
- pdf-viewer: reuse toolbar variables for pdf-viewer search (5c0f71c)
- pivot: add styling to configurator chips (2a11514)
- popover: remove absolute positioning of the popover element (b3cac8c)
- popup: box shadow should follow the same logic from default theme (1982304)
- popup: make padding of popups 0 (d567a72)
- radio: improve ripple styles (9c2cc66)
- reuse styles in adaptive grid filter menu (d04b71c)
- scheduler: adjust edit fields container dimensions and layout (f209db1)
- scheduler: scheduler tooltip no data template should not stretch the tooltip (e7bb71f)
- scrollview: correct translate direction in rtl (0f896a5)
- searchbox: convert styles to v4 universal rendering (d38a6d4)
- set default input width to 10 em (20 characters) (17fbebc)
- set explicit box-sizing border box to most components (e83bec3)
- slider: classic slider should be 56 pixels wide (de0fec4)
- slider: update slider styles to match universal v4 rendering (7884875)
- spreadsheet: hide overflow when frozen columns exceed spreadsheet width (e3443fb)
- switch: align classic theme colors with less themes (b647dcf)
- switch: switch should behave correctly in containers with dir attribute (edee197)
- table: add horizontal border in table header (857397f)
- table: add styles for kendo-jquery table-list with grouping (b126983)
- table: add styles for sticky table group header (da9199f)
- table: group row should be absolutely positioned in virtualization (aa83b3a)
- table: table header and footer should inherit border color (bd09c9d)
- tabstrip: Fix tab overflow when scrollable is set to false (a0d314b)
- tabstrip: scrollable tabstrip should not wrap items (5be3a4c)
- tabstrip: unify tabstrip content padding (d35feb9)
- textarea: text area should be block level element (a0b7426)
- timeselector: remove outline (d9bd390)
- toolbar: add menu component as dependency to toolbar component (90eeb13)
- toolbar: move styles for toolbar overflow container in toolbar files (148a0ab)
- treeview: add styles for treeview filter container (dd5c257)
- treeview: checkboxes need margin on both horizontal sides (396d720)
- treeview: streamline treeview styles to match design better (23a80f3)
- treeview: use correct variable values for treeview and items (37f271a)
- use correct font-size for inputs (f59582f)
- use smaller font size for table list and grid list group labels (0d9a4a3)
- utils: replace circle and pill with full border-radius option (4bf37c6)
- window: use correct line-height for titlebar (3b88d41)
Features
- date-input: extract date input styles into a separate folder (061868a)
- date-picker: extract date picker styles into a separate folder (c3633bd)
- datetime-picker: extract datetime picker styles into a separate folder (e269119)
- html: add floatingactionbutton html helper (ecf47ea)
- html: add helper for no-data component (457c7db)
- html: add html helper for chip and chip-list (5bb16aa)
- html: add html helper for list (5360947)
- html: add html helper for menu button (334e7aa)
- html: add html helper for menu list and menu item (a79f4c1)
- html: add html helper for popup component (bcbabce)
- html: add html helper for split button (82ca86e)
- html: add html helper for treeview (857453a)
- list: extract styles for list component (bff7748)
- panelbar: adds variables to allow customization when expanding panelbar (37215ea)
- slider: convert slider layout to flexbox (16ee221)
- table: add styles for table component (639ea3f)
- time-picker: extract time picker styles into a separate folder (d5e5888)
- time-selector: extract time selector styles into a separate folder (d16b90c)
Reverts
- revert d9ca91e24c5ab5dee9736bdc8888bcb37147f3c7 (acfc62b)
v4.43.0
 (11/29/2021)4.43.0 (2021-11-29)
Bug Fixes
- actions: horizontal action must have explicit width (ef73924)
- adaptive: remove overriding styles for disabled state (f7c4482)
- add global variables wcag-light and wcag-dark to work with contrast-wcag function (c618118)
- autocomplete: use correct colors for invalid state (f2f0144)
- avatar: use 2px border radius for avatar to match v5 (7cd5d1d)
- avatar: vertically align icons inside avatar (932d8bc)
- card: remove redundant styles for buttons (7bed7ff)
- chat: do not remove padding from buttons (f553f0a)
- chat: remove redundant styles for textbox (37587e2)
- chat: reuse button input and toolbar variables (371e9c4)
- chat: stretch scroll buttons (60c1034)
- checkbox: hover state comma is missing (71d4960)
- chip: add k-state-selected class where missed (d568daf)
- color-picker: use slightly tinner indicator for selected color (c51173a)
- color-preview: remove cursor pointer from preview-color element (3aa35fc)
- combobox: make hover state of combobox select consistent with other inputs (d5c2791)
- dropdown-list: select border should be rendered even if transparent (8594965)
- editor: combine editor content and editable area styles (b4a1679)
- editor: simplify editor toolbar by removing redundant styles (b81faef)
- editor: use explicit box-sizing for image resizing (98f459e)
- ensure correct validation icon color in invalid state (627abb2)
- form: make form fields inline-flex instead of flex (1baa806)
- gantt: use box-sizing border box for task and milestones (874d0af)
- grid: decrease column menu icon z-index (84e00f3)
- handle null children better (3db5771)
- html: add icon-picker classname to pickers with icon only (9a0b3cb)
- html: add support for readonly attribute (91f74d3)
- html: colorpicker should pass selected color to color-preview (f6bce2e)
- html: use null value instead of none value (59d4912)
- input: add styles for validation and loading icons (a2253ec)
- make edit-buttons container alias of actions container (04cdf04)
- pager: remove customization for dropdownlist inside pager (6f3bbae)
- pivotgrid: off-screen content is not visible during export (d27c177)
- resolve w3c validator errors (c65cb67)
- scheduler: remove further customization from mobile scheduler views dropdown (db3733a)
- searchbox: add box-sizing to searchbox (97acba6)
- searchbox: use correct colors for invalid state (6c947d0)
- separator: streamline separator styles (3a4cc7a)
- slider: remove redundant box shadow on slider buttons (e907b6f)
- switch: use solid color for checked disabled switch (d5b87bf)
- tabstrip: ensure k-tabstrip-content and k-tabstrip k-content styles are identical (374ee33)
- tabstrip: tab alignment not working (d60b4f6)
- tabstrip: unify tabstrip appearance inside window (e3c3336)
- use consistent border width for select button in inputs and pickers (d517f2a)
- use correct border radius for select button in rtl inputs (9236b39)
- utils: use different border-radius for different themes (c3991c7)
- window: add styles for window buttons container (a73fba6)
Features
v4.42.0
 (10/18/2021)4.42.0 (2021-10-18)
Bug Fixes
- actions: add styles for vertical orientation of actions (9747e10)
- button: update button dependencies to include typography (5bff00a)
- captcha: import missing dependencies (0c79daa)
- grid: replace hardcoded vertical border width (e4a3c13)
- html: add global default props for all components (2202b43)
- html: expose init function for manually triggering init (5974061)
- html: handle global boolean attributes without value (28bf2d2)
- html: handle html attributes in button html helper (c3f4a7b)
- html: handle native elements in renderDOM more gracefully (93f1ed4)
- html: make className global default property (a69f83a)
- html: set certain attributes in a different way (0636c8e)
- html: use element.replaceWith instead of element.outerHTML (e3864e4)
- html: use InputSuffixStatic for input suffixes (d416083)
- map: override icon button styles in navigator (9e88414)
- orgchart: import missing dependencies (bc8d649)
- pivotgrid: use standard flex syntax (62e9656)
- scheduler: react scheduler timeline view cells doesn't render correctly (aebb314)
- spreadsheet: use standard flex syntax (23b16e7)
- swatches: classic green swatch does not have correct base theme (1197d6f)
- toolbar: apply correct color to disabled primary button (9551ebf)
Features
- add utils modules to nouvelle (only grid and flex) (6d90e6f)
- autocomplete: use :where styles for autocomplete (780f841)
- button: use :where styles for button (176f2b2)
- chip: update component to match latest design (5b63b95)
- colorpicker: update component rendering and styles to match latest design (a0bb137)
- combobox: use :where styles for combobox (84a18e8)
- convert nouvelle to new module system (c7d8b02)
- dropdownlist: use :where styles for dropdownlist (dace4cc)
- editor: implement resizable class (cf1ac55)
- fab: update styles to match the latest design (31c1615)
- html: add html helper for autocomplete (6aff19e)
- html: add html helper for checkbox (1afeeb3)
- html: add html helper for colorpicker (678746d)
- html: add html helper for combobox (3fa76fd)
- html: add html helper for dropdownlist (6ad5907)
- html: add html helper for radiobutton (5610ac1)
- html: add html helper for searchbox (3c22499)
- html: add html helper for switch (2a061f9)
- html: add html helpers for button (7d8b8e8)
- html: add html helpers for masked textbox (c8d5021)
- html: add html helpers for numeric (dc54a15)
- html: add html helpers for textarea (d7f5e5d)
- html: add html helpers for Textbox (3ae05f4)
- introduce new module system for nouvelle theme (914f3b4)
- textbox: extract textbox as a separate module (6c98361)
- use box-sizing border-box for all elements (0b14ce9)
- utils: add gap utility classes (8a1f8e0)
- utils: add more border-radius utility classes (701056f)
- utils: extract theme color utility classes into utils module (e1b51df)
v4.41.2
 (9/13/2021)4.41.2 (2021-09-13)
Bug Fixes
- button: button uses incorrect colors in material dark swatches (c958e5a)
- button: clear button should inherit color (289985f)
- buttons: apply correct color of the Material primary outline button in selected state (6224d28)
- chat: add styles for links in bubbles (31e22b3)
- checkbox: checkbox uses incorrect colors in material dark swatches (ced2117)
- chip: chip uses incorrect colors in material dark swatches (52cf719)
- combobox: select arrow doesnt have padding in classic theme (6959648)
- dark-swatches: use conditional border color based on theme luminosity (14c2d01)
- dataviz: always use white or white text color for chart tooltip (2ee6aa7)
- dataviz: dont override selection colors with series colors (0a53881)
- dataviz: use conditional black or white colors for chart lines (e205eda)
- drag-drop: drag hint uses incorrect colors in material dark swatches (9350a10)
- grid: don't use transparent background for headers (0388b59)
- grid: grid uses incorrect colors in material dark swatches (f69bbf7)
- grid: use correct colors for hover and alternatig grid rows in bootstrap dark swatches (3472950)
- inputs: use correct shadow spread for invalid shadow (046d443)
- inputs: use k-hidden instead of display none to show hide warning icon (7e387d7)
- input: use correct placeholder color in dark themes (4bb2337)
- material: add the option to auto ajust contrast for material swatches (058c115)
- material: tweak the value of pink 500 to have better contrast against white (0fc9eff)
- notification: notification icons are misaligned with text in material theme (c3b55a4)
- pager: add missing k-state-focused selector (8d8de00)
- pager: pager uses incorrect colors in material dark swatches (013090b)
- pivotgrid: remove double border in pivotgrid headers (924b52c)
- popover: remove padding from popover (9bcd287)
- popover: use correct colors in popover for dark swatches (f5c8176)
- progressbar: progressbar uses incorrect colors in material dark swatches (c232291)
- radio: radio button uses incorrect colors in material dark swatches (0091c3d)
- rename Fuschia swatch to Nova (8773e40)
- skeleton: use correct colors in dark swatches (fbdde90)
- slider: slider uses incorrect colors in material dark swatches (96ea086)
- split-button: apply correct border-radius in rtl (a2f9f0f)
- task-board: use correct colors for bootstrap dark swatches (f302c39)
- textarea: textarea uses incorrect colors in material dark swatches (98558db)
- tooltip: use conditional colors for tooltip in bootstrap dark swatches (83a8709)
- tweak material swatches to ensure better contrast ratio (4b4aaea)
- use correct colors for component, slider and toolbar in default dark swatch (32c2356)
v4.41.1
 (9/6/2021)v4.41.0
 (8/13/2021)v4.40.1
 (7/28/2021)4.40.1 (2021-07-28)
Note: Version bump only for package kendo-themes