@progress/kendo-theme-default 5.12.1-dev.0 → 5.12.1-dev.2

package/scss/pivotgrid/_layout.scss

@@ -277,11 +277,11 @@
             margin: $pivotgrid-configurator-fields-margin-y $pivotgrid-configurator-fields-margin-x;
             display: flex;
             flex-direction: column;
-            gap: ($pivotgrid-spacer / 2);
+            gap: k-math-div( $pivotgrid-spacer, 2 );
         }
 
         .k-select-all .k-checkbox {
-            margin-inline-end: map-get($spacing, 1);
+            margin-inline-end: k-map-get( $kendo-spacing, 1 );
         }
 
         .k-fields-list-wrapper {
@@ -294,7 +294,7 @@
         }
 
         .k-settings-description {
-            margin-top: map-get( $spacing, 4 );
+            margin-top: k-map-get( $kendo-spacing, 4 );
             text-align: center;
         }
 
@@ -347,7 +347,7 @@
         align-items: center;
 
         .k-icon {
-            margin-right: map-get( $spacing, 2 );
+            margin-right: k-map-get( $kendo-spacing, 2 );
         }
         .k-dropdown-list {
             max-width: 100px;
@@ -594,7 +594,7 @@
         display: flex;
         flex-flow: row nowrap;
         align-items: flex-start;
-        gap: map-get( $spacing, 2 );
+        gap: k-map-get( $kendo-spacing, 2 );
 
         > .k-pivotgrid-configurator-panel {
             max-width: 320px;
@@ -613,11 +613,11 @@
         }
 
         .k-pivotgrid-configurator-content {
-            padding: map-get( $spacing, 4 );
+            padding: k-map-get( $kendo-spacing, 4 );
             max-height: 100%;
             display: flex;
             flex-flow: column nowrap;
-            gap: map-get( $spacing, 4 );
+            gap: k-map-get( $kendo-spacing, 4 );
             overflow-x: hidden;
             overflow-y: auto;
         }
@@ -625,24 +625,24 @@
         .k-pivotgrid-targets {
             display: flex;
             flex-flow: column nowrap;
-            gap: map-get( $spacing, 4 );
+            gap: k-map-get( $kendo-spacing, 4 );
         }
 
         .k-pivotgrid-configurator-section {
             display: flex;
             flex-flow: column nowrap;
-            gap: map-get( $spacing, 2 );
+            gap: k-map-get( $kendo-spacing, 2 );
         }
 
         .k-column-fields {
             margin: 0;
-            padding: map-get( $spacing, 1 );
+            padding: k-map-get( $kendo-spacing, 1 );
             max-height: 200px;
             border-width: 1px;
             border-style: solid;
             display: flex;
             flex-flow: row wrap;
-            gap: map-get( $spacing, 1 );
+            gap: k-map-get( $kendo-spacing, 1 );
             overflow-x: hidden;
             overflow-y: auto;
 
@@ -650,58 +650,6 @@
                 margin: 0;
             }
         }
-        .k-ie & .k-column-fields {
-            > * {
-                margin: 2px;
-            }
-        }
-    }
-
-}
-
-
-
-@include exports("pivotgrid/layout/ie11-fixes/legacy") {
-
-    // Pivotgrid is stretched beyond container in IE 11
-    // see https://github.com/telerik/kendo-theme-default/issues/647
-    // see https://github.com/telerik/kendo-themes/issues/1880
-    .k-ie11 {
-        .k-pivot .k-grid {
-            display: block;
-        }
-        .k-pivotgrid {
-            display: flex;
-            flex-direction: column;
-
-            & > div {
-                display: flex;
-                flex-direction: row;
-                overflow: hidden;
-            }
-
-            .k-pivotgrid-empty-cell,
-            .k-pivotgrid-row-headers {
-                flex: 1 1 30%;
-            }
-
-            .k-pivotgrid-column-headers,
-            .k-pivotgrid-values {
-                flex: 1 1 70%;
-            }
-        }
-        .k-pivotgrid-column-headers {
-            padding-right: $default-scrollbar-width;
-            padding-left: 0;
-        }
-
-        [dir = "rtl"],
-        .k-rtl {
-            .k-pivotgrid-column-headers {
-                padding-right: 0;
-                padding-left: $default-scrollbar-width;
-            }
-        }
     }
 
 }

package/scss/pivotgrid/_theme.scss

