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

package/scss/grid/_variables.scss

@@ -1,169 +1,270 @@
 // Grid
-$grid-border-width: 1px !default;
-$grid-font-family: $font-family !default;
-$grid-font-size: $font-size !default;
-$grid-line-height: $line-height !default;
+$kendo-grid-border-width: 1px !default;
+$kendo-grid-font-family: $font-family !default;
+$kendo-grid-font-size: $font-size !default;
+$kendo-grid-line-height: $line-height !default;
 
-$grid-padding-x: $table-cell-padding-x !default;
-$grid-padding-y: $table-cell-padding-y !default;
-
-$grid-header-padding-x: $grid-padding-x !default;
-$grid-header-padding-y: $grid-padding-y !default;
-$grid-header-font-size: null !default;
+/// Horizontal padding of the grid.
+/// @group grid
+$kendo-grid-padding-x: $kendo-table-cell-padding-x-md !default;
+/// Vertical padding of the grid.
+/// @group grid
+$kendo-grid-padding-y: $kendo-table-cell-padding-y-md !default;
 
-$grid-footer-padding-x: $grid-header-padding-x !default;
-$grid-footer-padding-y: $grid-header-padding-y !default;
+/// Horizontal padding of the grid header.
+/// @group grid
+$kendo-grid-header-padding-x: $kendo-grid-padding-x !default;
+/// Vertical padding of the grid header.
+/// @group grid
+$kendo-grid-header-padding-y: $kendo-grid-padding-y !default;
 
-$grid-grouping-header-padding-x: $grid-padding-y !default;
-$grid-grouping-header-padding-y: $grid-grouping-header-padding-x !default;
 
-$grid-filter-cell-padding-x: $grid-padding-y !default;
-$grid-filter-cell-padding-y: $grid-filter-cell-padding-x !default;
+/// Horizontal padding of the grid grouping header.
+/// @group grid
+$kendo-grid-grouping-header-padding-x: $kendo-grid-padding-y !default;
+/// Vertical padding of the grid grouping header.
+/// @group grid
+$kendo-grid-grouping-header-padding-y: $kendo-grid-grouping-header-padding-x !default;
 
-$grid-toolbar-padding-x: $toolbar-padding-x !default;
-$grid-toolbar-padding-y: $toolbar-padding-y !default;
-$grid-toolbar-spacing: $toolbar-spacing !default;
-$grid-toolbar-border-width: $grid-border-width !default;
+/// Horizontal padding of the grid cell.
+/// @group grid
+$kendo-grid-cell-padding-x: $kendo-grid-padding-x !default;
+/// Vertical padding of the grid cell.
+/// @group grid
+$kendo-grid-cell-padding-y: $kendo-grid-padding-y !default;
 
-$grid-cell-padding-x: $grid-padding-x !default;
-$grid-cell-padding-y: $grid-padding-y !default;
-$grid-cell-horizontal-border-width: 0px !default;
-$grid-cell-vertical-border-width: 1px !default;
+/// Horizontal padding of the grid filter cell.
+/// @group grid
+$kendo-grid-filter-cell-padding-x: $kendo-grid-padding-y !default;
+/// Vertical padding of the grid filter cell.
+/// @group grid
+$kendo-grid-filter-cell-padding-y: $kendo-grid-filter-cell-padding-x !default;
 
