@progress/kendo-theme-default 5.0.0-beta.2 → 5.0.0-beta.6

package/dist/default-dataviz-v4.scss

@@ -0,0 +1,8 @@
+$series-a: #ff6358;
+$series-b: #ffd246;
+$series-c: #78d237;
+$series-d: #28b4c8;
+$series-e: #2d73f5;
+$series-f: #aa46be;
+
+@import "all.scss";

package/dist/default-main-dark.scss

@@ -24,10 +24,10 @@ $button-bg: #404040;
 $link-text: #ff6358;
 $link-hover-text: #d6534a;
 $series-a: #ff6358;
-$series-b: #ffd246;
-$series-c: #78d237;
-$series-d: #28b4c8;
-$series-e: #2d73f5;
-$series-f: #aa46be;
+$series-b: #ffe162;
+$series-c: #4cd180;
+$series-d: #4b5ffa;
+$series-e: #ac58ff;
+$series-f: #ff5892;
 
 @import "all.scss";

package/dist/default-main.scss

@@ -23,10 +23,10 @@ $button-bg: #f5f5f5;
 $link-text: #ff6358;
 $link-hover-text: #d6534a;
 $series-a: #ff6358;
-$series-b: #ffd246;
-$series-c: #78d237;
-$series-d: #28b4c8;
-$series-e: #2d73f5;
-$series-f: #aa46be;
+$series-b: #ffe162;
+$series-c: #4cd180;
+$series-d: #4b5ffa;
+$series-e: #ac58ff;
+$series-f: #ff5892;
 
 @import "all.scss";

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

@@ -0,0 +1,51 @@
+{
+    "$schema": "https://unpkg.com/@progress/kendo-theme-tasks@1.11.0/lib/schemas/kendo-swatch.json",
+    "name": "Default Dataviz v4",
+    "product": "kendo",
+    "base": "@progress/kendo-theme-default",
+    "previewColors": [
+        "#ff6358",
+        "#ffd246",
+        "#78d237",
+        "#28b4c8",
+        "#2d73f5"
+    ],
+    "components": [],
+    "groups": [
+        {
+            "name": "Dataviz",
+            "variables": {
+                "series-a": {
+                    "name": "Series A",
+                    "type": "color",
+                    "value": "#ff6358"
+                },
+                "series-b": {
+                    "name": "Series B",
+                    "type": "color",
+                    "value": "#ffd246"
+                },
+                "series-c": {
+                    "name": "Series C",
+                    "type": "color",
+                    "value": "#78d237"
+                },
+                "series-d": {
+                    "name": "Series D",
+                    "type": "color",
+                    "value": "#28b4c8"
+                },
+                "series-e": {
+                    "name": "Series E",
+                    "type": "color",
+                    "value": "#2d73f5"
+                },
+                "series-f": {
+                    "name": "Series F",
+                    "type": "color",
+                    "value": "#aa46be"
+                }
+            }
+        }
+    ]
+}

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

@@ -182,27 +182,27 @@
                 "series-b": {
                     "name": "Series B",
                     "type": "color",
-                    "value": "#ffd246"
+                    "value": "#ffe162"
                 },
                 "series-c": {
                     "name": "Series C",
                     "type": "color",
-                    "value": "#78d237"
+                    "value": "#4cd180"
                 },
                 "series-d": {
                     "name": "Series D",
                     "type": "color",
-                    "value": "#28b4c8"
+                    "value": "#4b5ffa"
                 },
                 "series-e": {
                     "name": "Series E",
                     "type": "color",
-                    "value": "#2d73f5"
+                    "value": "#ac58ff"
                 },
                 "series-f": {
                     "name": "Series F",
                     "type": "color",
-                    "value": "#aa46be"
+                    "value": "#ff5892"
                 }
             }
         }

package/lib/swatches/default-main.json

@@ -172,27 +172,27 @@
                 "series-b": {
                     "name": "Series B",
                     "type": "color",
-                    "value": "#ffd246"
+                    "value": "#ffe162"
                 },
                 "series-c": {
                     "name": "Series C",
                     "type": "color",
-                    "value": "#78d237"
+                    "value": "#4cd180"
                 },
                 "series-d": {
                     "name": "Series D",
                     "type": "color",
-                    "value": "#28b4c8"
+                    "value": "#4b5ffa"
                 },
                 "series-e": {
                     "name": "Series E",
                     "type": "color",
-                    "value": "#2d73f5"
+                    "value": "#ac58ff"
                 },
                 "series-f": {
                     "name": "Series F",
                     "type": "color",
-                    "value": "#aa46be"
+                    "value": "#ff5892"
                 }
             }
         }

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@progress/kendo-theme-default",
   "description": "SASS resources for the default Kendo UI theme",
-  "version": "5.0.0-beta.2",
+  "version": "5.0.0-beta.6",
   "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": "13e32ba172a1fa6fc172c9d989974ebfccef19e6"
+  "gitHead": "ec5cba0585090e2d366f93d5c13fc09299f251d8"
 }

package/scss/action-buttons/_layout.scss