@@ -67,7 +67,7 @@
     .k-grouping-row > .k-pivotgrid-cell:focus,
     .k-detail-row > .k-pivotgrid-cell:focus,
     .k-group-footer > .k-pivotgrid-cell:focus {
-        @include box-shadow($pivotgrid-focus-shadow);
+        @include focus-indicator( $pivotgrid-focus-shadow, true );
     }
 
     // Selected state
@@ -132,7 +132,7 @@
     }
 
     .k-pivotgrid-configurator-content .k-form-field-wrapper {
-        @include fill( $border: $component-border );
+        @include fill( $border: $kendo-component-border );
     }
 
 
@@ -190,7 +190,7 @@
         );
 
         .k-empty {
-            color: $subtle-text;
+            color: $kendo-subtle-text;
         }
     }
 
@@ -222,15 +222,15 @@
     }
 
     .k-i-kpi-status-hold {
-        color: $warning;
+        color: $kendo-color-warning;
     }
 
     .k-i-kpi-status-deny {
-        color: $error;
+        color: $kendo-color-error;
     }
 
     .k-i-kpi-status-open {
-        color: $success;
+        color: $kendo-color-success;
     }
 
 
@@ -238,7 +238,7 @@
     .k-pivotgrid-configurator-panel.kendo-jquery {
 
         .k-column-fields {
-            border-color: $component-border;
+            border-color: $kendo-component-border;
         }
 
     }

package/scss/pivotgrid/_variables.scss

@@ -1,5 +1,8 @@
+@import "../table/_variables.scss";
+
+
 // Pivot grid
-$pivotgrid-spacer: map-get( $spacing, 4 ) !default;
+$pivotgrid-spacer: k-map-get( $kendo-spacing, 4 ) !default;
 $pivotgrid-padding-x: null !default;
 $pivotgrid-padding-y: null !default;
 $pivotgrid-font-family: $font-family !default;
@@ -11,29 +14,29 @@ $pivotgrid-icon-spacing: 8px !default;
 $pivotgrid-row-header-width: 300px !default;
 $pivotgrid-column-header-height: 75px !default;
 
-$pivotgrid-cell-padding-x: $table-cell-padding-x !default;
-$pivotgrid-cell-padding-y: $table-cell-padding-y !default;
+$pivotgrid-cell-padding-x: $kendo-table-cell-padding-x-md !default;
+$pivotgrid-cell-padding-y: $kendo-table-cell-padding-y-md !default;
 $pivotgrid-cell-border-width: 1px !default;
 
-$pivotgrid-bg: $component-bg !default;
-$pivotgrid-text: $component-text !default;
-$pivotgrid-border: $component-border !default;
+$pivotgrid-bg: $kendo-component-bg !default;
+$pivotgrid-text: $kendo-component-text !default;
+$pivotgrid-border: $kendo-component-border !default;
 
-$pivotgrid-alt-border: try-shade($pivotgrid-border, 2) !default;
+$pivotgrid-alt-border: k-try-shade($pivotgrid-border, 2) !default;
 
-$pivotgrid-headers-bg: $header-bg !default;
-$pivotgrid-headers-text: $header-text !default;
-$pivotgrid-headers-border: $header-border !default;
+$pivotgrid-headers-bg: $kendo-component-header-bg !default;
+$pivotgrid-headers-text: $kendo-component-header-text !default;
+$pivotgrid-headers-border: $kendo-component-header-border !default;
 
-$pivotgrid-total-bg: try-shade( $pivotgrid-bg, 1 ) !default;
-$pivotgrid-total-text: $header-text !default;
-$pivotgrid-total-border: $header-border !default;
+$pivotgrid-total-bg: k-try-shade( $pivotgrid-bg, 1 ) !default;
+$pivotgrid-total-text: $kendo-component-header-text !default;
+$pivotgrid-total-border: $kendo-component-header-border !default;
 
-$pivotgrid-hover-bg: darken($pivotgrid-bg, 7%) !default;
+$pivotgrid-hover-bg: k-color-darken($pivotgrid-bg, 7%) !default;
 $pivotgrid-hover-text: null !default;
 $pivotgrid-hover-border: null !default;
 
-$pivotgrid-selected-bg: rgba($selected-bg, .25) !default;
+$pivotgrid-selected-bg: rgba($kendo-selected-bg, .25) !default;
 $pivotgrid-selected-text: null !default;
 $pivotgrid-selected-border: null !default;
 
