Last Updated: 21 May 2024 14:26 by Abhi
Created on: 21 May 2024 14:26
Category: Grid
Type: Bug Report
Difference between the theme files distributed through NuGet and CDN

Bug report

There are multiple differences in the theme files. In the theme file added by the NuGet browser-specific styles are missing and calc values differ. Likely the issue is due to autoprefixer and postcss-calc being used in the kendo-themes repo: https://github.com/telerik/kendo-themes/blob/develop/postcss.config.js
and not being used in theme compilation logic in the kendo repo:

Reproduction of the problem

  1. In an ASP.NET MVC app install the Telerik.UI.for.AspNet.Mvc NuGet package.
  2. The NuGet package adds the kendo theme files to the MyApp\Content\kendo\2024.2.514
  3. Open the classic-silver.css file added by the NuGet package and compare it to the file hosted on the CDN: https://kendo.cdn.telerik.com/themes/8.0.1/classic/classic-silver.css

Current behavior

There are multiple differences similar to the exemplary ones posted below:

Example 1:
CDN line 33994:

.k-menu-vertical > .k-menu-item > .k-menu-link > .k-menu-expand-arrow {
    margin-inline-start: var(--kendo-spacing-2, 0.5rem);
    margin-inline-end: calc(var(--kendo-spacing-2, 0.5rem)*2*-1 + -16px - var(--kendo-spacing-2, 0.5rem)/2*-1);


.k-menu-vertical > .k-menu-item > .k-menu-link > .k-menu-expand-arrow {
    margin-inline-start: var(--kendo-spacing-2, 0.5rem);
    margin-inline-end: calc( -1 * (calc( var(--kendo-spacing-2, 0.5rem) * 2 + 16px) - var(--kendo-spacing-2, 0.5rem)/2));

Note the difference in the margin-inline-end value.

Example 2:
CDN line 36510:

.k-progressbar-vertical .k-progress-status {
    -ms-writing-mode: tb-lr;
        writing-mode: vertical-lr;


.k-progressbar-vertical .k-progress-status {
    writing-mode: vertical-lr;

Expected/desired behavior

The theme files distributed through CDN and NuGet should be identical.


  • Kendo UI version: 2024.2.514
  • jQuery version: x.y
  • Browser: [all ]