@progress/kendo-theme-default 5.1.2-dev.3 → 5.1.2-dev.7

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@progress/kendo-theme-default",
   "description": "SASS resources for the default Kendo UI theme",
-  "version": "5.1.2-dev.3",
+  "version": "5.1.2-dev.7",
   "author": "Progress",
   "license": "Apache-2.0",
   "keywords": [
@@ -47,5 +47,5 @@
     "prepublishOnly": "echo 'no prebublish for default theme'",
     "postpublish": "echo 'no postpublish for default theme'"
   },
-  "gitHead": "8a1041b9ea9729c5edf718e1be1afc717c476262"
+  "gitHead": "cedfa864b61e9c7f5e63839f6428eaee5af5c536"
 }

package/scss/_variables.scss

@@ -80,9 +80,10 @@ $padding-x-lg: $padding-x * 1.5 !default;
 $padding-y-lg: $padding-y * 1.5 !default;
 
 /// Border radius for all components.
-$border-radius: 2px !default;
-$border-radius-sm: $border-radius / 2 !default;
-$border-radius-lg: $border-radius * 2 !default;
+$kendo-border-radius: map-get( $spacing, 1 ) !default;
+$kendo-border-radius-sm: $kendo-border-radius - map-get( $spacing, thin ) !default;
+$kendo-border-radius-md: $kendo-border-radius !default;
+$kendo-border-radius-lg: $kendo-border-radius + map-get( $spacing, thin ) !default;
 
 $panel-padding-x: $padding-x !default;
 $panel-padding-y: $padding-y !default;
@@ -364,7 +365,7 @@ $invalid-shadow: null !default;
 $drag-clue-padding-x: $padding-x !default;
 $drag-clue-padding-y: $padding-y !default;
 $drag-clue-border-width: 1px !default;
-$drag-clue-border-radius: $border-radius !default;
+$drag-clue-border-radius: $kendo-border-radius-md !default;
 $drag-clue-font-size: $font-size !default;
 $drag-clue-font-family: $font-family !default;
 $drag-clue-line-height: $line-height !default;

package/scss/badge/_variables.scss

@@ -2,21 +2,21 @@
 $badge-padding-x: $padding-x-sm !default;
 $badge-padding-y: $badge-padding-x !default;
 $badge-border-width: 1px !default;
-$badge-border-radius: $border-radius !default;
+$badge-border-radius: $kendo-border-radius-md !default;
 $badge-font-size: $font-size-xs !default;
 $badge-line-height: 1 !default;
 
 $badge-padding-x-sm: ( $badge-padding-x / 2 ) !default;
 $badge-padding-y-sm: ( $badge-padding-y / 2 ) !default;
 $badge-border-width-sm: $badge-border-width !default;
-$badge-border-radius-sm: $border-radius-sm !default;
+$badge-border-radius-sm: $kendo-border-radius-sm !default;
 $badge-font-size-sm: $font-size-xs !default;
 $badge-line-height-sm: 1 !default;
 
 $badge-padding-x-lg: ( $badge-padding-x * 1.5 ) !default;
 $badge-padding-y-lg: ( $badge-padding-y * 1.5 ) !default;
 $badge-border-width-lg: $badge-border-width !default;
-$badge-border-radius-lg: $border-radius-lg !default;
+$badge-border-radius-lg: $kendo-border-radius-lg !default;
 $badge-font-size-lg: $font-size-sm !default;
 $badge-line-height-lg: 1 !default;
 

package/scss/bottom-navigation/_variables.scss

