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

package/scss/calendar/_variables.scss

@@ -13,7 +13,6 @@ $calendar-border: $component-border !default;
 $calendar-header-padding-x: map-get( $spacing, 1 ) !default;
 $calendar-header-padding-y: map-get( $spacing, 1 ) !default;
 $calendar-header-border-width: 1px !default;
-$calendar-header-min-width: ($calendar-cell-size * 8) !default;
 
 $calendar-header-bg: $header-bg !default;
 $calendar-header-text: $header-text !default;
@@ -110,3 +109,47 @@ $infinite-calendar-view-height: ( $calendar-cell-size * 9 ) !default;
 
 
 // Multiview calendar
+
+
+// Calendar sizes
+$kendo-calendar-sm-font-size: $font-size-md !default;
+$kendo-calendar-sm-line-height: $line-height-md !default;
+$kendo-calendar-sm-cell-size: 28px !default;
+$kendo-calendar-sm-cell-padding-x: map-get( $spacing, 1) - map-get( $spacing, thin ) !default;
+$kendo-calendar-sm-cell-padding-y: map-get( $spacing, 1) - map-get( $spacing, thin ) !default;
+
+$kendo-calendar-md-font-size: $font-size-md !default;
+$kendo-calendar-md-line-height: $line-height-md !default;
+$kendo-calendar-md-cell-size: 32px !default;
+$kendo-calendar-md-cell-padding-x: map-get( $spacing, 1 ) !default;
+$kendo-calendar-md-cell-padding-y: map-get( $spacing, 1 ) !default;
+
+$kendo-calendar-lg-font-size: $font-size-lg !default;
+$kendo-calendar-lg-line-height: $line-height-lg !default;
+$kendo-calendar-lg-cell-size: 40px !default;
+$kendo-calendar-lg-cell-padding-x: map-get( $spacing, 2 ) !default;
+$kendo-calendar-lg-cell-padding-y: map-get( $spacing, 2 ) !default;
+
+$kendo-calendar-sizes: (
+    sm: (
+        font-size: $kendo-calendar-sm-font-size,
+        line-height: $kendo-calendar-sm-line-height,
+        cell-size: $kendo-calendar-sm-cell-size,
+        cell-padding-x: $kendo-calendar-sm-cell-padding-y,
+        cell-padding-y: $kendo-calendar-sm-cell-padding-x
+    ),
+    md: (
+        font-size: $kendo-calendar-md-font-size,
+        line-height: $kendo-calendar-md-line-height,
+        cell-size: $kendo-calendar-md-cell-size,
+        cell-padding-x: $kendo-calendar-md-cell-padding-y,
+        cell-padding-y: $kendo-calendar-md-cell-padding-x
+    ),
+    lg: (
+        font-size: $kendo-calendar-lg-font-size,
+        line-height: $kendo-calendar-lg-line-height,
+        cell-size: $kendo-calendar-lg-cell-size,
+        cell-padding-x: $kendo-calendar-lg-cell-padding-y,
+        cell-padding-y: $kendo-calendar-lg-cell-padding-x
+    )
+) !default;

package/scss/colorpicker/_index.scss

@@ -4,8 +4,7 @@
 // Dependencies
 @import "../input/_index.scss";
 @import "../button/_index.scss";
-@import "../colorpalette/_index.scss";
-@import "../colorgradient/_index.scss";
+@import "../coloreditor/_index.scss";
 @import "../popup/_index.scss";
 @import "../icons/_index.scss";
 

package/scss/dataviz/_theme.scss

@@ -115,8 +115,6 @@
 }
 
 
-
-
 @include exports("dataviz/treemap/theme") {
 
     // Treemap

package/scss/dropdowngrid/_index.scss

@@ -3,6 +3,7 @@
 
 // Dependencies
 @import "../common/_index.scss";
+@import "../table/_index.scss";
 @import "../input/_index.scss";
 @import "../floating-label/_index.scss";
 @import "../combobox/_index.scss";

package/scss/list/_variables.scss

@@ -10,8 +10,8 @@ $kendo-list-font-size-lg: $font-size-lg !default;
 /// Line height of the list component, if no size is set.
 /// @group list
 $kendo-list-line-height: null !default;
-$kendo-list-line-height-sm: null !default;
-$kendo-list-line-height-md: null !default;
+$kendo-list-line-height-sm: $line-height-md !default;
+$kendo-list-line-height-md: $line-height-md !default;
 $kendo-list-line-height-lg: $line-height-lg !default;
 
 /// Horizontal padding of list header, if no size is set.

package/scss/progressbar/_layout.scss

@@ -264,3 +264,46 @@
     }
 
 }