@@ -2,6 +2,7 @@
 
     .k-actions {
         padding: $actions-padding-y $actions-padding-x;
+        box-sizing: border-box;
         border-width: $actions-border-width 0 0 0;
         border-style: solid;
         border-color: inherit;
@@ -13,6 +14,12 @@
         overflow: hidden;
         // TODO: remove
         clear: both;
+
+        *,
+        *::before,
+        *::after {
+            box-sizing: border-box;
+        }
     }
 
 

package/scss/action-sheet/_layout.scss

@@ -27,6 +27,12 @@
         overflow-y: auto;
         position: fixed;
         z-index: 10002;
+
+        *,
+        *::before,
+        *::after {
+            box-sizing: border-box;
+        }
     }
 
 

package/scss/adaptive/_layout.scss

@@ -83,14 +83,6 @@
             }
         }
 
-        .k-grid-filter-menu {
-
-            .k-filter-selected-items {
-                margin: 1em;
-                font-weight: normal;
-            }
-        }
-
         .k-grid-edit-form {
 
             .k-popup-edit-form,
@@ -99,10 +91,6 @@
                 min-width: auto;
             }
         }
-
-        .k-grid .k-grid-search {
-            width: 100%;
-        }
     }
 
     .k-grid.k-grid-mobile {
@@ -369,29 +357,8 @@
 
     .k-pane-wrapper {
 
-        .k-grid-edit-form,
-        .k-grid-column-menu,
-        .k-grid-filter-menu,
-        .k-scheduler-edit-form {
-
-            > .k-header {
-                display: flex;
-                justify-content: space-between;
-                padding: .3em .6em;
-                width: auto;
-                line-height: 2em;
-
-                .k-header-done,
-                .k-header-cancel {
-                    display: flex;
-                    flex-direction: row;
-                    align-items: center;
-
-                    .k-icon {
-                        font-size: 1.5em;
-                    }
-                }
-            }
+        .k-appbar {
+            padding: map-get( $spacing, 1 );
         }
 
         .k-list-title,
@@ -400,6 +367,12 @@
             display: block;
         }
 
+        .k-listgroup-title {
+            padding: $listgroup-item-padding-y $listgroup-item-padding-x;
+            font-weight: bold;
+            text-transform: uppercase;
+        }
+
         .k-listgroup {
 
             .k-listgroup-item {
@@ -407,23 +380,56 @@
             }
         }
         .k-listgroup + .k-listgroup {
-            margin-top: 2em;
+            margin-top: map-get( $spacing, 4 );
         }
 
         // Column menu
         .k-column-menu {
+            padding: map-get( $spacing, 2 );
+            display: flex;
+            flex-flow: column nowrap;
+            gap: map-get( $spacing, 2 );
 
             .k-filter-item .k-filterable * {
                 pointer-events: none;
             }
+
+            .k-list-title,
+            .k-listgroup-title {
+                padding: 0;
+            }
+
+            .k-listgroup {
+                margin-inline: -#{map-get( $spacing, 2 )};
+            }
         }
 
         // Filter menu
         .k-filter-menu {
+            padding: map-get( $spacing, 2 );
+            display: flex;
+            flex-flow: column nowrap;
+            gap: map-get( $spacing, 2 );
+
+            .k-list-title {
+                padding: 0;
+            }
+
+            .k-list-filter {
+                padding: 0;
+                display: flex;
+                flex-flow: column nowrap;
+                gap: inherit;
+            }
+
             .k-filter-tools {
-                margin: 1em;
                 display: flex;
-                justify-content: space-between;
+                flex-flow: row nowrap;
+                gap: inherit;
+            }
+
+            .k-listgroup {
+                margin-inline: -#{map-get( $spacing, 2 )};
             }
         }
 
@@ -447,7 +453,6 @@
         }
 
         // Pager
-
         .k-pager-wrap.k-pager-sm {
             justify-content: center;
 
@@ -457,39 +462,14 @@
 
         }
 
-        // IE
-
-        .k-ie & {
-
-            .k-scheduler {
-                .k-scheduler-toolbar,
-                .k-scheduler-footer {
-                    line-height: 2em;
-                }
-            }
-
-            .k-grid {
-
-                .k-icon {
-                    text-indent: 0;
-                }
-            }
-        }
-
         // RTL
-
         .k-rtl &,
         &[dir="rtl"],
         [dir="rtl"] & {
 
-            .k-grid-edit-form,
-            .k-grid-column-menu,
-            .k-grid-filter-menu,
-            .k-scheduler-edit-form {
-
-                > .k-header {
-                    flex-direction: row-reverse;
-                }
+            .k-header-cancel .k-i-arrow-chevron-left,
+            .k-listgroup-item .k-select .k-i-arrow-chevron-right {
+                transform: scaleX( -1 );
             }
 
             .k-scheduler-mobile {
@@ -511,10 +491,6 @@
                     margin-right: 0;
                 }
             }
-
-            .k-scheduler-edit-form .k-item .k-i-arrow-chevron-right {
-                transform: scaleX(-1);
-            }
         }
     }
 }

package/scss/adaptive/_theme.scss