@@ -53,17 +56,17 @@ $pivotgrid-configurator-content-padding-x: $pivotgrid-spacer !default;
 $pivotgrid-configurator-content-padding-y: 2px !default;
 
 $pivotgrid-configurator-fields-margin-x: 0px !default;
-$pivotgrid-configurator-fields-margin-y: ( $pivotgrid-spacer / 2 ) !default;
+$pivotgrid-configurator-fields-margin-y: k-math-div( $pivotgrid-spacer, 2 ) !default;
 
 $pivotgrid-configurator-vertical-width: 320px !default;
 $pivotgrid-configurator-horizontal-height: 420px !default;
 
-$pivotgrid-configurator-bg: $component-bg !default;
-$pivotgrid-configurator-text: $component-text !default;
-$pivotgrid-configurator-border: $component-border !default;
+$pivotgrid-configurator-bg: $kendo-component-bg !default;
+$pivotgrid-configurator-text: $kendo-component-text !default;
+$pivotgrid-configurator-border: $kendo-component-border !default;
 
 $pivotgrid-configurator-header-bg: null !default;
-$pivotgrid-configurator-header-text: $header-text !default;
+$pivotgrid-configurator-header-text: $kendo-component-header-text !default;
 $pivotgrid-configurator-header-border: null !default;
 
 $pivotgrid-configurator-end-shadow: -3px 0px 6px rgba(0, 0, 0, .16) !default;
@@ -71,8 +74,8 @@ $pivotgrid-configurator-start-shadow: 3px 0px 6px rgba(0, 0, 0, .16) !default;
 $pivotgrid-configurator-top-shadow: 0px -3px 6px rgba(0, 0, 0, .16) !default;
 $pivotgrid-configurator-bottom-shadow: 0px 3px 6px rgba(0, 0, 0, .16) !default;
 