@@ -14,7 +14,7 @@ $bottom-nav-item-padding-y: 0 !default;
 $bottom-nav-item-min-width: 72px !default;
 $bottom-nav-item-max-width: null !default;
 $bottom-nav-item-min-height: calc( #{$icon-size * 2.5} + #{$padding-x * 2} - #{$bottom-nav-padding-x * 2} ) !default;
-$bottom-nav-item-border-radius: $border-radius !default;
+$bottom-nav-item-border-radius: $kendo-border-radius-md !default;
 $bottom-nav-item-gap: 0 map-get( $spacing, 1 ) !default;
 
 $bottom-nav-item-icon-margin-y: map-get( $spacing, 2 ) !default;

package/scss/breadcrumb/_variables.scss

@@ -19,7 +19,7 @@ $breadcrumb-delimiter-icon-padding-y: 0px !default;
 
 $breadcrumb-link-padding-x: $padding-x !default;
 $breadcrumb-link-padding-y: $padding-y-lg !default;
-$breadcrumb-link-border-radius: $border-radius !default;
+$breadcrumb-link-border-radius: $kendo-border-radius-md !default;
 
 $breadcrumb-icon-link-padding-x: $breadcrumb-link-padding-x !default;
 $breadcrumb-icon-link-padding-y: $breadcrumb-icon-link-padding-x !default;

package/scss/button/_layout.scss

@@ -5,6 +5,7 @@
         box-sizing: border-box;
         border-width: $kendo-button-border-width;
         border-style: solid;
+        border-radius: $kendo-button-border-radius;
         color: inherit;
         background: none;
         font-family: $kendo-button-font-family;
@@ -52,6 +53,10 @@
     .k-icon-button {
         aspect-ratio: 1;
         gap: 0;
+
+        .k-icon {
+            display: inline-flex;
+        }
     }
 
 

package/scss/calendar/_layout.scss

@@ -363,6 +363,9 @@
                 line-height: $calendar-navigation-item-height;
                 cursor: pointer;
                 padding: 0 1em;
+                overflow: hidden;
+                white-space: nowrap;
+                text-overflow: clip;
             }
         }
 

package/scss/calendar/_variables.scss

@@ -32,7 +32,7 @@ $calendar-footer-padding-y: map-get( $spacing, 2 ) !default;
 $calendar-cell-padding-x: .5em !default;
 $calendar-cell-padding-y: $calendar-cell-padding-x !default;
 $calendar-cell-line-height: $calendar-line-height !default;
-$calendar-cell-border-radius: $border-radius !default;
+$calendar-cell-border-radius: $kendo-border-radius-md !default;
 
 $calendar-header-cell-padding-x: null !default;
 $calendar-header-cell-padding-y: null !default;

package/scss/card/_variables.scss

@@ -2,7 +2,7 @@
 $card-padding-x: map-get( $spacing, lg ) !default;
 $card-padding-y: map-get( $spacing, md ) !default;
 $card-border-width: 1px !default;