+
+@include exports("circular-progressbar/layout") {
+
+    .k-circular-progressbar {
+        display: inline-block;
+        text-align: left;
+        position: relative;
+    }
+
+    .k-circular-progressbar-surface {
+        height: 100%;
+
+        & > div {
+            width: 100%;
+            height: 100%;
+        }
+
+        svg {
+            width: 100%;
+            height: 100%;
+        }
+    }
+
+    .k-circular-progressbar-scale {
+        fill: none;
+    }
+
+    .k-circular-progressbar-arc {
+        transform-box: fill-box;
+        transform-origin: center center;
+        transform: rotate(-90deg);
+        stroke-linecap: round;
+        fill: none;
+    }
+
+    .k-circular-progressbar-label {
+        position: absolute;
+        text-align: center;
+        padding: 0;
+        margin: 0;
+    }
+
+}

package/scss/progressbar/_theme.scss

@@ -26,3 +26,16 @@
     }
 
 }
+
+@include exports("circular-progressbar/theme") {
+
+    .k-circular-progressbar-scale {
+        stroke: $kendo-circular-progressbar-scale-stroke;
+    }
+
+    .k-circular-progressbar-arc {
+        stroke: $kendo-circular-progressbar-arc-stroke;
+        transition: stroke .5s ease;
+    }
+
+}

package/scss/progressbar/_variables.scss

@@ -23,3 +23,7 @@ $progressbar-indeterminate-border: $progressbar-border !default;
 $progressbar-indeterminate-gradient: null !default;
 
 $progressbar-chunk-border: $body-bg !default;
+
+// Circular Progressbar
+$kendo-circular-progressbar-arc-stroke: $primary !default;
+$kendo-circular-progressbar-scale-stroke: $progressbar-bg !default;

package/scss/timeselector/_layout.scss

@@ -206,4 +206,34 @@
         top: calc( #{$time-list-title-height / 2} );
     }
 
+
+    // Time selector sizes
+    @each $size, $size-props in $kendo-time-selector-sizes {
+        $_font-size: map-get( $size-props, font-size );
+        $_line-height: map-get( $size-props, line-height );
+        $_list-item-padding-x: map-get( $size-props, list-item-padding-x );
+        $_list-item-padding-y: map-get( $size-props, list-item-padding-y );
+        $_highlight-height: calc( #{$_font-size * $_line-height} + #{ $_list-item-padding-y * 2} );
+
+
+        .k-timeselector-#{$size} {
+            font-size: $_font-size;
+            line-height: $_line-height;
+
+            .k-time-highlight,
+            .k-time-list-highlight {
+                height: $_highlight-height;
+            }
+
+            .k-time-separator {
+                height:  $_highlight-height;
+            }
+
+            .k-time-list-item,
+            .k-time-list .k-item {
+                padding: $_list-item-padding-y $_list-item-padding-x;
+            }
+        }
+    }
+
 }

package/scss/timeselector/_variables.scss

@@ -30,3 +30,41 @@ $time-list-highlight-bg: $component-bg !default;
 $time-list-highlight-border: $component-border !default;
 
 $time-list-focused-bg: rgba(0, 0, 0, .04) !default;
+
+
+// Time selector sizes
+$kendo-time-selector-sm-font-size: $kendo-list-font-size-sm !default;
+$kendo-time-selector-sm-line-height: $kendo-list-line-height-sm !default;
+$kendo-time-selector-sm-list-item-padding-x: $kendo-list-item-padding-x-sm !default;
+$kendo-time-selector-sm-list-item-padding-y: $kendo-list-item-padding-y-sm !default;
+
+$kendo-time-selector-md-font-size: $kendo-list-font-size-md !default;
+$kendo-time-selector-md-line-height: $kendo-list-line-height-md !default;
+$kendo-time-selector-md-list-item-padding-x: $kendo-list-item-padding-x-md !default;
+$kendo-time-selector-md-list-item-padding-y: $kendo-list-item-padding-y-md !default;
+
+$kendo-time-selector-lg-font-size: $kendo-list-font-size-lg !default;
+$kendo-time-selector-lg-line-height: $kendo-list-line-height-lg !default;
+$kendo-time-selector-lg-list-item-padding-x: $kendo-list-item-padding-x-lg !default;
+$kendo-time-selector-lg-list-item-padding-y: $kendo-list-item-padding-y-lg !default;
+
+$kendo-time-selector-sizes: (
+    sm: (
+        font-size: $kendo-time-selector-sm-font-size,
+        line-height: $kendo-time-selector-sm-line-height,
+        list-item-padding-x: $kendo-time-selector-sm-list-item-padding-x,
+        list-item-padding-y: $kendo-time-selector-sm-list-item-padding-y
+    ),
+    md: (
+        font-size: $kendo-time-selector-md-font-size,
+        line-height: $kendo-time-selector-md-line-height,
+        list-item-padding-x: $kendo-time-selector-md-list-item-padding-x,
+        list-item-padding-y: $kendo-time-selector-md-list-item-padding-y
+    ),
+    lg: (
+        font-size: $kendo-time-selector-lg-font-size,
+        line-height: $kendo-time-selector-lg-line-height,
+        list-item-padding-x: $kendo-time-selector-lg-list-item-padding-x,
+        list-item-padding-y: $kendo-time-selector-lg-list-item-padding-y
+    )
+) !default;