-$pivotgrid-configurator-button-padding-x: map-get($spacing, 1) !default;
-$pivotgrid-configurator-button-padding-y: map-get($spacing, 1) !default;
+$pivotgrid-configurator-button-padding-x: k-map-get( $kendo-spacing, 1 ) !default;
+$pivotgrid-configurator-button-padding-y: k-map-get( $kendo-spacing, 1 ) !default;
 $pivotgrid-configurator-button-border-width: 1px !default;
 $pivotgrid-configurator-button-size: calc( #{$pivotgrid-line-height * 1em} + #{$pivotgrid-configurator-button-padding-y * 2} + #{$pivotgrid-configurator-button-border-width * 2} ) !default;
 
@@ -83,25 +86,25 @@ $pivotgrid-calculated-field-border-width: 1px !default;
 $pivotgrid-calculated-field-border-radius: $kendo-border-radius-md !default;
 $pivotgrid-calculated-field-gap: $pivotgrid-spacer !default;
 
-$pivotgrid-calculated-field-bg: $component-bg !default;
-$pivotgrid-calculated-field-text: $component-text !default;
-$pivotgrid-calculated-field-border: $component-border !default;
+$pivotgrid-calculated-field-bg: $kendo-component-bg !default;
+$pivotgrid-calculated-field-text: $kendo-component-text !default;
+$pivotgrid-calculated-field-border: $kendo-component-border !default;
 
 $pivotgrid-calculated-field-header-bg: null !default;
-$pivotgrid-calculated-field-header-text: $header-text !default;
+$pivotgrid-calculated-field-header-text: $kendo-component-header-text !default;
 $pivotgrid-calculated-field-header-border: null !default;
 
 
-$pivotgrid-treeview-padding-x: ( $pivotgrid-spacer / 2 ) !default;
+$pivotgrid-treeview-padding-x: k-math-div( $pivotgrid-spacer, 2 ) !default;
 $pivotgrid-treeview-padding-y: 0px !default;
 
 // Legacy variables
-$pivotgrid-alt-bg: $grid-header-bg !default;
-$pivotgrid-alt-text: $grid-header-text !default;
-$pivotgrid-chrome-border: $grid-border !default;
+$pivotgrid-alt-bg: $kendo-grid-header-bg !default;
+$pivotgrid-alt-text: $kendo-grid-header-text !default;
+$pivotgrid-chrome-border: $kendo-grid-border !default;
 
-$pivotgrid-container-bg: $component-bg !default;
-$pivotgrid-row-headers-bg: try-shade( $component-bg, 1 ) !default;
+$pivotgrid-container-bg: $kendo-component-bg !default;
+$pivotgrid-row-headers-bg: k-try-shade( $kendo-component-bg, 1 ) !default;
 
 $pivotgrid-button-bg: null !default;
 $pivotgrid-button-text: null !default;

package/scss/popover/_index.scss

@@ -8,6 +8,6 @@
 
 
 // Component
-@import "_variables.scss";
-@import "_layout.scss";
-@import "_theme.scss";
+@import "./_variables.scss";
+@import "./_layout.scss";
+@import "./_theme.scss";

package/scss/popover/_layout.scss

@@ -2,20 +2,20 @@
 
     // Popover
     .k-popover {
-        @include border-radius( $popover-border-radius );
+        @include border-radius( $kendo-popover-border-radius );
         padding: 0;
-        border-width: $popover-border-width;
-        border-style: $popover-border-style;
+        border-width: $kendo-popover-border-width;
+        border-style: $kendo-popover-border-style;
         box-sizing: border-box;
         outline: 0;
-        font-size: $popover-font-size;
-        font-family: $popover-font-family;
-        line-height: $popover-line-height;
+        font-size: $kendo-popover-font-size;
+        font-family: $kendo-popover-font-family;
+        line-height: $kendo-popover-line-height;
         display: flex;
         flex-flow: column nowrap;
         z-index: 12000;
         -webkit-touch-callout: none;
-        -webkit-tap-highlight-color: $rgba-transparent;
+        -webkit-tap-highlight-color: $kendo-color-rgba-transparent;
 
         *,
         *::before,
@@ -25,27 +25,29 @@
     }
 
     .k-popover-inner {
+        height: inherit;
         position: relative;
         border-radius: inherit;
-        height: inherit;
+        border-color: inherit;
     }
 
     // Header
     .k-popover-header {
-        @include border-top-radius( $popover-border-radius );
-        padding: $popover-header-padding-y $popover-header-padding-x;
-        border-width: 0 0 $popover-header-border-width;
-        border-style: $popover-header-border-style;
+        @include border-top-radius( $kendo-popover-border-radius );
+        padding: $kendo-popover-header-padding-y $kendo-popover-header-padding-x;
+        border-width: 0 0 $kendo-popover-header-border-width;
+        border-style: $kendo-popover-header-border-style;
+        border-color: inherit;
     }
 
     // Body
     .k-popover-body {
-        padding: $popover-body-padding-y $popover-body-padding-x;
+        padding: $kendo-popover-body-padding-y $kendo-popover-body-padding-x;
     }
 
     // Actions
     .k-popover-actions {
-        border-width: $popover-actions-border-width 0 0;
+        border-width: $kendo-popover-actions-border-width 0 0;
     }
 
 }