-$card-border-radius: $border-radius-lg !default;
+$card-border-radius: $kendo-border-radius-lg !default;
 $card-inner-border-radius: calc( #{$card-border-radius} - #{$card-border-width} ) !default;
 $card-font-family: $font-family !default;
 $card-font-size: $font-size !default;

package/scss/chip/_layout.scss

@@ -33,6 +33,8 @@
 
     // Chip content
     .k-chip-content {
+        padding: .5em 0;
+        margin: -.5em 0;
         min-width: 0;
         display: flex;
         flex-flow: row nowrap;

package/scss/color-preview/_variables.scss

@@ -1,5 +1,5 @@
 // Color Preview
-$color-preview-border-radius: $border-radius !default;
+$color-preview-border-radius: $kendo-border-radius-md !default;
 $color-preview-border-width: 1px !default;
 $color-preview-bg: null !default;
 $color-preview-text: null !default;

package/scss/coloreditor/_variables.scss

@@ -3,7 +3,7 @@ $coloreditor-spacer: map-get( $spacing, 3 ) !default;
 
 $coloreditor-min-width: 272px !default;
 $coloreditor-border-width: 1px !default;
-$coloreditor-border-radius: $border-radius !default;
+$coloreditor-border-radius: $kendo-border-radius-md !default;
 $coloreditor-font-family: $font-family !default;
 $coloreditor-font-size: $font-size !default;
 $coloreditor-line-height: $line-height !default;

package/scss/colorgradient/_variables.scss

@@ -3,7 +3,7 @@ $colorgradient-spacer: map-get( $spacing, 3 ) !default;
 
 $colorgradient-width: 272px !default;
 $colorgradient-border-width: 1px !default;
-$colorgradient-border-radius: $border-radius !default;
+$colorgradient-border-radius: $kendo-border-radius-md !default;
 $colorgradient-padding-y: $colorgradient-spacer !default;
 $colorgradient-padding-x: $colorgradient-padding-y !default;
 $colorgradient-gap: $colorgradient-spacer !default;
@@ -17,7 +17,7 @@ $colorgradient-border: $component-border !default;
 $colorgradient-focus-border: null !default;
 $colorgradient-focus-shadow: 1px 1px 7px 1px rgba(0, 0, 0, .3) !default;
 
-$colorgradient-canvas-border-radius: $border-radius !default;
+$colorgradient-canvas-border-radius: $kendo-border-radius-md !default;
 $colorgradient-canvas-gap: $colorgradient-spacer !default;
 $colorgradient-canvas-rectangle-height: 180px !default;
 

package/scss/common/_base.scss

@@ -76,7 +76,7 @@
     // Panels
     .k-block,
     .k-panel {
-        @include border-radius( $border-radius );
+        @include border-radius( $kendo-border-radius-md );
         @include fill(
             $panel-text,
             $panel-bg,
@@ -88,7 +88,7 @@
         box-sizing: border-box;
 
         > .k-header {
-            @include border-top-radius( $border-radius );
+            @include border-top-radius( $kendo-border-radius-md );
             @include fill(
                 $header-text,
                 $header-bg,

package/scss/dataviz/_layout.scss

@@ -2,6 +2,10 @@
 
     .k-barcode {
         display: inline-block;
+
+        > div {
+            height: 150px;
+        }
     }
 
 }
@@ -78,7 +82,7 @@
     }
 
     .k-chart-tooltip {
-        @include border-radius( $border-radius );
+        @include border-radius( $kendo-border-radius-md );
         font-size: $chart-tooltip-font-size;
         line-height: $line-height;
         padding: $tooltip-padding-y $tooltip-padding-x;
@@ -186,7 +190,7 @@
     }
 
     .k-navigator-hint .k-scroll {
-        @include border-radius( $border-radius );
+        @include border-radius( $kendo-border-radius-md );
         position: absolute;
         height: 4px;
     }
@@ -391,6 +395,10 @@
 
     .k-qrcode {
         display: inline-block;
+
+        > div {
+            height: 150px;
+        }
     }
 
 }
@@ -409,7 +417,7 @@
         base: $base-bg,
         background: $chart-bg,
 
-        border-radius: $border-radius,
+        border-radius: $kendo-border-radius-md,
 
         normal-background: $base-bg,
         normal-text-color: $base-text,

package/scss/editor/_layout.scss

@@ -51,7 +51,7 @@
 
     // Inline editor
     .k-editor-inline {
-        @include border-radius( $border-radius );
+        @include border-radius( $kendo-border-radius-md );
         padding: $padding-y-sm $padding-x-sm;
         border: 1px solid transparent;
         word-wrap: break-word;
@@ -472,7 +472,7 @@
             white-space: nowrap;
             overflow: hidden;
             cursor: pointer;
-            @include border-radius( $border-radius );
+            @include border-radius( $kendo-border-radius-md );
 
             .k-i-file,
             .k-i-folder {

package/scss/fab/_variables.scss

@@ -5,7 +5,7 @@
 $kendo-fab-border-width: 1px !default;
 /// Border radius of the FAB.
 /// @group floating-action-button
-$kendo-fab-border-radius: $border-radius !default;
+$kendo-fab-border-radius: $kendo-border-radius-md !default;
 
 /// Font family of the FAB.
 /// @group floating-action-button

package/scss/filemanager/_layout.scss

@@ -211,6 +211,9 @@
         flex-shrink: 0;
         display: inline-flex;
         position: relative;
+        border-width: 0 1px;
+        border-style: solid;
+        border-color: inherit;
     }
 
 

package/scss/floating-label/_layout.scss

@@ -63,6 +63,7 @@
             color: transparent;
         }
 
+        [dir="rtl"] &,
         .k-rtl &,
         &[dir="rtl"] {
 

package/scss/forms/_layout.scss

@@ -146,11 +146,6 @@
             display: inline-flex;
             width: 100%;
         }
-        .k-daterangepicker {
-            width: 100%;
-            flex-flow: column nowrap;
-            gap: 0;
-        }
     }
 
     // Form Buttons Container

package/scss/gantt/_layout.scss

@@ -506,7 +506,7 @@
     // Single task
     .k-single-wrap {}
     .k-task-single {
-        @include border-radius( $border-radius );
+        @include border-radius( $kendo-border-radius-md );
         border-width: $gantt-task-border-width;
         border-style: solid;
         box-sizing: border-box;
@@ -539,7 +539,7 @@
         }
     }
     .k-task-complete {
-        @include border-radius( $border-radius );
+        @include border-radius( $kendo-border-radius-md );
         width: 20%;
         position: absolute;
         z-index: 1;
@@ -609,7 +609,6 @@
     }
 
     // Planned position
-
     .k-gantt-planned {
         .k-gantt-dependencies,
         .k-task-dot,
@@ -640,7 +639,6 @@
     }
 
     // Planned element
-
     .k-task-planned {
         margin: 0 0 $gantt-planned-margin-y;
         line-height: $gantt-planned-line-height;
@@ -673,7 +671,6 @@
     }
 
     // Planned Tooltip
-
     .k-planned-tooltip {
         .k-task-content {
             display: block;
@@ -681,7 +678,6 @@
     }
 
     // Delay offset
-
     .k-task-offset-wrap .k-task-content .k-resize-e {
         display: none;
     }
@@ -712,6 +708,36 @@
     .k-task-offset:hover .k-resize-handle {
         visibility: visible;
     }
+
+
+    // Dependency Validation Tooltip
+    .k-gantt-tooltip-validation {
+        max-width: $gantt-validation-tooltip-width;
+        display: block;
+
+        &::before {
+            content: '';
+            width: 4px;
+            height: 100%;
+            position: absolute;
+            top: 0;
+            left: 0;
+        }
+    }
+    .k-gantt-tooltip-validation-row {
+        display: flex;
+        flex-direction: row;
+        justify-content: space-between;
+    }
+    .k-gantt-tooltip-validation-label {
+        display: inline-flex;
+        white-space: nowrap;
+        overflow: hidden;
+        text-overflow: ellipsis;
+    }
+    .k-gantt-tooltip-validation-value {
+        font-weight: $font-weight-bold;
+    }
 }
 
 @include exports("gantt/export") {
@@ -757,7 +783,8 @@
 
 @include exports("gantt/rtl") {
 
-    .k-rtl {
+    .k-rtl,
+    [dir="rtl"] {
 
         .k-gantt-rows,
         .k-gantt-columns {
@@ -836,5 +863,10 @@
         .k-gantt-timeline .k-milestone-wrap .k-task-start {
             right: $gantt-rtl-milestone-dot-start-margin-x;
         }
+
+        .k-gantt-tooltip-validation::before {
+            left: auto;
+            right: 0;
+        }
     }
 }

package/scss/gantt/_theme.scss

@@ -244,7 +244,6 @@
     }
 
     // Tooltips
-
     .k-offset-tooltip-delayed {
         @include fill(
             $bg: $gantt-delayed-bg
@@ -256,4 +255,20 @@
             $bg: $gantt-planned-bg
         );
     }
+
+    .k-gantt-tooltip-validation {
+        &::before {
+            background-color: $gantt-validation-tooltip-border;
+        }
+    }
+    .k-gantt-tooltip-valid {
+        &::before {
+            background-color: $gantt-validation-tooltip-valid-border;
+        }
+    }
+    .k-gantt-tooltip-invalid {
+        &::before {
+            background-color: $gantt-validation-tooltip-invalid-border;
+        }
+    }
 }

package/scss/gantt/_variables.scss

@@ -85,3 +85,8 @@ $gantt-advanced-bg-lighter: tint($gantt-advanced-bg, 5) !default;
 
 $gantt-action-on-offset-text: #000000 !default;
 $gantt-offset-resize-handler-top: 50% !default;
+
+$gantt-validation-tooltip-width: 200px !default;
+$gantt-validation-tooltip-border: #656565 !default;
+$gantt-validation-tooltip-valid-border: $success !default;
+$gantt-validation-tooltip-invalid-border: $error !default;

package/scss/grid/_layout.scss

@@ -17,7 +17,7 @@
 
     $grid-hierarchy-col-width: ($icon-size * 2) !default;
 
-    $grid-group-indicator-border-radius: $border-radius !default;
+    $grid-group-indicator-border-radius: $kendo-border-radius-md !default;
     $grid-group-indicator-gap: $table-cell-padding-y !default;
 
     $grid-grouping-row-border-top: 1px !default;

package/scss/icons/_layout.scss

@@ -187,15 +187,19 @@
     .k-i-arrows-no-change::before { content: "\e011"; }
     .k-i-arrow-overflow-down::before { content: "\e012"; }
     .k-i-chevron-up::before { content: "\e013"; }
+    .k-i-chevron-double-up::before { content: "\e94a"; }
     .k-i-arrow-chevron-up::before { content: "\e013"; }
     .k-i-arrowhead-n::before { content: "\e013"; }
     .k-i-chevron-right::before { content: "\e014"; }
+    .k-i-chevron-double-right::before { content: "\e94b"; }
     .k-i-arrow-chevron-right::before { content: "\e014"; }
     .k-i-arrowhead-e::before { content: "\e014"; }
     .k-i-chevron-down::before { content: "\e015"; }
+    .k-i-chevron-double-down::before { content: "\e94c"; }
     .k-i-arrow-chevron-down::before { content: "\e015"; }
     .k-i-arrowhead-s::before { content: "\e015"; }
     .k-i-chevron-left::before { content: "\e016"; }
+    .k-i-chevron-double-left::before { content: "\e94d"; }
     .k-i-arrow-chevron-left::before { content: "\e016"; }
     .k-i-arrowhead-w::before { content: "\e016"; }
     .k-i-arrow-up::before { content: "\e017"; }
@@ -1054,6 +1058,8 @@
     .k-i-files-validation::before { content: "\e945"; }
     .k-i-data-rest::before { content: "\e946"; }
     .k-i-file-typescript::before { content: "\e947"; }
+    .k-i-data-ods::before { content: "\e948"; }
+    .k-i-file-report::before { content: "\e949"; }
     .k-i-table-position-start::before { content: "\e6a2"; }
     .k-i-table-position-left::before { content: "\e6a2"; }
     .k-i-table-position-center::before { content: "\e6a3"; }
@@ -1073,6 +1079,7 @@
     .k-i-list-latin-big::before { content: "\e6b1"; }
     .k-i-list-latin-small::before { content: "\e6b2"; }
     .k-i-list-unordered-square::before { content: "\e6b3"; }
+    .k-i-list-unordered-outline::before { content: "\e6b4"; }
     .k-i-graph::before { content: "\ea00"; }
     .k-i-chart-column-clustered::before { content: "\ea01"; }
     .k-i-chart-column-stacked::before { content: "\ea02"; }