@progress/kendo-theme-default 6.4.0-dev.2 → 6.4.0-dev.4

package/scss/editor/_layout.scss

@@ -117,12 +117,13 @@
         }
     }
 
-    .ProseMirror-selectednode { // sass-lint:disable-line class-name-format
+    // stylelint-disable selector-no-vendor-prefix, selector-class-pattern
+    .ProseMirror-selectednode {
         outline-width: $kendo-editor-selectednode-outline-width;
         outline-style: solid;
 
     }
-    .ProseMirror-hideselection { // sass-lint:disable-line class-name-format
+    .ProseMirror-hideselection {
         caret-color: transparent;
 
         *::selection,
@@ -130,7 +131,7 @@
             background: transparent;
         }
     }
-
+    // stylelint-enable selector-no-vendor-prefix, selector-class-pattern
 
     // Toolbar
     .k-editor-toolbar {
@@ -163,7 +164,7 @@
             display: block;
         }
 
-        > .ProseMirror { // sass-lint:disable-line class-name-format
+        > .ProseMirror { // stylelint-disable-line
             padding: $kendo-padding-md-x;
             width: 100%;
             height: 100%;
@@ -188,7 +189,7 @@
             }
 
             &[contenteditable="false"] {
-                cursor: unset !important; // sass-lint:disable-line no-important
+                cursor: unset !important; // stylelint-disable-line declaration-no-important
 
                 .k-editor-resize-handles-wrapper,
                 .k-editor-resize-handle,
@@ -202,7 +203,7 @@
                     pointer-events: none;
                 }
 
-                & .ProseMirror-selectednode { // sass-lint:disable-line class-name-format
+                & .ProseMirror-selectednode { // stylelint-disable-line
                     outline: none;
                 }
             }
@@ -247,7 +248,7 @@
         }
 
         // Give selected cells a blue overlay
-        .selectedCell::after { // sass-lint:disable-line class-name-format
+        .selectedCell::after { // stylelint-disable-line
             z-index: 2;
             position: absolute;
             content: "";

package/scss/editor/_theme.scss

@@ -56,7 +56,7 @@
         background-color: $kendo-editor-resize-handle-bg;
         border-color: $kendo-editor-resize-handle-border;
     }
-    .ProseMirror-selectednode { // sass-lint:disable-line class-name-format
+    .ProseMirror-selectednode { // stylelint-disable-line
         outline-color: $kendo-editor-selectednode-outline-color;
     }
 
@@ -92,7 +92,7 @@
             border-color: #dddddd;
         }
 
-        .selectedCell::after { // sass-lint:disable-line class-name-format
+        .selectedCell::after { // stylelint-disable-line
             background-color: rgba(200, 200, 255, .4);
         }
     }

package/scss/editor/_variables.scss

@@ -20,4 +20,4 @@ $kendo-editor-resize-handle-border: #000000 !default;
 $kendo-editor-resize-handle-bg: #ffffff !default;
 
 $kendo-editor-selectednode-outline-width: 2px !default;
-$kendo-editor-selectednode-outline-color: #8cf !default; // sass-lint:disable-line hex-length
+$kendo-editor-selectednode-outline-color: #88ccff !default;

package/scss/fab/_variables.scss

@@ -45,13 +45,13 @@ $kendo-fab-lg-padding-y: ( $kendo-fab-padding-y * 1.5 ) !default;
 
 /// The horizontal padding of the FAB icon.
 /// @group floating-action-button
-$kendo-fab-icon-padding-x: k-map-get( $kendo-spacing, 0.5 ) !default; // sass-lint:disable-line leading-zero
+$kendo-fab-icon-padding-x: k-map-get( $kendo-spacing, 0.5 ) !default;
 /// The vertical padding of the FAB icon.
 /// @group floating-action-button
 $kendo-fab-icon-padding-y: $kendo-fab-icon-padding-x !default;
 /// The spacing of the FAB icon.
 /// @group floating-action-button
-$kendo-fab-icon-spacing: k-map-get( $kendo-spacing, 0.5 ) !default; // sass-lint:disable-line leading-zero
+$kendo-fab-icon-spacing: k-map-get( $kendo-spacing, 0.5 ) !default;
 
 /// The horizontal padding of the FAB items.
 /// @group floating-action-button
@@ -127,7 +127,7 @@ $kendo-fab-active-shadow: null !default;
 $kendo-fab-outline-style: solid !default;
 /// The outline width of the FAB.
 /// @group floating-action-button
-$kendo-fab-outline-width: k-map-get( $kendo-spacing, 0.5 ) !default; // sass-lint:disable-line leading-zero
+$kendo-fab-outline-width: k-map-get( $kendo-spacing, 0.5 ) !default;
 
 /// The base text color of the FAB item.
 /// @group floating-action-button
@@ -163,7 +163,7 @@ $kendo-fab-item-active-shadow: $kendo-fab-active-shadow !default;
 $kendo-fab-item-outline-style: solid !default;
 /// The outline width of the FAB item.
 /// @group floating-action-button
-$kendo-fab-item-outline-width: k-map-get( $kendo-spacing, 0.5 ) !default; // sass-lint:disable-line leading-zero
+$kendo-fab-item-outline-width: k-map-get( $kendo-spacing, 0.5 ) !default;
 /// The outline color of the FAB item.
 /// @group floating-action-button
 $kendo-fab-item-outline-color: rgba(0, 0, 0, .08) !default;

package/scss/floating-label/_variables.scss

@@ -3,7 +3,7 @@
 /// The transformation scale of the Floating Label.
 /// @group floating-label
 $kendo-floating-label-scale: 1 !default;
-///The font size of the Floating Label.
+/// The font size of the Floating Label.
 /// @group floating-label
 $kendo-floating-label-font-size: $kendo-input-font-size !default;
 /// The maximum width of the Floating Label.

package/scss/forms/_layout.scss

@@ -61,8 +61,8 @@
     .k-form {
         border: 0;
 
-        .k-label,
-        kendo-label,
+        .k-form-field > .k-label,
+        .k-form-field > kendo-label,
         .k-form-label {
             margin-bottom: $kendo-form-label-margin-bottom;
             display: flex;

package/scss/gantt/_layout.scss

@@ -219,7 +219,7 @@
 
 
     // Responsive gantt toolbar
-    @media (max-width: 480px) {
+    @media (max-width: 480px) { // stylelint-disable-line
 
         .k-gantt-toolbar {
             .k-gantt-toggle {
@@ -240,7 +240,7 @@
 
     }
 
-    @media (max-width: 1024px) {
+    @media (max-width: 1024px) { // stylelint-disable-line
         .k-gantt-views-wrapper .k-gantt-views { display: none; }
         .k-gantt-views-wrapper .k-views-dropdown { display: flex; }
     }
@@ -265,7 +265,7 @@
         }
         .k-grid-header,
         .k-grid-footer {
-            padding: 0 !important; // sass-lint:disable-line no-important
+            padding: 0 !important; // stylelint-disable-line declaration-no-important
         }
         .k-grid-header tr {
             height: calc( #{$kendo-line-height-em} * 2 + #{$kendo-grid-header-padding-y * 4} + 2px );
@@ -774,9 +774,9 @@
         .k-gantt,
         .k-gantt-timeline,
         .k-gantt-dependencies {
-            width: auto !important; // sass-lint:disable-line no-important
-            height: auto !important; // sass-lint:disable-line no-important
-            overflow: visible !important; // sass-lint:disable-line no-important
+            width: auto !important; // stylelint-disable-line declaration-no-important
+            height: auto !important; // stylelint-disable-line declaration-no-important
+            overflow: visible !important; // stylelint-disable-line declaration-no-important
         }
 
         .k-gantt-treelist .k-treelist {

package/scss/grid/_layout.scss

@@ -524,7 +524,8 @@
     }
 
     .k-grid-filter-popup {
-        min-width: 200px;
+        min-width: $kendo-grid-column-menu-width;
+        max-width: $kendo-grid-column-menu-max-width;
     }
 
     // Standalone column menu
@@ -1095,17 +1096,18 @@
     }
 
     // Remove Grid scrollbar during built-in export
+    // stylelint-disable declaration-no-important
     .k-pdf-export-shadow {
         .k-grid {
             float: left;
-            width: auto !important; // sass-lint:disable-line no-important
+            width: auto !important;
         }
 
         // Remove all sizes and scrolling
         .k-grid,
         .k-grid-content,
         .k-grid-content-locked {
-            height: auto !important; // sass-lint:disable-line no-important
+            height: auto !important;
             overflow: visible;
         }
 
@@ -1113,21 +1115,23 @@
             & + .k-grid-header-wrap,
             & + .k-grid-content,
             & + .k-grid-footer-wrap {
-                width: auto !important; // sass-lint:disable-line no-important
+                width: auto !important;
             }
         }
 
         // Remove empty space reserved above .k-table-the scrollbar
         .k-grid-header,
         .k-grid[data-role="grid"] .k-grid-footer {
-            padding: 0 !important; // sass-lint:disable-line no-important
+            padding: 0 !important;
         }
     }
+    // stylelint-enable declaration-no-important
 
 
     // Filter menu
     .k-filter-menu-popup {
-        width: $kendo-grid-column-menu-width;
+        min-width: $kendo-grid-column-menu-width;
+        max-width: $kendo-grid-column-menu-max-width;
     }
     .k-filter-menu {
         box-sizing: border-box;
@@ -1171,7 +1175,8 @@
     .k-grid-filter-popup.k-popup {
 
         .k-filter-menu-container {
-            width: $kendo-grid-column-menu-width;
+            min-width: $kendo-grid-column-menu-width;
+            max-width: $kendo-grid-column-menu-max-width;
         }
     }
 
@@ -1202,19 +1207,17 @@
 
     // autofitting requires automatic table layout to measure sizes
     .k-autofitting {
-        // sass-lint:disable-block no-important
-
-        width: auto !important;
-        table-layout: auto !important;
+        width: auto !important; // stylelint-disable-line declaration-no-important
+        table-layout: auto !important; // stylelint-disable-line declaration-no-important
 
         .k-table-th,
         td,
         .k-table-td {
-            white-space: nowrap !important;
+            white-space: nowrap !important; // stylelint-disable-line declaration-no-important
         }
 
         .k-detail-row {
-            display: none !important;
+            display: none !important; // stylelint-disable-line declaration-no-important
         }
     }
 
@@ -1223,13 +1226,13 @@
     // Column menu
     .k-column-menu-popup,
     .k-grid-columnmenu-popup {
-        width: $kendo-grid-column-menu-width;
+        min-width: $kendo-grid-column-menu-width;
         box-sizing: border-box;
 
         &.k-popup {
             padding-block: $kendo-grid-column-menu-popup-padding-y;
             padding-inline: $kendo-grid-column-menu-popup-padding-x;
-            max-width: 100%;
+            max-width: $kendo-grid-column-menu-max-width;
         }
 
         .k-actions {
@@ -1351,6 +1354,18 @@
         flex: 1 1 auto;
     }
 
+    .k-rtl .k-grid-virtual .k-grid-content,
+    [dir="rtl"] .k-grid-virtual .k-grid-content,
+    .k-rtl.k-grid-virtual .k-grid-content,
+    [dir="rtl"].k-grid-virtual .k-grid-content {
+
+        .k-grid-table-wrap,
+        .k-grid-table,
+        > .k-height-container {
+            float: right;
+        }
+    }
+
 }
 
 

package/scss/grid/_variables.scss

@@ -62,7 +62,7 @@ $kendo-grid-sm-cell-padding-y: $kendo-grid-sm-padding-y !default;
 $kendo-grid-sm-filter-cell-padding-x: k-map-get( $kendo-spacing, 1.5 ) !default;
 $kendo-grid-sm-filter-cell-padding-y: $kendo-grid-sm-filter-cell-padding-x !default;
 $kendo-grid-sm-edit-cell-padding-x: $kendo-grid-sm-cell-padding-x !default;
-$kendo-grid-sm-edit-cell-padding-y: k-map-get( $kendo-spacing, 0.5 ) !default; // sass-lint:disable-line leading-zero
+$kendo-grid-sm-edit-cell-padding-y: k-map-get( $kendo-spacing, 0.5 ) !default;
 $kendo-grid-sm-group-dropclue-height: calc( #{$kendo-chip-sm-calc-size} + #{$kendo-grid-group-drop-hint-size}) !default;
 $kendo-grid-sm-selection-aggregates-padding-x: $kendo-grid-sm-padding-y !default;
 $kendo-grid-sm-selection-aggregates-padding-y: $kendo-grid-sm-padding-y !default;
@@ -259,6 +259,7 @@ $kendo-grid-sticky-hover-bg: k-color-darken($kendo-grid-bg, 8%) !default;
 $kendo-grid-sticky-selected-hover-bg: k-color-shade($kendo-grid-sticky-selected-bg, .7) !default;
 
 $kendo-grid-column-menu-width: 230px !default;
+$kendo-grid-column-menu-max-width: 320px !default;
 
 $kendo-grid-filter-menu-check-all-border-bottom-width: 1px !default;
 

package/scss/icons/_layout.scss

@@ -45,6 +45,10 @@ $ki-icon-size: $kendo-icon-size;
         right: 0;
         margin: 0 -.5em -.5em 0;
     }
+    .k-svg-icon.k-icon-modifier {
+        width: 1em;
+        height: 1em;
+    }
 
     .k-i-none::before {
         content: "";
@@ -56,19 +60,6 @@ $ki-icon-size: $kendo-icon-size;
         cursor: pointer;
     }
 
-    // RTL icons
-    .k-rtl,
-    [dir="rtl"] {
-        .k-i-indent-increase,
-        .k-i-indent-decrease,
-        .k-i-caret-alt-right,
-        .k-i-caret-alt-left,
-        .k-svg-i-caret-alt-right,
-        .k-svg-i-caret-alt-left {
-            transform: scaleX(-1);
-        }
-    }
-
     .k-sprite {
         display: inline-block;
         width: 16px;

package/scss/input/_layout.scss

@@ -35,7 +35,7 @@
 
         > .k-input,
         > .k-picker {
-            border-width: 0 !important; // sass-lint:disable-line no-important
+            border-width: 0 !important; // stylelint-disable-line declaration-no-important
             color: inherit;
             background: none;
             font: inherit;
@@ -304,8 +304,8 @@
         box-shadow: none;
 
         > .k-button-icon {
-            min-width: auto !important; // sass-lint:disable-line no-important
-            // min-height: auto !important; // sass-lint:disable-line no-important
+            min-width: auto !important; // stylelint-disable-line declaration-no-important
+            // min-height: auto !important; // stylelint-disable-line declaration-no-important
         }
 
         &:focus {
@@ -338,8 +338,8 @@
             .k-button-icon {
                 margin-block: -1em;
                 margin-inline: 0;
-                min-width: auto !important; // sass-lint:disable-line no-important
-                min-height: auto !important; // sass-lint:disable-line no-important
+                min-width: auto !important; // stylelint-disable-line declaration-no-important
+                min-height: auto !important; // stylelint-disable-line declaration-no-important
             }
         }
         .k-spinner-increase .k-icon,
@@ -382,14 +382,14 @@
     // Fill mode
     .k-input-flat,
     .k-picker-flat {
-        @include border-bottom-radius( 0 !important ); // sass-lint:disable-line no-important
+        @include border-bottom-radius( 0 !important ); // stylelint-disable-line declaration-no-important
         border-width: $kendo-input-border-width 0;
-        border-top-color: transparent !important; // sass-lint:disable-line no-important
-        background-image: none !important; // sass-lint:disable-line no-important
+        border-top-color: transparent !important; // stylelint-disable-line declaration-no-important
+        background-image: none !important; // stylelint-disable-line declaration-no-important
     }
 
     .k-input-outline {
-        background: none !important; // sass-lint:disable-line no-important
+        background: none !important; // stylelint-disable-line declaration-no-important
     }
 
 
@@ -442,8 +442,8 @@
             }
 
             &.k-icon-picker .k-input-inner {
-                width: calc( #{$_line-height * 1em} );
-                height: calc( #{$_line-height * 1em} );
+                width: calc( #{ $_line-height * 1em } );
+                height: calc( #{ $_line-height * 1em } );
                 padding: $_padding-y;
                 box-sizing: content-box;
             }
@@ -470,11 +470,11 @@
 
 
     // This is needed for the textbox container to capture browser autofill
-    @keyframes autoFillStart {
+    @keyframes autoFillStart { // stylelint-disable-line
         from {}
         to {}
     }
-    @keyframes autoFillEnd {
+    @keyframes autoFillEnd { // stylelint-disable-line
         from {}
         to {}
     }

package/scss/input/_variables.scss

@@ -30,7 +30,7 @@ $kendo-input-lg-padding-x: k-map-get( $kendo-spacing, 2 ) !default;
 $kendo-input-padding-y: k-map-get( $kendo-spacing, 1 ) !default;
 /// The vertical padding of the small Input components.
 /// @group input
-$kendo-input-sm-padding-y: k-map-get( $kendo-spacing, 0.5 ) !default; // sass-lint:disable-line leading-zero
+$kendo-input-sm-padding-y: k-map-get( $kendo-spacing, 0.5 ) !default;
 /// The vertical padding of the medium Input components.
 /// @group input
 $kendo-input-md-padding-y: $kendo-input-padding-y !default;
@@ -247,7 +247,7 @@ $kendo-input-clear-value-hover-opacity: 1 !default;
 
 /// The vertical margin of the clear value icon.
 /// @group input
-$kendo-input-values-margin-y: k-map-get( $kendo-spacing, 0.5 ) !default; // sass-lint:disable-line leading-zero
+$kendo-input-values-margin-y: k-map-get( $kendo-spacing, 0.5 ) !default;
 /// The horizontal margin of the clear value icon.
 /// @group input
 $kendo-input-values-margin-x: $kendo-input-values-margin-y !default;

package/scss/list/_layout.scss

@@ -46,7 +46,7 @@
         padding-block: $kendo-list-header-padding-y;
         padding-inline: $kendo-list-header-padding-x;
         border-width: 0;
-        border-width: $kendo-list-header-border-width; // sass-lint:disable-line no-duplicate-properties
+        border-width: $kendo-list-header-border-width;
         border-style: solid;
         font-size: $kendo-list-header-font-size;
         line-height: $kendo-list-header-line-height;
@@ -131,7 +131,7 @@
         padding-block: $kendo-list-group-item-padding-y;
         padding-inline: $kendo-list-group-item-padding-x;
         border-width: 0;
-        border-width: $kendo-list-group-item-border-width; // sass-lint:disable-line no-duplicate-properties
+        border-width: $kendo-list-group-item-border-width;
         border-style: solid;
         font-size: $kendo-list-group-item-font-size;
         line-height: $kendo-list-group-item-line-height;

package/scss/list/_variables.scss

@@ -28,7 +28,7 @@ $kendo-list-lg-header-padding-x: k-map-get( $kendo-spacing, 2 ) !default;
 /// The vertical padding of the List header, if no size is set.
 /// @group list
 $kendo-list-header-padding-y: null !default;
-$kendo-list-sm-header-padding-y: k-map-get( $kendo-spacing, 0.5 ) !default; // sass-lint:disable-line leading-zero
+$kendo-list-sm-header-padding-y: k-map-get( $kendo-spacing, 0.5 ) !default;
 $kendo-list-md-header-padding-y: k-map-get( $kendo-spacing, 1 ) !default;
 $kendo-list-lg-header-padding-y: k-map-get( $kendo-spacing, 1.5 ) !default;
 
@@ -64,7 +64,7 @@ $kendo-list-lg-item-padding-x: k-map-get( $kendo-spacing, 2 ) !default;
 /// The vertical padding of the List items, when no size is set.
 /// @group list
 $kendo-list-item-padding-y: null !default;
-$kendo-list-sm-item-padding-y: k-map-get( $kendo-spacing, 0.5 ) !default; // sass-lint:disable-line leading-zero
+$kendo-list-sm-item-padding-y: k-map-get( $kendo-spacing, 0.5 ) !default;
 $kendo-list-md-item-padding-y: k-map-get( $kendo-spacing, 1 ) !default;
 $kendo-list-lg-item-padding-y: k-map-get( $kendo-spacing, 2 ) !default;
 
@@ -92,7 +92,7 @@ $kendo-list-lg-group-item-padding-x: k-map-get( $kendo-spacing, 2 ) !default;
 /// The vertical padding of the List group items, when no size is set.
 /// @group list
 $kendo-list-group-item-padding-y: null !default;
-$kendo-list-sm-group-item-padding-y: k-map-get( $kendo-spacing, 0.5 ) !default; // sass-lint:disable-line leading-zero
+$kendo-list-sm-group-item-padding-y: k-map-get( $kendo-spacing, 0.5 ) !default;
 $kendo-list-md-group-item-padding-y: k-map-get( $kendo-spacing, 1 ) !default;
 $kendo-list-lg-group-item-padding-y: k-map-get( $kendo-spacing, 1.5 ) !default;
 

package/scss/listbox/_index.scss

@@ -20,7 +20,6 @@ $_kendo-module-meta: (
 @import "../popup/_index.scss";
 @import "../list/_index.scss";
 @import "../icons/_index.scss";
-@import "../list/_index.scss";
 
 
 // Component

package/scss/listbox/_layout.scss

@@ -71,15 +71,6 @@
         .k-ghost {
             opacity: .5;
         }
-
-        .k-rtl &,
-        &[dir="rtl"],
-        [dir="rtl"] & {
-
-            .k-listbox-actions .k-button-icon {
-                transform: scaleX(-1);
-            }
-        }
     }
 
     .k-item {

package/scss/listgroup/_layout.scss

@@ -154,11 +154,6 @@
                 > .k-select {
                     right: auto;
                     left: 0;
-
-                    .k-icon,
-                    .k-svg-icon {
-                        transform: scaleX(-1);
-                    }
                 }
             }
         }
@@ -174,11 +169,6 @@
                 margin-left: -$kendo-listgroup-item-padding-x;
                 border-right-width: 1px;
                 border-left-width: 0;
-
-                .k-icon,
-                .k-svg-icon {
-                    transform: scaleX(-1);
-                }
             }
         }
     }

package/scss/loader/_layout.scss

@@ -551,7 +551,7 @@
         content: "";
         // See https://github.com/telerik/kendo-themes/issues/1925
         border-width: 1px; // TODO: Remove once we drop IE support
-        border-width: clamp( .015em, 1px, 1px ); // sass-lint:disable-line no-duplicate-properties
+        border-width: clamp( .015em, 1px, 1px );
         font-size: 4em;
     }
 

package/scss/loader/_theme.scss

@@ -16,11 +16,9 @@
     }
 
     .k-loader-container-inner {
-        // sass-lint:disable-block no-important
-        // sass-lint:disable-block class-name-format
         .k-text-secondary,
-        .\!k-text-secondary {
-            color: $kendo-loader-secondary-bg !important;
+        .\!k-text-secondary { // stylelint-disable-line
+            color: $kendo-loader-secondary-bg !important; // stylelint-disable-line declaration-no-important
         }
     }
 

package/scss/mediaplayer/_layout.scss

@@ -51,9 +51,7 @@
     }
     .k-mediaplayer-toolbar {
         border-width: 0;
-        // sass-lint:disable no-important
-        width: 100% !important;
-        // sass-lint:enable no-important
+        width: 100% !important; // stylelint-disable-line declaration-no-important
         box-shadow: none;
 
 
@@ -84,9 +82,7 @@
         transform: translateY( -50% );
     }
     .k-mediaplayer-seekbar .k-slider-track {
-        // sass-lint:disable no-important
-        width: 100% !important;
-        // sass-lint:enable no-important
+        width: 100% !important; // stylelint-disable-line declaration-no-important
         border-radius: 0;
     }
     .k-mediaplayer-seekbar .k-slider-selection {
@@ -98,10 +94,8 @@
         position: fixed;
         top: 0;
         left: 0;
-        // sass-lint:disable no-important
-        width: 100% !important;
-        height: 100% !important;
-        // sass-lint:enable no-important
+        width: 100% !important; // stylelint-disable-line declaration-no-important
+        height: 100% !important; // stylelint-disable-line declaration-no-important
     }
 
 }