@@ -66,15 +66,6 @@
         .k-grid-filter-menu,
         .k-scheduler-edit-form {
 
-            .k-header {
-                color: $adaptive-menu-text;
-                background-color: $adaptive-menu-bg;
-
-                .k-link {
-                    color: inherit;
-                }
-            }
-
             .k-item,
             .k-link {
                 color: $base-text;

package/scss/appbar/_layout.scss

@@ -20,9 +20,14 @@
         -webkit-touch-callout: none;
         -webkit-tap-highlight-color: $rgba-transparent;
 
+        *,
+        *::before,
+        *::after {
+            box-sizing: border-box;
+        }
+
         > * {
             flex-shrink: 0;
-
         }
 
         // Appbar section
@@ -32,15 +37,16 @@
             align-items: center;
         }
 
+
         // Appbar Spacer
         .k-appbar-spacer {
             flex: 1 0 auto;
         }
-
         .k-appbar-spacer-sized {
             flex-grow: 0;
         }
 
+
         // Separator
         .k-appbar-separator {
             margin: 0;
@@ -50,12 +56,27 @@
             border-width: 0 0 0 1px;
             display: inline-block;
         }
+
+
+        // Input
+        .k-input,
+        .k-picker {
+            width: 10em;
+        }
+        .k-color-picker {
+            width: min-content;
+        }
+
     }
 
+
+    // Static appbar
     .k-appbar-static {
         position: static;
     }
 
+
+    // Sticky appbar
     .k-appbar-sticky {
         width: 100%;
         position: sticky;
@@ -63,17 +84,20 @@
         z-index: $appbar-zindex;
     }
 
+
+    // Fixed appbar
     .k-appbar-fixed {
         width: 100%;
         position: fixed;
         z-index: 1;
     }
 
+
+    // Appbar position
     .k-appbar-top {
         top: 0;
         bottom: auto;
     }
-
     .k-appbar-bottom {
         top: auto;
         bottom: 0;
@@ -82,4 +106,5 @@
             bottom: 0;
         }
     }
+
 }

package/scss/appbar/_variables.scss

@@ -2,7 +2,7 @@
 $appbar-margin-y: null !default;
 $appbar-margin-x: null !default;
 $appbar-padding-y: map-get( $spacing, 2 ) !default;
-$appbar-padding-x: map-get( $spacing, 4 ) !default;
+$appbar-padding-x: map-get( $spacing, 2 ) !default;
 $appbar-border-width: 0px !default;
 
 $appbar-zindex: 1000 !default;

package/scss/autocomplete/_theme.scss

@@ -1,4 +1,4 @@
-@include exports("autocomplete/theme") {
+@include exports( "autocomplete/theme" ) {
 
     // Autocomplete
     .k-autocomplete {}

package/scss/autocomplete/_variables.scss

@@ -1,20 +1 @@
 // Autocomplete
-$autocomplete-bg: $kendo-input-bg !default;
-$autocomplete-text: $kendo-input-text !default;
-$autocomplete-border: $kendo-input-border !default;
-$autocomplete-shadow: $kendo-input-shadow !default;
-
-$autocomplete-hovered-bg: $kendo-input-hover-bg !default;
-$autocomplete-hovered-text: $kendo-input-hover-text !default;
-$autocomplete-hovered-border: $kendo-input-hover-border !default;
-$autocomplete-hovered-shadow: $kendo-input-hover-shadow !default;
-
-$autocomplete-focused-bg: $kendo-input-focus-bg !default;
-$autocomplete-focused-text: $kendo-input-focus-text !default;
-$autocomplete-focused-border: $kendo-input-focus-border !default;
-$autocomplete-focused-shadow: $kendo-input-focus-shadow !default;
-
-$autocomplete-disabled-bg: null !default;
-$autocomplete-disabled-text: null !default;
-$autocomplete-disabled-border: null !default;
-$autocomplete-disabled-shadow: null !default;

package/scss/avatar/_layout.scss

@@ -12,6 +12,12 @@
         align-items: center;
         flex-shrink: 0;
         overflow: hidden;
+
+        *,
+        *::before,
+        *::after {
+            box-sizing: border-box;
+        }
     }
 
 

package/scss/badge/_layout.scss

@@ -17,6 +17,12 @@
         vertical-align: middle;
         overflow: hidden;
         text-overflow: ellipsis;
+
+        *,
+        *::before,
+        *::after {
+            box-sizing: border-box;
+        }
     }
     .k-badge > * {
         color: inherit;

package/scss/bottom-navigation/_layout.scss

@@ -20,6 +20,12 @@
         outline: none;
         -webkit-touch-callout: none;
         -webkit-tap-highlight-color: $rgba-transparent;
+
+        *,
+        *::before,
+        *::after {
+            box-sizing: border-box;
+        }
     }
 
     .k-bottom-nav-border {

package/scss/breadcrumb/_layout.scss

@@ -15,6 +15,12 @@
         flex-direction: row;
         -webkit-touch-callout: none;
         -webkit-tap-highlight-color: $rgba-transparent;
+
+        *,
+        *::before,
+        *::after {
+            box-sizing: border-box;
+        }
     }