@@ -54,10 +56,10 @@
 
     .k-popover-callout {
         margin: 0;
-        width: $popover-callout-width;
-        height: $popover-callout-height;
-        border-width: $popover-callout-border-width;
-        border-style: $popover-callout-border-style;
+        width: $kendo-popover-callout-width;
+        height: $kendo-popover-callout-height;
+        border-width: $kendo-popover-callout-border-width;
+        border-style: $kendo-popover-callout-border-style;
         position: absolute;
 
         &.k-callout-n {

package/scss/popover/_theme.scss

@@ -2,12 +2,12 @@
 
     // Popover
     .k-popover {
-        @include box-shadow( $popover-shadow );
+        @include box-shadow( $kendo-popover-shadow );
 
         @include fill(
-            $popover-text,
-            $popover-bg,
-            $popover-border
+            $kendo-popover-text,
+            $kendo-popover-bg,
+            $kendo-popover-border
         );
     }
 
@@ -19,9 +19,9 @@
     // Header
     .k-popover-header {
         @include fill(
-            $popover-header-text,
-            $popover-header-bg,
-            $popover-header-border
+            $kendo-popover-header-text,
+            $kendo-popover-header-bg,
+            $kendo-popover-header-border
         );
     }
 

package/scss/popover/_variables.scss

@@ -1,31 +1,31 @@
 // Popover
-$popover-border-width: $card-border-width !default;
-$popover-border-style: solid !default;
-$popover-border-radius: $card-border-radius !default;
-$popover-font-size: $card-font-size !default;
-$popover-font-family: $card-font-family !default;
-$popover-line-height: $card-line-height !default;
-$popover-bg: $component-bg !default;
-$popover-text: $component-text !default;
-$popover-border: $component-border !default;
-$popover-shadow: $popup-shadow !default;
+$kendo-popover-border-width: $card-border-width !default;
+$kendo-popover-border-style: solid !default;
+$kendo-popover-border-radius: $card-border-radius !default;
+$kendo-popover-font-size: $card-font-size !default;
+$kendo-popover-font-family: $card-font-family !default;
+$kendo-popover-line-height: $card-line-height !default;
+$kendo-popover-bg: $kendo-component-bg !default;
+$kendo-popover-text: $kendo-component-text !default;
+$kendo-popover-border: $kendo-component-border !default;
+$kendo-popover-shadow: $popup-shadow !default;
 
-$popover-header-padding-y: $card-header-padding-y !default;
-$popover-header-padding-x: $card-header-padding-x !default;
-$popover-header-border-width: $card-header-border-width !default;
-$popover-header-border-style: $popover-border-style !default;
-$popover-header-bg: $card-header-bg !default;
-$popover-header-text: $card-header-text !default;
-$popover-header-border: $card-header-border !default;
+$kendo-popover-header-padding-y: $card-header-padding-y !default;
+$kendo-popover-header-padding-x: $card-header-padding-x !default;
+$kendo-popover-header-border-width: $card-header-border-width !default;
+$kendo-popover-header-border-style: $kendo-popover-border-style !default;
+$kendo-popover-header-bg: $card-header-bg !default;
+$kendo-popover-header-text: $card-header-text !default;
+$kendo-popover-header-border: $card-header-border !default;
 
-$popover-body-padding-y: $card-body-padding-y !default;
-$popover-body-padding-x: $card-body-padding-x !default;
+$kendo-popover-body-padding-y: $card-body-padding-y !default;
+$kendo-popover-body-padding-x: $card-body-padding-x !default;
 
-$popover-actions-border-width: $popover-border-width !default;
+$kendo-popover-actions-border-width: $kendo-popover-border-width !default;
 
-$popover-callout-width: $card-callout-width !default;
-$popover-callout-height: $card-callout-height !default;
-$popover-callout-border-width: $popover-border-width !default;
-$popover-callout-border-style: $popover-border-style !default;
-$popover-callout-bg: $popover-bg !default;
-$popover-callout-border: $popover-border !default;
+$kendo-popover-callout-width: $card-callout-width !default;
+$kendo-popover-callout-height: $card-callout-height !default;
+$kendo-popover-callout-border-width: $kendo-popover-border-width !default;
+$kendo-popover-callout-border-style: $kendo-popover-border-style !default;
+$kendo-popover-callout-bg: $kendo-popover-bg !default;
+$kendo-popover-callout-border: $kendo-popover-border !default;

package/scss/popup/_index.scss

@@ -6,6 +6,6 @@
 
 
 // Component
-@import "_variables.scss";
-@import "_layout.scss";
-@import "_theme.scss";
+@import "./_variables.scss";
+@import "./_layout.scss";
+@import "./_theme.scss";

package/scss/popup/_variables.scss

@@ -7,10 +7,10 @@ $popup-border-radius: null !default;
 $popup-font-size: $font-size !default;
 $popup-line-height: $line-height !default;
 
-$popup-content-padding-x: map-get( $spacing, 2 ) !default;
-$popup-content-padding-y: map-get( $spacing, 2 ) !default;
+$popup-content-padding-x: k-map-get( $kendo-spacing, 2 ) !default;
+$popup-content-padding-y: k-map-get( $kendo-spacing, 2 ) !default;
 
-$popup-bg: $component-bg !default;
-$popup-text: $component-text !default;
-$popup-border: $component-border !default;
+$popup-bg: $kendo-component-bg !default;
+$popup-text: $kendo-component-text !default;
+$popup-border: $kendo-component-border !default;
 $popup-shadow: 0 2px 4px 0 rgba(0, 0, 0, .03), 0 4px 5px 0 rgba(0, 0, 0, .04) !default;

package/scss/progressbar/_index.scss

@@ -6,6 +6,6 @@
 
 
 // Component
-@import "_variables.scss";
-@import "_layout.scss";
-@import "_theme.scss";
+@import "./_variables.scss";
+@import "./_layout.scss";
+@import "./_theme.scss";