-$grid-cell-placeholder-line-width: 80% !default;
+/// Horizontal padding of the grid edit cell.
+/// @group grid
+$kendo-grid-edit-cell-padding-x: $kendo-grid-cell-padding-x !default;
+/// Vertical padding of the grid edit cell.
+/// @group grid
+$kendo-grid-edit-cell-padding-y: 5px !default;
+
+$kendo-grid-group-dropclue-size: 6px !default;
+$kendo-grid-group-dropclue-line-size: k-math-div( $kendo-grid-group-dropclue-size, 3) !default;
+$kendo-grid-group-dropclue-height: calc( #{$kendo-chip-calc-size} + #{$kendo-grid-group-dropclue-size}) !default;
+$kendo-grid-group-dropclue-top: 3px !default;
+
+$kendo-grid-padding-x-sm: k-map-get( $kendo-spacing, 1 ) !default;
+$kendo-grid-padding-y-sm: k-map-get( $kendo-spacing, 1 ) !default;
+$kendo-grid-header-padding-x-sm: $kendo-grid-padding-x-sm !default;
+$kendo-grid-header-padding-y-sm: $kendo-grid-padding-y-sm !default;
+$kendo-grid-grouping-header-padding-x-sm: $kendo-grid-padding-x !default;
+$kendo-grid-grouping-header-padding-y-sm: $kendo-grid-padding-y-sm !default;
+$kendo-grid-cell-padding-x-sm: $kendo-grid-padding-x-sm !default;
+$kendo-grid-cell-padding-y-sm: $kendo-grid-padding-y-sm !default;
+$kendo-grid-filter-cell-padding-x-sm: k-map-get( $kendo-spacing, 1.5 ) !default;
+$kendo-grid-filter-cell-padding-y-sm: $kendo-grid-filter-cell-padding-x-sm !default;
+$kendo-grid-edit-cell-padding-x-sm: k-map-get( $kendo-spacing, 1 ) !default;
+$kendo-grid-edit-cell-padding-y-sm: k-map-get( $kendo-spacing, 1 ) !default;
+$kendo-grid-group-dropclue-height-sm: calc( #{$kendo-chip-calc-size-sm} + #{$kendo-grid-group-dropclue-size}) !default;
+
+$kendo-grid-padding-x-md: $kendo-grid-padding-x !default;
+$kendo-grid-padding-y-md: $kendo-grid-padding-y !default;
+$kendo-grid-header-padding-x-md: $kendo-grid-header-padding-x !default;
+$kendo-grid-header-padding-y-md: $kendo-grid-header-padding-y !default;
+$kendo-grid-grouping-header-padding-x-md: $kendo-grid-grouping-header-padding-x !default;
+$kendo-grid-grouping-header-padding-y-md: $kendo-grid-grouping-header-padding-y !default;
+$kendo-grid-cell-padding-x-md: $kendo-grid-cell-padding-x !default;
+$kendo-grid-cell-padding-y-md: $kendo-grid-cell-padding-y !default;
+$kendo-grid-filter-cell-padding-x-md: $kendo-grid-filter-cell-padding-x !default;
+$kendo-grid-filter-cell-padding-y-md: $kendo-grid-filter-cell-padding-y !default;
+$kendo-grid-edit-cell-padding-x-md: $kendo-grid-edit-cell-padding-x !default;
+$kendo-grid-edit-cell-padding-y-md: $kendo-grid-edit-cell-padding-y !default;
+$kendo-grid-group-dropclue-height-md: $kendo-grid-group-dropclue-height !default;
+
+
+// Kendo Grid sizes
+$kendo-grid-sizes: (
+    sm: (
+        header-padding-x: $kendo-grid-header-padding-x-sm,
+        header-padding-y: $kendo-grid-header-padding-y-sm,
+        grouping-header-padding-x: $kendo-grid-grouping-header-padding-x-sm,
+        grouping-header-padding-y: $kendo-grid-grouping-header-padding-y-sm,
+        cell-padding-x: $kendo-grid-cell-padding-x-sm,
+        cell-padding-y: $kendo-grid-cell-padding-y-sm,
+        filter-cell-padding-x: $kendo-grid-filter-cell-padding-x-sm,
+        filter-cell-padding-y: $kendo-grid-filter-cell-padding-y-sm,
+        edit-cell-padding-x: $kendo-grid-edit-cell-padding-x-sm,
+        edit-cell-padding-y: $kendo-grid-edit-cell-padding-y-sm,
+        button-padding-y: $kendo-button-padding-y-sm,
+        button-calc-size: $kendo-button-calc-size-sm,
+        group-dropclue-height: $kendo-grid-group-dropclue-height-sm
+    ),
+    md: (
+        header-padding-x: $kendo-grid-header-padding-x-md,
+        header-padding-y: $kendo-grid-header-padding-y-md,
+        grouping-header-padding-x: $kendo-grid-grouping-header-padding-x-md,
+        grouping-header-padding-y: $kendo-grid-grouping-header-padding-y-md,
+        cell-padding-x: $kendo-grid-cell-padding-x-md,
+        cell-padding-y: $kendo-grid-cell-padding-y-md,
+        filter-cell-padding-x: $kendo-grid-filter-cell-padding-x-md,
+        filter-cell-padding-y: $kendo-grid-filter-cell-padding-y-md,
+        edit-cell-padding-x: $kendo-grid-edit-cell-padding-x-md,
+        edit-cell-padding-y: $kendo-grid-edit-cell-padding-y-md,
+        button-padding-y: $kendo-button-padding-y-md,
+        button-calc-size: $kendo-button-calc-size-md,
+        group-dropclue-height: $kendo-grid-group-dropclue-height-md
+    ),
+) !default;
+
+$kendo-grid-header-font-size: null !default;
+$kendo-grid-header-first-border: 1px !default;
+$kendo-grid-header-menu-icon-spacing: $kendo-icon-spacing !default;
+
+$kendo-grid-filterable-icon-spacing: calc( #{$kendo-button-calc-size} + #{$kendo-grid-header-menu-icon-spacing} ) !default;
+
+$kendo-grid-toolbar-border-width: $kendo-grid-border-width !default;
+
+$kendo-grid-cell-horizontal-border-width: $kendo-table-cell-horizontal-border-width !default;
+$kendo-grid-cell-vertical-border-width: $kendo-table-cell-vertical-border-width !default;
+
+$kendo-grid-cell-placeholder-line-width: 80% !default;
 
 /// Background color of the grid component
 /// @group grid
-$grid-bg: $component-bg !default;
+$kendo-grid-bg: $kendo-table-bg !default;
 /// Text color of the grid component
 /// @group grid
-$grid-text: $component-text !default;
+$kendo-grid-text: $kendo-table-text !default;
 /// Border color of the grid component
 /// @group grid
-$grid-border: $component-border !default;
+$kendo-grid-border: $kendo-table-border !default;
 
 /// Background color of grid header
 /// @group grid
-$grid-header-bg: $header-bg !default;
+$kendo-grid-header-bg: $kendo-table-header-bg !default;
 /// Text color of grid header
 /// @group grid
-$grid-header-text: $header-text !default;
+$kendo-grid-header-text: $kendo-table-header-text !default;
 /// Border color of grid header
 /// @group grid
-$grid-header-border: $header-border !default;
+$kendo-grid-header-border: $kendo-table-header-border !default;
 /// Background gradient of grid header
 /// @group grid
-$grid-header-gradient: $header-gradient !default;
+$kendo-grid-header-gradient: $kendo-table-header-gradient !default;
 
 /// Background color of grid footer
 /// @group grid
-$grid-footer-bg: $grid-header-bg !default;
+$kendo-grid-footer-bg: $kendo-table-footer-bg !default;
 /// Text color of grid footer
 /// @group grid
-$grid-footer-text: $grid-header-text !default;
+$kendo-grid-footer-text: $kendo-table-footer-text !default;
 /// Border color of grid footer
 /// @group grid
-$grid-footer-border: $grid-header-border !default;
+$kendo-grid-footer-border: $kendo-table-footer-border !default;
 
 /// Background color of alternating rows in grid
 /// @group grid
-$grid-alt-bg: rgba( k-contrast-color( $grid-bg ), .04 ) !default;
+$kendo-grid-alt-bg: $kendo-table-alt-row-bg !default;
 /// Text color of alternating rows in grid
 /// @group grid
-$grid-alt-text: null !default;
+$kendo-grid-alt-text: $kendo-table-alt-row-text !default;
 /// Border color of alternating rows in grid
 /// @group grid
-$grid-alt-border: null !default;
+$kendo-grid-alt-border: $kendo-table-alt-row-border !default;
 
 /// Background color of hovered rows in grid
 /// @group grid
-$grid-hovered-bg: rgba( k-contrast-color( $grid-bg ), .08 ) !default;
+$kendo-grid-hover-bg: $kendo-table-hover-bg !default;
 /// Text color of hovered rows in grid
 /// @group grid
-$grid-hovered-text: null !default;
+$kendo-grid-hover-text: $kendo-table-hover-text !default;
 /// Border color of hovered rows in grid
 /// @group grid
-$grid-hovered-border: null !default;
+$kendo-grid-hover-border: $kendo-table-hover-border !default;
 
 /// Background color of selected rows in grid
 /// @group grid
-$grid-selected-bg: rgba( $selected-bg, .25 ) !default;
+$kendo-grid-selected-bg: $kendo-table-selected-bg !default;
 /// Text color of selected rows in grid
 /// @group grid
-$grid-selected-text: $grid-text !default;
+$kendo-grid-selected-text: $kendo-table-selected-text !default;
 /// Border color of selected rows in grid
 /// @group grid
-$grid-selected-border: $grid-border !default;
+$kendo-grid-selected-border: $kendo-table-selected-border !default;
+
+$kendo-grid-grouping-row-bg: k-try-shade( $kendo-grid-bg ) !default;
+$kendo-grid-grouping-row-text: $kendo-grid-text !default;
 
-$grid-grouping-row-bg: k-try-shade( $grid-bg ) !default;
-$grid-grouping-row-text: $grid-text !default;
+$kendo-grid-sorted-bg: rgba( k-contrast-color( $kendo-grid-bg ), .02 ) !default;
+$kendo-grid-sorting-indicator-text: $kendo-color-primary !default;
+$kendo-grid-sorting-index-font-size: ($kendo-icon-size * .75) !default;
+$kendo-grid-sorting-index-height: $kendo-icon-size !default;
+$kendo-grid-sorting-index-spacing-y: 2px !default;
+$kendo-grid-sorting-index-spacing-x: -$kendo-grid-sorting-index-spacing-y !default;
 
-$grid-sorted-bg: rgba( k-contrast-color( $grid-bg ), .02 ) !default;
-$grid-sorting-indicator-text: $primary !default;
-$grid-sorting-index-font-size: ($icon-size * .75) !default;
-$grid-sorting-index-height: $icon-size !default;
-$grid-sorting-index-spacing-y: 2px !default;
-$grid-sorting-index-spacing-x: -$grid-sorting-index-spacing-y !default;
+$kendo-grid-sorted-icon-spacing: calc( #{$kendo-padding-md-x} - 1px ) !default;
 
+$kendo-grid-focus-shadow: $kendo-table-focus-shadow !default;
 
-$grid-focused-shadow: inset 0 0 0 2px rgba( black, .08 ) !default;
+$kendo-grid-command-cell-button-spacing: k-map-get( $kendo-spacing, 2 ) !default;
+// be cautious when changing the next line; see https://github.com/MoOx/reduce-css-calc/issues/38
+$kendo-grid-command-cell-padding-y: calc( #{$kendo-grid-cell-padding-y} - (#{$kendo-button-calc-size} - #{$line-height-em}) / 2 ) !default;
 
-$grid-edit-cell-padding-x: $grid-cell-padding-x !default;
-$grid-edit-cell-padding-y: 5px !default;
+$kendo-grid-sticky-bg: $kendo-grid-bg !default;
+$kendo-grid-sticky-text: $kendo-grid-text !default;
+$kendo-grid-sticky-border: rgba($kendo-grid-text, .5) !default;
 
-$grid-command-cell-button-spacing: k-map-get( $spacing, 2 ) !default;
+$kendo-grid-sticky-alt-bg: k-try-shade( $kendo-grid-bg, .5 ) !default;
 
-$grid-sticky-bg: $grid-bg !default;
-$grid-sticky-text: $grid-text !default;
-$grid-sticky-border: rgba( $grid-text, .5 ) !default;
+$kendo-grid-sticky-header-bg: $kendo-grid-header-bg !default;
+$kendo-grid-sticky-header-text: $kendo-grid-header-text !default;
+$kendo-grid-sticky-header-border: $kendo-grid-sticky-border !default;
 
-$grid-sticky-alt-bg: k-try-shade( $grid-bg, .5 ) !default;
+$kendo-grid-sticky-footer-bg: $kendo-grid-header-bg !default;
+$kendo-grid-sticky-footer-hover-bg: $kendo-grid-sticky-footer-bg !default;
 
-$grid-sticky-header-bg: $grid-header-bg !default;
-$grid-sticky-header-text: $grid-header-text !default;
-$grid-sticky-header-border: $grid-sticky-border !default;
+$kendo-grid-sticky-selected-bg: k-color-mix( $kendo-selected-bg, $kendo-grid-bg, 25% ) !default;
+$kendo-grid-sticky-selected-alt-bg: k-color-shade( $kendo-grid-sticky-selected-bg, .4 ) !default;
 
-$grid-sticky-footer-bg: $grid-header-bg !default;
-$grid-sticky-footer-hovered-bg: $grid-sticky-footer-bg !default;
+$kendo-grid-sticky-hover-bg: k-try-shade( $kendo-grid-bg ) !default;
+$kendo-grid-sticky-selected-hover-bg: k-color-shade( $kendo-grid-sticky-selected-bg, .7 ) !default;
 
-$grid-sticky-selected-bg: k-color-mix( $selected-bg, $grid-bg, 25% ) !default;
-$grid-sticky-selected-alt-bg: k-color-shade( $grid-sticky-selected-bg, .4 ) !default;
+$kendo-grid-column-menu-width: 250px !default;
 
-$grid-sticky-hovered-bg: k-try-shade( $grid-bg ) !default;
-$grid-sticky-selected-hovered-bg: k-color-shade( $grid-sticky-selected-bg, .7 ) !default;
+$kendo-grid-filter-menu-check-all-border-bottom-width: 1px !default;
 
-$grid-column-menu-width: 250px !default;
+$kendo-grid-filter-menu-item-spacing-x: k-map-get( $kendo-spacing, 6 ) !default;
+$kendo-grid-filter-menu-item-spacing-y: k-map-get( $kendo-spacing, 2 ) !default;
 
-$grid-filter-menu-check-all-border-bottom-width: 1px !default;
+$kendo-grid-column-menu-popup-padding-x: null !default;
+$kendo-grid-column-menu-popup-padding-y: null !default;
 
-$grid-filter-menu-item-spacing-x: k-map-get( $spacing, 6 ) !default;
-$grid-filter-menu-item-spacing-y: k-map-get( $spacing, 2 ) !default;
+$kendo-grid-column-menu-item-padding-x: $kendo-menu-popup-item-padding-x !default;
+$kendo-grid-column-menu-item-padding-y: $kendo-menu-popup-item-padding-y !default;
 
-$grid-column-menu-popup-padding-x: null !default;
-$grid-column-menu-popup-padding-y: null !default;
+$kendo-grid-column-menu-list-item-padding-x: $kendo-list-item-padding-x-md !default;
+$kendo-grid-column-menu-list-item-padding-y: $kendo-list-item-padding-y-md !default;
 
-$grid-column-menu-item-padding-x: $kendo-menu-popup-item-padding-x !default;
-$grid-column-menu-item-padding-y: $kendo-menu-popup-item-padding-y !default;
+$kendo-grid-column-menu-items-wrap-padding-x: 0 !default;
+$kendo-grid-column-menu-items-wrap-padding-y: k-map-get( $kendo-spacing, 2 ) !default;
 
-$grid-column-menu-list-item-padding-x: $kendo-list-item-padding-x-md !default;
-$grid-column-menu-list-item-padding-y: $kendo-list-item-padding-y-md !default;
+$kendo-grid-column-menu-group-header-padding-x: $kendo-menu-popup-item-padding-x-md !default;
+$kendo-grid-column-menu-group-header-padding-y: $kendo-menu-popup-item-padding-y-md !default;
 
-$grid-column-menu-items-wrap-padding-x: 0 !default;
-$grid-column-menu-items-wrap-padding-y: k-map-get( $spacing, 2 ) !default;
+$kendo-grid-column-menu-group-header-font-size: $font-size-sm !default;
+$kendo-grid-column-menu-group-header-line-height: $line-height !default;
+$kendo-grid-column-menu-group-header-text-transform: uppercase !default;
+$kendo-grid-column-menu-group-header-border-bottom-width: 1px !default;
 
-$grid-column-menu-filter-container-padding-x: $padding-x-lg !default;
-$grid-column-menu-filter-container-padding-y: $padding-y-sm !default;
+$kendo-grid-column-menu-group-header-bg: null !default;
+$kendo-grid-column-menu-group-header-text: $popup-text !default;
+$kendo-grid-column-menu-group-header-border: $popup-border !default;
 
-$grid-column-menu-group-header-padding-x: $kendo-menu-popup-item-padding-x-md !default;
-$grid-column-menu-group-header-padding-y: $kendo-menu-popup-item-padding-y-md !default;
+$kendo-grid-drag-cell-width: ($kendo-icon-size * 3) !default;
 
-$grid-column-menu-group-header-font-size: $font-size-sm !default;
-$grid-column-menu-group-header-line-height: $line-height !default;
-$grid-column-menu-group-header-text-transform: uppercase !default;
-$grid-column-menu-group-header-border-bottom-width: 1px !default;
+$kendo-grid-row-inner-height: calc( #{$line-height-em} + #{$kendo-grid-cell-padding-y * 2} ) !default;
 
-$grid-column-menu-group-header-bg: null !default;
-$grid-column-menu-group-header-text: $popup-text !default;
-$grid-column-menu-group-header-border: $popup-border !default;
+$kendo-grid-hierarchy-col-width: ($kendo-icon-size * 2) !default;
 
-$grid-drag-cell-width: ($icon-size * 3) !default;
+$kendo-grid-grouping-row-border-top: 1px !default;
+$kendo-grid-group-footer-border-y: 1px !default;
+$kendo-grid-group-footer-second-cell-border: 1px !default;

package/scss/icons/_index.scss

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

package/scss/icons/_layout.scss

@@ -1 +1 @@
-@import "~@progress/kendo-theme-default/scss/icons/_layout.scss";
+@import "@progress/kendo-theme-default/scss/icons/_layout.scss";

package/scss/imageeditor/_index.scss

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

package/scss/imageeditor/_layout.scss

@@ -1 +1 @@
-@import "~@progress/kendo-theme-default/scss/imageeditor/_layout.scss";
+@import "@progress/kendo-theme-default/scss/imageeditor/_layout.scss";

package/scss/imageeditor/_theme.scss

@@ -1 +1 @@
-@import "~@progress/kendo-theme-default/scss/imageeditor/_theme.scss";
+@import "@progress/kendo-theme-default/scss/imageeditor/_theme.scss";

package/scss/imageeditor/_variables.scss

@@ -11,9 +11,9 @@ $imageeditor-font-family: $font-family !default;
 
 $imageeditor-content-border-width: 1px !default;
 
-$imageeditor-action-pane-padding-y: k-map-get( $spacing, 8 ) !default;
-$imageeditor-action-pane-padding-x: k-map-get( $spacing, 4 ) !default;
-$imageeditor-action-pane-width: if( $imageeditor-content-border-width == null, 240px, calc( 240px + #{$imageeditor-content-border-width} ) );
+$imageeditor-action-pane-padding-y: k-map-get( $kendo-spacing, 8 ) !default;
+$imageeditor-action-pane-padding-x: k-map-get( $kendo-spacing, 4 ) !default;
+$imageeditor-action-pane-width: if( $imageeditor-content-border-width == null, 240px, calc( 240px + #{$imageeditor-content-border-width} ) ) !default;
 
 $imageeditor-crop-border-width: 1px !default;
 $imageeditor-crop-border-style: dashed !default;
@@ -23,15 +23,15 @@ $imageeditor-resize-handle-margin-y: 1px !default;
 $imageeditor-resize-handle-border-width: 0 2px 2px 0 !default;
 $imageeditor-resize-handle-size: 15px !default;
 
-$imageeditor-bg: $component-bg !default;
-$imageeditor-text: $component-text !default;
-$imageeditor-border: $component-border !default;
+$imageeditor-bg: $kendo-component-bg !default;
+$imageeditor-text: $kendo-component-text !default;
+$imageeditor-border: $kendo-component-border !default;
 
 $imageeditor-content-bg: #c6c6c6 !default;
 $imageeditor-content-text: null !default;
 $imageeditor-content-border: null !default;
 
-$imageeditor-action-pane-bg: $component-bg !default;
+$imageeditor-action-pane-bg: $kendo-component-bg !default;
 $imageeditor-action-pane-text: null !default;
 $imageeditor-action-pane-border: null !default;