devextreme-themebuilder 23.2.6 → 24.1.2-beta

package/data/scss/widgets/generic/splitter/_colors.scss

@@ -1,43 +1,27 @@
+$splitter-resize-handle-color: getCustomVar(("$splitter-resize-handle-color")) !default;
+$splitter-resize-handle-color-hover: getCustomVar(("$splitter-resize-handle-color-hover")) !default;
+$splitter-resize-handle-color-focused: getCustomVar(("$splitter-resize-handle-color-focused")) !default;
+$splitter-resize-handle-bg: getCustomVar(("$splitter-resize-handle-bg")) !default;
+$splitter-resize-handle-bg-hover: getCustomVar(("$splitter-resize-handle-bg-hover")) !default;
+$splitter-resize-handle-bg-focused: getCustomVar(("$splitter-resize-handle-bg-focused")) !default;
+
 @use "sass:color";
 @use "../sizes" as *;
 @use "../colors" as *;
+@use "../button/colors" as *;
 
 // adduse
-
-
-$splitter-inactive-color: $base-border-color !default;
-$splitter-bg: null !default;
-
-
-@if $color == "carmine" {
-  $splitter-bg: color.change($base-accent, $alpha: 0.5) !default;
-}
-
-@if $color == "contrast" {
-  $splitter-bg: darken($base-bg, 13.5%) !default;
-}
-
-@if $color == "dark" {
-  $splitter-bg: color.change($base-accent, $alpha: 0.5) !default;
-}
-
-@if $color == "darkmoon" {
-  $splitter-bg: color.change($base-accent, $alpha: 0.5) !default;
-}
-
-@if $color == "darkviolet" {
-  $splitter-bg: color.change($base-accent, $alpha: 0.5) !default;
-}
-
-@if $color == "greenmist" {
-  $splitter-bg: color.change($base-accent, $alpha: 0.5) !default;
-}
-
-@if $color == "light" {
-  $splitter-bg: color.change($base-accent, $alpha: 0.5) !default;
-}
-
-@if $color == "softblue" {
-  $splitter-bg: color.change($base-accent, $alpha: 0.5) !default;
-}
-
+$splitter-resize-handle-color: $base-icon-color !default;
+$splitter-resize-handle-color-hover: $splitter-resize-handle-color !default;
+$splitter-resize-handle-color-focused: $base-inverted-icon-color !default;
+$splitter-resize-handle-bg: $button-normal-text-bg-focused !default;
+$splitter-resize-handle-bg-hover: $button-normal-text-bg-active !default;
+$splitter-resize-handle-bg-focused: $base-accent !default;
+$never-used: collector((
+"$splitter-resize-handle-color": $splitter-resize-handle-color,
+"$splitter-resize-handle-color-hover": $splitter-resize-handle-color-hover,
+"$splitter-resize-handle-color-focused": $splitter-resize-handle-color-focused,
+"$splitter-resize-handle-bg": $splitter-resize-handle-bg,
+"$splitter-resize-handle-bg-hover": $splitter-resize-handle-bg-hover,
+"$splitter-resize-handle-bg-focused": $splitter-resize-handle-bg-focused,
+));

package/data/scss/widgets/generic/splitter/_index.scss

@@ -3,17 +3,25 @@
 @use "../colors" as *;
 @use "sizes" as *;
 @use "../sizes" as *;
+@use "../../base/icons" as *;
 @use "../../base/splitter";
+@use "../../base/splitter/mixins" as *;
 
 // adduse
