@progress/kendo-theme-default 5.5.0 → 5.5.1-dev.0

package/lib/swatches/default-blue.json

@@ -3,7 +3,7 @@
     "name": "Default Blue",
     "product": "kendo",
     "base": "@progress/kendo-theme-default",
-    "version": "5.5.0",
+    "version": "5.5.1-dev.0",
     "previewColors": [
         "#ffffff",
         "#f5f5f5",

package/lib/swatches/default-dataviz-v4.json

@@ -3,7 +3,7 @@
     "name": "Default Dataviz v4",
     "product": "kendo",
     "base": "@progress/kendo-theme-default",
-    "version": "5.5.0",
+    "version": "5.5.1-dev.0",
     "previewColors": [
         "#ff6358",
         "#ffd246",

package/lib/swatches/default-green.json

@@ -3,7 +3,7 @@
     "name": "Default Green",
     "product": "kendo",
     "base": "@progress/kendo-theme-default",
-    "version": "5.5.0",
+    "version": "5.5.1-dev.0",
     "previewColors": [
         "#ffffff",
         "#f5f5f5",

package/lib/swatches/default-main-dark.json

@@ -3,7 +3,7 @@
     "name": "Default Main Dark",
     "product": "kendo",
     "base": "@progress/kendo-theme-default",
-    "version": "5.5.0",
+    "version": "5.5.1-dev.0",
     "previewColors": [
         "#000000",
         "#151515",

package/lib/swatches/default-main.json

@@ -3,7 +3,7 @@
     "name": "Default Main",
     "product": "kendo",
     "base": "@progress/kendo-theme-default",
-    "version": "5.5.0",
+    "version": "5.5.1-dev.0",
     "previewColors": [
         "#ffffff",
         "#f5f5f5",

package/lib/swatches/default-nordic.json

@@ -3,7 +3,7 @@
     "name": "Default Nordic",
     "product": "kendo",
     "base": "@progress/kendo-theme-default",
-    "version": "5.5.0",
+    "version": "5.5.1-dev.0",
     "previewColors": [
         "#ffffff",
         "#50686e",

package/lib/swatches/default-ocean-blue.json

@@ -3,7 +3,7 @@
     "name": "Default Ocean Blue",
     "product": "kendo",
     "base": "@progress/kendo-theme-default",
-    "version": "5.5.0",
+    "version": "5.5.1-dev.0",
     "previewColors": [
         "#ffffff",
         "#f5f5f5",

package/lib/swatches/default-orange.json

@@ -3,7 +3,7 @@
     "name": "Default Orange",
     "product": "kendo",
     "base": "@progress/kendo-theme-default",
-    "version": "5.5.0",
+    "version": "5.5.1-dev.0",
     "previewColors": [
         "#ffffff",
         "#f5f5f5",

package/lib/swatches/default-purple.json

@@ -3,7 +3,7 @@
     "name": "Default Purple",
     "product": "kendo",
     "base": "@progress/kendo-theme-default",
-    "version": "5.5.0",
+    "version": "5.5.1-dev.0",
     "previewColors": [
         "#ffffff",
         "#f5f5f5",

package/lib/swatches/default-turquoise.json

@@ -3,7 +3,7 @@
     "name": "Default Turquoise",
     "product": "kendo",
     "base": "@progress/kendo-theme-default",
-    "version": "5.5.0",
+    "version": "5.5.1-dev.0",
     "previewColors": [
         "#ffffff",
         "#f5f5f5",

package/lib/swatches/default-urban.json

@@ -3,7 +3,7 @@
     "name": "Default Urban",
     "product": "kendo",
     "base": "@progress/kendo-theme-default",
-    "version": "5.5.0",
+    "version": "5.5.1-dev.0",
     "previewColors": [
         "#ffffff",
         "#e3eef4",

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@progress/kendo-theme-default",
   "description": "SASS resources for the default Kendo UI theme",
-  "version": "5.5.0",
+  "version": "5.5.1-dev.0",
   "author": "Progress",
   "license": "Apache-2.0",
   "keywords": [
@@ -36,16 +36,13 @@
     }
   },
   "scripts": {
-    "sass": "gulp sass",
-    "sass:watch": "gulp sass:watch",
-    "sass:swatches": "gulp sass:swatches",
-    "sass:flat": "gulp sass:flat",
-    "dart": "gulp dart",
-    "dart:watch": "gulp dart:watch",
-    "dart:swatches": "gulp dart:swatches",
-    "dart:flat": "gulp dart:flat",
+    "build": "sass-build",
+    "sass": "sass-build",
     "prepublishOnly": "node ../../scripts/themes-prepublish.js",
     "postpublish": "echo 'no postpublish for default theme'"
   },
-  "gitHead": "a8983b1816145854eea44b64fc9ee9bc3c5105f6"
+  "devDependencies": {
+    "sass-build": "^0.0.1"
+  },
+  "gitHead": "f9e886d7414c48c7a576210e6b46d938d27b3125"
 }

package/scss/action-sheet/_theme.scss

@@ -43,7 +43,7 @@
 
         // Hover state
         &:hover,
-        &.k-state-hover ,
+        &.k-state-hover,
         &.k-hover {
             @include fill(
                 $actionsheet-item-hover-text,
@@ -57,7 +57,7 @@
 
         // Focus state
         &:focus,
-        &.k-state-focus ,
+        &.k-state-focus,
         &.k-focus {
             @include fill(
                 $actionsheet-item-focus-text,
@@ -71,7 +71,7 @@
 
         // Disabed state
         &:disabled,
-        &.k-state-disabled ,
+        &.k-state-disabled,
         &.k-disabled {
             @include fill(
                 $actionsheet-item-disabled-text,

package/scss/adaptive/_theme.scss

@@ -82,12 +82,12 @@
 
         .k-column-menu {
 
-            .k-listgroup-item.k-state-selected ,
+            .k-listgroup-item.k-state-selected,
             .k-listgroup-item.k-selected {
                 color: $adaptive-grid-sort-text;
                 background: none;
             }
-            .k-listgroup-item.k-state-selected .k-link ,
+            .k-listgroup-item.k-state-selected .k-link,
             .k-listgroup-item.k-selected .k-link {
                 color: inherit;
             }

package/scss/bottom-navigation/_layout.scss

@@ -80,7 +80,7 @@
             outline: 0;
         }
     }
-    .k-bottom-nav-item.k-state-disabled ,
+    .k-bottom-nav-item.k-state-disabled,
     .k-bottom-nav-item.k-disabled {
         background-color: initial;
     }

package/scss/bottom-navigation/_theme.scss

@@ -16,7 +16,7 @@
                 @include fill( $bg: rgba(true-mix( $color, contrast-wcag( $color ), 35%), .2));
             }
 
-            .k-bottom-nav-item.k-state-selected ,
+            .k-bottom-nav-item.k-state-selected,
             .k-bottom-nav-item.k-selected {
                 @include fill( $color: contrast-wcag( $color ) );
             }
@@ -40,7 +40,7 @@
         }
 
         @each $name, $color in $kendo-theme-colors {
-            &.k-bottom-nav-#{$name} .k-bottom-nav-item.k-state-selected ,
+            &.k-bottom-nav-#{$name} .k-bottom-nav-item.k-state-selected,
             &.k-bottom-nav-#{$name} .k-bottom-nav-item.k-selected {
                 @if $name == "secondary" or $name == "light" {
                     @include fill( $color: try-shade($color, 3) );

package/scss/breadcrumb/_theme.scss

@@ -9,7 +9,7 @@
         );
 
         &:focus,
-        &.k-state-focused ,
+        &.k-state-focused,
         &.k-focus {
             @include box-shadow( $breadcrumb-focused-shadow );
         }
@@ -26,7 +26,7 @@
 
         // Hovered state
         &:hover,
-        &.k-state-hover ,
+        &.k-state-hover,
         &.k-hover {
             @include fill(
                 $breadcrumb-link-hovered-text,
@@ -37,7 +37,7 @@
 
         // Focused state
         &:focus,
-        &.k-state-focused ,
+        &.k-state-focused,
         &.k-focus {
             @include fill(
                 $breadcrumb-link-focused-text,
@@ -59,7 +59,7 @@
 
         // Hovered state
         &:hover,
-        &.k-state-hover ,
+        &.k-state-hover,
         &.k-hover {
             @include fill(
                 $breadcrumb-root-link-hovered-text,
@@ -70,7 +70,7 @@
 
         // Focused state
         &:focus,
-        &.k-state-focused ,
+        &.k-state-focused,
         &.k-focus {
             @include fill(
                 $breadcrumb-root-link-focused-text,

package/scss/calendar/_layout.scss

@@ -386,7 +386,7 @@
         }
 
         // // styles are applied to the k-link element inside
-        // .k-state-selected ,
+        // .k-state-selected,
         // .k-selected {
         //     color: inherit;
         //     background: transparent;
@@ -412,6 +412,10 @@
             &::after {
                 display: none;
             }
+
+            &:focus {
+                outline: 0;
+            }
         }
 
         .k-range-start {

package/scss/chat/_layout.scss

@@ -152,7 +152,7 @@
 
 
         // Message states
-        .k-message.k-state-selected ,
+        .k-message.k-state-selected,
         .k-message.k-selected {
             margin-bottom: $chat-item-spacing-y;
             border: 0;
@@ -362,7 +362,7 @@
             flex: 0 0 auto;
         }
 
-        &.k-state-selected ,
+        &.k-state-selected,
         &.k-selected {
             background: none;
         }

package/scss/chat/_theme.scss

@@ -38,7 +38,7 @@
         .k-bubble:hover {
             @include box-shadow( $chat-bubble-hover-shadow );
         }
-        .k-state-selected .k-bubble ,
+        .k-state-selected .k-bubble,
         .k-selected .k-bubble {
             @include box-shadow( $chat-bubble-selected-shadow );
         }
@@ -54,7 +54,7 @@
         .k-alt .k-bubble:hover {
             @include box-shadow( $chat-alt-bubble-hover-shadow );
         }
-        .k-alt .k-state-selected .k-bubble ,
+        .k-alt .k-state-selected .k-bubble,
         .k-alt .k-selected .k-bubble {
             @include box-shadow( $chat-alt-bubble-selected-shadow );
         }

package/scss/chip/_variables.scss

@@ -5,7 +5,7 @@
 $kendo-chip-border-width: 1px !default;
 /// The spacing between the text and the icons of the chip.
 /// @group chip
-$kendo-chip-spacing: map-get( $spacing, 1 );
+$kendo-chip-spacing: map-get( $spacing, 1 ) !default;
 
 /// Horizontal padding of the chip.
 /// @group chip

package/scss/colorpalette/_layout.scss

@@ -49,7 +49,7 @@
         &.k-focus,
         &.k-state-selected,
         &.k-selected,
-        &.k-state-selected:hover ,
+        &.k-state-selected:hover,
         &.k-selected:hover {
             position: relative;
             z-index: 100;

package/scss/dataviz/_theme.scss

@@ -144,7 +144,7 @@
         .k-leaf.k-inverse {
             color: $component-text;
         }
-        .k-leaf.k-state-hover ,
+        .k-leaf.k-state-hover,
         .k-leaf.k-hover {
             box-shadow: inset 0 0 0 3px $component-border;
         }

package/scss/drawer/_theme.scss

@@ -25,33 +25,33 @@
     .k-drawer-item {
 
         &:hover,
-        &.k-state-hover ,
+        &.k-state-hover,
         &.k-hover {
             color: $drawer-hovered-text;
             background-color: $drawer-hovered-bg;
         }
 
         &:focus,
-        &.k-state-focused ,
+        &.k-state-focused,
         &.k-focus {
             background-color: $drawer-focused-bg;
             box-shadow: $drawer-focused-shadow;
 
             &:hover,
-            &.k-state-hover ,
+            &.k-state-hover,
             &.k-hover {
                 color: $drawer-hovered-text;
                 background-color: $drawer-hovered-bg;
             }
         }
 
-        &.k-state-selected ,
+        &.k-state-selected,
         &.k-selected {
             color: $drawer-selected-text;
             background-color: $drawer-selected-bg;
 
             &:hover,
-            &.k-state-hover ,
+            &.k-state-hover,
             &.k-hover {
                 color: $drawer-selected-hover-text;
                 background-color: $drawer-selected-hover-bg;

package/scss/editor/_layout.scss

@@ -42,7 +42,7 @@
                 pointer-events: auto;
             }
 
-            .k-editor-content.k-state-focused ,
+            .k-editor-content.k-state-focused,
             .k-editor-content.k-focus {
                 outline-width: 1px;
                 outline-style: dashed;
@@ -496,7 +496,7 @@
             display: block;
             margin: auto;
 
-            &.k-state-selected ,
+            &.k-state-selected,
             &.k-selected {
                 color: inherit;
                 border-width: 0;

package/scss/editor/_theme.scss

@@ -10,7 +10,7 @@
 
     kendo-editor {
         &.k-readonly {
-            .k-editor-content.k-state-focused ,
+            .k-editor-content.k-state-focused,
             .k-editor-content.k-focus {
                 outline-color: $body-text;
             }
@@ -48,7 +48,7 @@
 
         // Hover & Actve state
         &:hover,
-        &.k-state-active ,
+        &.k-state-active,
         &.k-active {
             border-color: $panel-border;
         }
@@ -66,7 +66,7 @@
 
     // Insert table
     .k-ct-popup {
-        .k-state-selected ,
+        .k-state-selected,
         .k-selected {
             @include fill( $selected-text, $selected-bg, $selected-border, none );
         }

package/scss/expansion-panel/_theme.scss

@@ -7,7 +7,7 @@
             $expander-border
         );
 
-        &.k-state-focus ,
+        &.k-state-focus,
         &.k-focus {
             box-shadow: $expander-focus-shadow;
         }
@@ -22,13 +22,13 @@
         outline: none;
 
         &:hover,
-        &.k-state-hover ,
+        &.k-state-hover,
         &.k-hover {
             background-color: $expander-header-hover-bg;
         }
 
         // Should be removed
-        &.k-state-focused ,
+        &.k-state-focused,
         &.k-focus {
             background-color: $expander-header-focused-bg;
             box-shadow: $expander-header-focused-shadow;

package/scss/filemanager/_theme.scss

@@ -64,7 +64,7 @@
                 );
             }
 
-            &.k-state-selected .k-file-icon ,
+            &.k-state-selected .k-file-icon,
             &.k-selected .k-file-icon {
                 @include fill(
                     inherit,

package/scss/forms/_layout.scss

@@ -142,7 +142,8 @@
 
         .k-multiselect,
         .k-floating-label-container,
-        .k-daterangepicker .k-dateinput {
+        .k-daterangepicker .k-dateinput,
+        .k-signature {
             display: inline-flex;
             width: 100%;
         }

package/scss/gantt/_layout.scss

@@ -82,7 +82,7 @@
                 }
             }
 
-            tr.k-state-selected > td:last-child ,
+            tr.k-state-selected > td:last-child,
             tr.k-selected > td:last-child {
                 background: transparent;
             }
@@ -352,7 +352,7 @@
         border-color: currentColor;
         position: absolute;
     }
-    .k-gantt-line.k-state-selected ,
+    .k-gantt-line.k-state-selected,
     .k-gantt-line.k-selected {
         z-index: 3;
     }
@@ -426,7 +426,7 @@
         transform: translate(-50%, -50%);
     }
     .k-task-dot:hover::before,
-    .k-task-dot.k-state-hover::before ,
+    .k-task-dot.k-state-hover::before,
     .k-task-dot.k-hover::before {
         border-width: 1px;
     }

package/scss/gantt/_theme.scss

@@ -15,7 +15,7 @@
                     $border: $gantt-milestone-border
                 );
             }
-            .k-task-milestone.k-state-selected .k-task-milestone-content ,
+            .k-task-milestone.k-state-selected .k-task-milestone-content,
             .k-task-milestone.k-selected .k-task-milestone-content {
                 @include fill(
                     $bg: $gantt-milestone-selected-bg,
@@ -30,7 +30,7 @@
                 stroke: $gantt-line-fill;
             }
 
-            polyline.k-state-selected ,
+            polyline.k-state-selected,
             polyline.k-selected {
                 stroke: $gantt-line-selected-fill;
             }
@@ -84,7 +84,7 @@
         );
     }
     .k-task-dot:hover::before,
-    .k-task-dot.k-state-hover::before ,
+    .k-task-dot.k-state-hover::before,
     .k-task-dot.k-hover::before {
         @include fill(
             $bg: $gantt-dot-hover-bg,
@@ -110,7 +110,7 @@
             );
         }
     }
-    .k-task-milestone.k-state-selected ,
+    .k-task-milestone.k-state-selected,
     .k-task-milestone.k-selected {
         background-image: none;
         @include fill(
@@ -141,7 +141,7 @@
     .k-task-advanced .k-task-summary-complete {
         color: $gantt-advanced-bg;
     }
-    .k-task-summary.k-state-selected ,
+    .k-task-summary.k-state-selected,
     .k-task-summary.k-selected {
         color: $gantt-summary-selected-bg;
 
@@ -185,7 +185,7 @@
             $bg: $gantt-advanced-bg
         );
     }
-    .k-task-single.k-state-selected ,
+    .k-task-single.k-state-selected,
     .k-task-single.k-selected {
         @include fill(
             $gantt-task-selected-text,
@@ -202,7 +202,7 @@
     .k-gantt-line {
         color: $gantt-line-fill;
     }
-    .k-gantt-line.k-state-selected ,
+    .k-gantt-line.k-state-selected,
     .k-gantt-line.k-selected {
         color: $gantt-line-selected-fill;
     }

package/scss/grid/_layout.scss

@@ -661,7 +661,7 @@
             &.k-i-sort-desc-sm,
             &.k-i-sort-asc-sm {
                 vertical-align: text-top;
-                margin-left: $grid-sorted-icon-spacing;
+                margin-inline-start: $grid-sorted-icon-spacing;
             }
         }
 
@@ -671,7 +671,7 @@
             height: $icon-size;
             font-size: $grid-sorting-index-font-size;
             margin-top: $grid-sorting-index-spacing-y;
-            margin-left: $grid-sorting-index-spacing-x;
+            margin-inline-start: $grid-sorting-index-spacing-x;
         }
     }
 
@@ -1072,15 +1072,15 @@
     }
 
     .k-header > .k-cell-inner {
-        margin: (-1 * $grid-header-padding-y) calc(-1 * calc( #{$kendo-button-calc-size} - #{$grid-cell-padding-x})) (-1 * $grid-header-padding-y) (-1 * $grid-cell-padding-x);
+        margin: (-1 * $grid-header-padding-y) (-1 * $grid-header-padding-x);
     }
 
     .k-filterable {
         > .k-cell-inner {
-            margin: (-1 * $grid-header-padding-y) calc(-1 * #{$kendo-button-calc-size}) (-1 * $grid-header-padding-y) (-1 * $grid-cell-padding-x);
+            margin-inline-end: calc(-1 * #{$grid-filterable-icon-spacing});
 
             .k-link {
-                padding-right: 0;
+                padding-inline-end: 0;
             }
         }
     }
@@ -1119,6 +1119,7 @@
         .k-grid-filter,
         .k-header-column-menu {
             position: static;
+            margin-inline-end: $grid-header-menu-icon-spacing;
         }
 
         .k-grid-filter,
@@ -1429,28 +1430,6 @@
             margin-left: $icon-spacing;
             margin-right: 0;
         }
-
-        .k-header > .k-cell-inner {
-            margin-right: (-1 * $grid-cell-padding-x);
-            margin-left: calc(-1 * calc( #{$kendo-button-calc-size} - #{$grid-cell-padding-x}));
-
-            .k-sort-order {
-                margin-right: $grid-sorting-index-spacing-x;
-                margin-left: 0;
-            }
-        }
-
-        .k-filterable {
-            > .k-cell-inner {
-                margin-right: (-1 * $grid-cell-padding-x);
-                margin-left: calc(-1 * #{$kendo-button-calc-size});
-
-                .k-link {
-                    padding-right: $grid-header-padding-x;
-                    padding-left: 0;
-                }
-            }
-        }
     }
 }