-.dx-splitter {
-  background-color: $splitter-bg;
 
-  &.dx-splitter-inactive {
-    background-color: $splitter-inactive-color;
-  }
+.dx-splitter {
+  @include resize-handle-states(
+    $splitter-resize-handle-color,
+    $splitter-resize-handle-bg,
+    $splitter-resize-handle-color-hover,
+    $splitter-resize-handle-bg-hover,
+    $splitter-resize-handle-color-focused,
+    $splitter-resize-handle-bg-focused,
+  );
 }
 
-.dx-splitter-border {
-  background-color: transparent;
+.dx-resize-handle {
+  .dx-icon {
+    @include dx-icon-sizing($splitter-resize-handle-icon-size);
+  }
 }

package/data/scss/widgets/generic/splitter/_sizes.scss

@@ -2,3 +2,4 @@
 
 // adduse
 
+$splitter-resize-handle-icon-size: 18px;

package/data/scss/widgets/generic/splitterBar/_colors.scss

@@ -0,0 +1,43 @@
+@use "sass:color";
+@use "../sizes" as *;
+@use "../colors" as *;
+
+// adduse
+
+
+$splitter-inactive-color: $base-border-color !default;
+$splitter-bg: null !default;
+
+
+@if $color == "carmine" {
+  $splitter-bg: color.change($base-accent, $alpha: 0.5) !default;
+}
+
+@if $color == "contrast" {
+  $splitter-bg: darken($base-bg, 13.5%) !default;
+}
+
+@if $color == "dark" {
+  $splitter-bg: color.change($base-accent, $alpha: 0.5) !default;
+}
+
+@if $color == "darkmoon" {
+  $splitter-bg: color.change($base-accent, $alpha: 0.5) !default;
+}
+
+@if $color == "darkviolet" {
+  $splitter-bg: color.change($base-accent, $alpha: 0.5) !default;
+}
+
+@if $color == "greenmist" {
+  $splitter-bg: color.change($base-accent, $alpha: 0.5) !default;
+}
+
+@if $color == "light" {
+  $splitter-bg: color.change($base-accent, $alpha: 0.5) !default;
+}
+
+@if $color == "softblue" {
+  $splitter-bg: color.change($base-accent, $alpha: 0.5) !default;
+}
+

package/data/scss/widgets/generic/splitterBar/_index.scss

@@ -0,0 +1,19 @@
+@use "sass:color";
+@use "colors" as *;
+@use "../colors" as *;
+@use "sizes" as *;
+@use "../sizes" as *;
+@use "../../base/splitterBar";
+
+// adduse
+.dx-splitter-bar {
+  background-color: $splitter-bg;
+
+  &.dx-splitter-inactive {
+    background-color: $splitter-inactive-color;
+  }
+}
+
+.dx-splitter-border {
+  background-color: transparent;
+}

package/data/scss/widgets/generic/splitterBar/_sizes.scss

@@ -0,0 +1,4 @@
+@use "../sizes" as *;
+
+// adduse
+

package/data/scss/widgets/generic/tabs/variables/_colors.scss

@@ -26,7 +26,6 @@ $tabs-focused-disabled-border-color: null !default;
 $tabs-tab-hover-bg: null !default;
 $tabs-tab-active-bg: null !default;
 $tabs-tab-active-border-color: null !default;
-$tabs-tab-hover-border-color: null !default;
 $tabs-tab-hover-border-color-horizontal: null !default;
 $tabs-tab-hover-border-color-vertical: null !default;
 

package/data/scss/widgets/generic/textEditor/_colors.scss

@@ -18,7 +18,6 @@ $texteditor-underlined-bg: transparent !default;
 $texteditor-filled-bg: color.change($texteditor-color, $alpha: 0.05) !default;
 $texteditor-border-color: $base-border-color !default;
 $texteditor-focused-border-color: null !default;
-$texteditor-hover-bg: $base-bg !default;
 $texteditor-hover-border-color: null !default;
 $texteditor-button-clear-icon-color: null !default;
 $texteditor-invalid-focused-border-color: $base-invalid-color !default;
@@ -106,6 +105,11 @@ $texteditor-label-transition:
 }
 
 $texteditor-label-color: $texteditor-placeholder-color;
+
+:root {
+  --dx-texteditor-color-text: #{$texteditor-color}; 
+  --dx-texteditor-color-label: #{$texteditor-label-color};
+}
 $never-used: collector((
 "$texteditor-color": $texteditor-color,
 "$texteditor-placeholder-color": $texteditor-placeholder-color,

package/data/scss/widgets/generic/timeView/_sizes.scss

@@ -6,7 +6,6 @@ $generic-timeview-field-min-height: null !default;
 $generic-timeview-field-numberbox-reduce: null !default;
 $generic-timeview-format12-width: null !default;
 
-$generic-timeview-clock-additional-size: 8px !default;
 $generic-timeview-time-separator-margin: 5px !default;
 
 @if $size == "default" {

package/data/scss/widgets/generic/toolbar/_sizes.scss

@@ -21,3 +21,7 @@ $generic-toolbar-padding: 0 !default;
 $generic-toolbar-item-spacing: 5px !default;
 $generic-toolbar-label-font-size: $generic-m-font-size !default;
 $generic-toolbar-section-padding: 15px !default;
+
+:root {
+  --dx-toolbar-height: #{$generic-toolbar-height};
+}

package/data/scss/widgets/generic/treeList/_colors.scss

@@ -8,7 +8,6 @@
 
 $treelist-spin-icon-color: null !default;
 $treelist-selection-spin-icon-color: null !default;
-$treelist-row-alternation-bg: $datagrid-row-alternation-bg !default;
 
 
 @if $color == "carmine" {

package/data/scss/widgets/generic/treeList/_index.scss

@@ -78,6 +78,10 @@ $treelist-icon-container-padding-right: $generic-grid-base-checkbox-icon-size +
     }
   }
 
+  .dx-treelist-expanded, .dx-treelist-collapsed {
+    margin-right: $treelist-expanded-collapsed-margin-right;
+  }
+
   tr:not(.dx-row-focused).dx-selection {
     .dx-treelist-empty-space {
       color: $treelist-selection-spin-icon-color;
@@ -133,6 +137,15 @@ $treelist-icon-container-padding-right: $generic-grid-base-checkbox-icon-size +
     left: $treelist-checkbox-offset-left;
     margin-top: $treelist-select-all-checkbox-margin-top;
   }
+
+  .dx-treelist-checkbox-size::before {
+    content: '';
+    width: $treelist-select-all-interaction-area-size;
+    height: $treelist-select-all-interaction-area-size;
+    position: absolute;
+    left: $treelist-select-all-interaction-area-left;
+    top: $treelist-select-all-interaction-area-top;
+  }
 }
 
 .dx-treelist-headers .dx-header-row > .dx-treelist-select-all {
@@ -144,6 +157,9 @@ $treelist-icon-container-padding-right: $generic-grid-base-checkbox-icon-size +
     .dx-treelist-expanded,
     .dx-treelist-collapsed {
       @include flip-horizontally();
+
+      margin-right: 0;
+      margin-left: $treelist-expanded-collapsed-margin-right;
     }
 
     .dx-treelist-table-fixed {

package/data/scss/widgets/generic/treeList/_sizes.scss

@@ -6,16 +6,26 @@
 $treelist-expanded-icon-margin-left: null !default;
 $treelist-collapsed-icon-margin-left: null !default;
 $treelist-icon-margin-top: null !default;
+$treelist-expanded-collapsed-margin-right: null !default;
+$treelist-select-all-interaction-area-left: null !default;
+$treelist-select-all-interaction-area-top: null !default;
+$treelist-select-all-interaction-area-size: 24px !default;
 
 @if $size == "default" {
   $treelist-expanded-icon-margin-left: 5px !default;
   $treelist-collapsed-icon-margin-left: 6px !default;
   $treelist-icon-margin-top: math.div($generic-base-icon-size, 2) - 1 !default;
+  $treelist-expanded-collapsed-margin-right: 4px !default;
+  $treelist-select-all-interaction-area-left: -4px !default;
+  $treelist-select-all-interaction-area-top: -5px !default;
 }
 
 @else if $size == "compact" {
   $treelist-expanded-icon-margin-left: 3px !default;
   $treelist-collapsed-icon-margin-left: 4px !default;
   $treelist-icon-margin-top: math.div($generic-base-icon-size, 2) !default;
+  $treelist-expanded-collapsed-margin-right: 1px !default;
+  $treelist-select-all-interaction-area-left: -4px !default;
+  $treelist-select-all-interaction-area-top: -4px !default;
 }
 

package/data/scss/widgets/generic/treeView/_sizes.scss

@@ -35,7 +35,6 @@ $generic-select-all-item-border-visible-padding: 20px !default;
   $generic-treeview-toggle-item-width: 16px !default;
   $generic-select-all-item-padding: 6px 30px 8px 30px !default;
   $generic-treeview-item-padding: 4px 6px !default;
-  $generic-treevieew-item-padding: 4px 6px !default;
   $generic-treeview-load-indicator-size: $generic-treeview-toggle-item-width !default;
   $generic-treeview-searchbox-margin-bottom: 3px !default;
 }

package/data/scss/widgets/generic/typography/_index.scss

@@ -13,16 +13,14 @@
 
   @include dx-base-typography();
 
-  h1,
-  .dx-font-xl {
+  h1 {
     font-weight: 200;
-    font-size: $generic-xl-font-size;
+    font-size: $generic-h1-font-size;
   }
 
-  h2,
-  .dx-font-l {
+  h2 {
     font-weight: normal;
-    font-size: $generic-l-font-size;
+    font-size: $generic-h2-font-size;
   }
 
   h3 {
@@ -30,22 +28,40 @@
     font-size: $generic-h3-font-size;
   }
 
+  h4 {
+    font-weight: 500;
+    font-size: $generic-h4-font-size;
+  }
+
+  h5 {
+    font-weight: 700;
+    font-size: $generic-h5-font-size;
+  }
+
+  h6 {
+    font-weight: 800;
+    font-size: $generic-h6-font-size;
+  }
+
+  .dx-font-xl {
+    font-weight: 200;
+    font-size: $generic-xl-font-size;
+  }
+
+  .dx-font-l {
+    font-weight: normal;
+    font-size: $generic-l-font-size;
+  }
+
   .dx-font-m {
     font-weight: normal;
     font-size: $generic-m-font-size;
   }
 
-  h4,
   .dx-font-s {
     @include dx-s-font-mixin();
   }
 
-  h5 {
-    font-weight: 700;
-    font-size: $generic-h5-font-size;
-  }
-
-  h6,
   small,
   .dx-font-xs {
     font-weight: 800;

package/data/scss/widgets/generic/typography/_sizes.scss

@@ -7,8 +7,12 @@ $generic-l-font-size: null !default;
 $generic-m-font-size: null !default;
 $generic-s-font-size: null !default;
 $generic-xs-font-size: null !default;
+$generic-h1-font-size: null !default;
+$generic-h2-font-size: null !default;
 $generic-h3-font-size: null !default;
+$generic-h4-font-size: null !default;
 $generic-h5-font-size: null !default;
+$generic-h6-font-size: null !default;
 
 @if $size == "default" {
   $generic-xl-font-size: 34px !default;
@@ -16,8 +20,12 @@ $generic-h5-font-size: null !default;
   $generic-m-font-size: 20px !default;
   $generic-s-font-size: 18px !default;
   $generic-xs-font-size: 12px !default;
+  $generic-h1-font-size: 34px !default;
+  $generic-h2-font-size: 28px !default;
   $generic-h3-font-size: 22px !default;
+  $generic-h4-font-size: 18px !default;
   $generic-h5-font-size: 16px !default;
+  $generic-h6-font-size: 12px !default;
 }
 
 @else if $size == "compact" {
@@ -26,6 +34,24 @@ $generic-h5-font-size: null !default;
   $generic-m-font-size: 18px !default;
   $generic-s-font-size: 16px !default;
   $generic-xs-font-size: 10px !default;
+  $generic-h1-font-size: 29px !default;
+  $generic-h2-font-size: 24px !default;
   $generic-h3-font-size: 20px !default;
+  $generic-h4-font-size: 16px !default;
   $generic-h5-font-size: 14px !default;
+  $generic-h6-font-size: 10px !default;
+}
+
+:root {
+  --dx-font-size-heading-1: #{$generic-h1-font-size}; 
+  --dx-font-size-heading-2: #{$generic-h2-font-size}; 
+  --dx-font-size-heading-3: #{$generic-h3-font-size}; 
+  --dx-font-size-heading-4: #{$generic-h4-font-size}; 
+  --dx-font-size-heading-5: #{$generic-h5-font-size}; 
+  --dx-font-size-heading-6: #{$generic-h6-font-size};
+  --dx-font-size-xl: #{$generic-xl-font-size}; 
+  --dx-font-size-lg: #{$generic-l-font-size}; 
+  --dx-font-size-md: #{$generic-m-font-size}; 
+  --dx-font-size-sm: #{$generic-s-font-size}; 
+  --dx-font-size-xs: #{$generic-xs-font-size}; 
 }

package/data/scss/widgets/material/_colors.scss

@@ -42,8 +42,6 @@ $base-hover-bg: null !default;
 $base-inverted-text-color: null !default;
 $base-focus-color: null !default;
 $base-focus-bg: null !default;
-$typography-bg: null !default;
-$typography-color: null !default;
 $base-inverted-icon-color: null !default;
 $base-disabled-opacity: 0.38 !default;
 $base-disabled-color: null !default;
@@ -80,8 +78,6 @@ $scrollview-pulldown-path: null !default;
 }
 $base-link-color: $base-accent !default;
 
-$typography-link-color: $base-link-color !default;
-
 @if $mode == "light" {
   $material-color-theme-modificator: "light" !default;
   $base-text-color: rgba(0, 0, 0, 0.87) !default;
@@ -99,8 +95,6 @@ $typography-link-color: $base-link-color !default;
   $base-inverted-text-color: #fff !default;
   $base-focus-color: $base-inverted-text-color !default;
   $base-focus-bg: color.change(#000, $alpha: 0.04) !default;
-  $typography-bg: $base-bg !default;
-  $typography-color: $base-text-color !default;
   $base-inverted-icon-color: $base-inverted-text-color !default;
   $base-dropdown-shadow-color: color.change($base-shadow-color, $alpha: 0.2) !default;
 
@@ -124,14 +118,31 @@ $typography-link-color: $base-link-color !default;
   $base-inverted-text-color: rgba(0, 0, 0, 0.87) !default;
   $base-focus-color: $base-inverted-text-color !default;
   $base-focus-bg: color.change(#fff, $alpha: 0.05) !default;
-  $typography-bg: $base-bg !default;
-  $typography-color: $base-text-color !default;
   $base-inverted-icon-color: $base-inverted-text-color !default;
   $base-dropdown-shadow-color: color.change($base-shadow-color, $alpha: 0.4) !default;
 
   $scrollview-pulldown-path: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAABkCAQAAABebbrxAAABD0lEQVRo3u2XvQ3CMBCFLbmjYYGsAA2wA1X2gAbEAEwB2eIKflagh6zACJAuUihASUic+M5GNH56dT7J8efTPUXKkDkzrS8LpQAEMBygcwAss2UGQADDBmLa+AMvzAAIYNhATBt/YMEMgACGDcS0wbQBEEAAAQQQwD8CEzaiL7sKqOnojTuQrh95SKkX7kqD5j+M6O6Mu1NkupQJZU64B426bjmmXIzLKe7TZiUGLmweyhTa28XWdJKpYn8pXIVub1U4T4+jUKkKbyWeWhR6Vqpwd+w+hb5U4S/ta54qkhZgVihxrxWaznZVZD2lqVDaVkVafOoKGVWRN6nZR6GMxr+qZjHl3aq4db0NLXld7wVjuu7NS9f7yAAAAABJRU5ErkJggg==") !default;
 }
 
+$typography-bg: $base-bg !default;
+$typography-color: $base-text-color !default;
+$typography-link-color: $base-link-color !default;
+
+:root {
+  --dx-component-color-bg: #{$base-bg};
+  --dx-color-main-bg: #{$typography-bg};
+  --dx-color-primary: #{$base-accent};
+  --dx-color-danger: #{$base-danger};
+  --dx-color-success: #{$base-success};
+  --dx-color-warning: #{$base-warning};
+  --dx-color-border: #{$base-border-color};
+  --dx-color-text: #{$base-text-color};
+  --dx-color-icon: #{$base-icon-color};
+  --dx-color-spin-icon: #{$base-spin-icon-color};
+  --dx-color-link: #{$base-link-color};
+  --dx-color-shadow: #{$base-shadow-color};
+  --dx-color-separator: #{$base-border-color};
+}
 $never-used: collector((
 "$base-accent": $base-accent,
 "$base-font-family": $base-font-family,

package/data/scss/widgets/material/_index.scss

@@ -4,6 +4,7 @@
 @use "./button";
 @use "./buttonGroup";
 @use "./scrollView";
+@use "./splitter";
 @use "./checkBox";
 @use "./switch";
 @use "./tabs";

package/data/scss/widgets/material/_sizes.scss

@@ -62,6 +62,14 @@ $material-base-border-width: 1px !default;
 $base-border-radius: $material-base-border-radius !default;
 
 $material-base-standard-texteditor-input-horizontal-padding: 0 !default;
+
+:root {
+  --dx-component-height: #{$material-base-inline-widget-height};
+  --dx-font-size: #{$material-base-font-size};
+  --dx-border-width: #{$material-base-border-width};
+  --dx-border-radius: #{$material-base-border-radius};
+  --dx-font-size-icon: #{$material-base-icon-size};
+}
 $never-used: collector((
 "$material-button-height": $material-button-height,
 "$material-button-icon-size": $material-button-icon-size,

package/data/scss/widgets/material/accordion/_sizes.scss

@@ -9,7 +9,6 @@ $material-accordion-title-vertical-padding: 6px !default;
 $material-accordion-body-padding: null !default;
 $material-accordion-title-height: null !default;
 
-$material-accordion-shadow: null !default;
 $accordion-title-icon-margin: null !default;
 $accordion-title-icon-size: null !default;
 $accordion-item-border-radius: $material-base-border-radius !default;

package/data/scss/widgets/material/button/_colors.scss

@@ -33,11 +33,9 @@ $button-success-selected-bg: getCustomVar(("$button-success-selected-bg")) !defa
 
 // adduse
 
-$button-inverted-icon-color: $base-inverted-icon-color !default;
 $button-border-radius: $base-border-radius !default;
 $button-disabled-background: null !default;
 $button-disabled-icon-opacity: 0.6 !default;
-$button-disabled-text-opacity: 0.6 !default;
 $button-shadow-color: null !default;
 $button-normal-color: $base-text-color !default;
 $button-normal-selected-color: $base-text-color !default;

package/data/scss/widgets/material/button/_mixins.scss

@@ -7,12 +7,6 @@
 @use "../../base/icons" as *;
 @use "../../base/button/mixins" as *;
 
-$material-button-padding: $material-button-vertical-padding $material-button-horizontal-padding;
-$material-normal-button-shadow: $material-button-box-shadow-size $button-shadow-color;
-$material-normal-button-active-state-shadow: $material-button-active-box-shadow-size $button-active-shadow-color;
-$material-normal-button-hovered-state-shadow: $material-button-box-shadow-size $button-hover-shadow-color;
-$material-normal-button-focused-state-shadow: $material-button-box-shadow-size $button-focused-shadow-color;
-
 @mixin dx-button-onlyicon-sizing($icon-size: $material-button-icon-size) {
   min-width: $material-button-height;
 
@@ -39,7 +33,7 @@ $material-normal-button-focused-state-shadow: $material-button-box-shadow-size $
 
 @mixin dx-button-text-and-icon-sizing() {
   @include dx-button-sizing(
-    $material-button-vertical-padding, 
+    $material-button-vertical-padding,
     $material-button-icon-text-padding,
     $material-button-horizontal-padding,
     $material-button-icon-size,
@@ -54,7 +48,6 @@ $material-normal-button-focused-state-shadow: $material-button-box-shadow-size $
   $hover-background-color,
   $focused-background-color,
   $active-background-color,
-  $disabled-background-color,
   $icon-color,
   $selected-background-color: $active-background-color,
   $selected-color: $text-color,
@@ -110,7 +103,6 @@ $material-normal-button-focused-state-shadow: $material-button-box-shadow-size $
     $button-hover-bg,
     $button-focused-bg,
     $button-active-bg,
-    $button-disabled-background,
     $button-icon-color,
     $button-selected-bg,
     $button-selected-color,
@@ -145,7 +137,6 @@ $material-normal-button-focused-state-shadow: $material-button-box-shadow-size $
     $hover-bg,
     $focused-bg,
     $active-bg,
-    transparent,
     $button-color,
     $selected-bg,
     $selected-color,
@@ -156,14 +147,13 @@ $material-normal-button-focused-state-shadow: $material-button-box-shadow-size $
   border-width: 1px;
   border-style: solid;
   border-color: $border-color;
-  
+
   @include dx-button-styling-variant(
     transparent,
     $button-color,
     $hover-bg,
     $focused-bg,
     $active-bg,
-    transparent,
     $button-color,
     $selected-bg,
   );

package/data/scss/widgets/material/button/_sizes.scss

@@ -33,3 +33,7 @@ $material-button-active-box-shadow-size: 0 4px 6px !default;
   $material-button-icon-text-padding: 8px;
   $material-button-min-width: 48px !default;
 }
+
+:root { 
+  --dx-button-padding-inline: #{$material-button-horizontal-padding}; 
+} 

package/data/scss/widgets/material/calendar/_index.scss

@@ -30,7 +30,6 @@
   $calendar-navigator-text-color,
 );
 @include dx-calendar-body-mixin(
-  $calendar-cell-other-color,
   $calendar-week-number-cell-color,
   $calendar-week-number-cell-bg,
   $base-border-radius,

package/data/scss/widgets/material/checkBox/_colors.scss

@@ -10,4 +10,3 @@ $checkbox-indeterminate-bg: $base-accent !default;
 $checkbox-bg: $base-accent !default;
 $checkbox-hover-border-color: darken($base-accent, 12%) !default;
 $checkbox-invalid-focused-border-color: $base-invalid-color !default;
-$checkbox-icon-border-radius: $base-border-radius - 2 !default;