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

package/scss/grid/_variables.scss

@@ -1,172 +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;
+/// 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-filter-cell-padding-x: $grid-padding-y !default;
-$grid-filter-cell-padding-y: $grid-filter-cell-padding-x !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-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 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-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 edit cell.
+/// @group grid
+$kendo-grid-edit-cell-padding-x: $kendo-grid-cell-padding-x !default;
+/// Vertical padding of the grid filter cell.
+/// @group grid
+$kendo-grid-edit-cell-padding-y: 3px !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, 2 ) !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-sm !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: $kendo-grid-cell-padding-x-sm !default;
+$kendo-grid-edit-cell-padding-y-sm: k-map-get( $kendo-spacing, 0.5 ) !default; // sass-lint:disable-line leading-zero
+$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;
 
-$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: $grid-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-grid-header-bg !default;
 /// Text color of grid footer
 /// @group grid
-$grid-footer-text: $grid-header-text !default;
+$kendo-grid-footer-text: $kendo-grid-header-text !default;
 /// Border color of grid footer
 /// @group grid
-$grid-footer-border: $grid-header-border !default;
+$kendo-grid-footer-border: $kendo-grid-header-border !default;
 
 /// Background color of alternating rows in grid
 /// @group grid
-$grid-alt-bg: rgba( contrast-wcag( $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: darken($grid-bg, 7%) !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: null !default;
+$kendo-grid-selected-text: $kendo-table-selected-text !default;
 /// Border color of selected rows in grid
 /// @group grid
-$grid-selected-border: null !default;
+$kendo-grid-selected-border: $kendo-table-selected-border !default;
 
-$grid-selected-alt-bg: shade($grid-selected-bg, .4) !default;
-$grid-selected-hovered-bg: shade($grid-selected-bg, .7) !default;
+$kendo-grid-grouping-row-bg: $base-bg !default;
+$kendo-grid-grouping-row-text: $kendo-grid-text !default;
 
-$grid-grouping-row-bg: $base-bg !default;
-$grid-grouping-row-text: $grid-text !default;
+$kendo-grid-sorted-icon-spacing: calc( #{$kendo-padding-md-x} - 1px ) !default;
+$kendo-grid-sorted-bg: rgba( k-contrast-legacy( $kendo-grid-bg ), .02 ) !default;
+$kendo-grid-sorting-indicator-text: $kendo-color-primary !default;
+$kendo-grid-sorting-index-font-size: $font-size-sm !default;
+$kendo-grid-sorting-index-height: $kendo-icon-size !default;
+$kendo-grid-sorting-index-spacing-y: k-math-div( $kendo-icon-spacing, 2 ) !default;
+$kendo-grid-sorting-index-spacing-x: -$kendo-grid-sorting-index-spacing-y !default;
 
-$grid-sorted-bg: rgba( contrast-wcag( $grid-bg ), .02 ) !default;
-$grid-sorting-indicator-text: $primary !default;
-$grid-sorting-index-font-size: $font-size-sm !default;
-$grid-sorting-index-height: $icon-size !default;
-$grid-sorting-index-spacing-y: ($icon-spacing / 2) !default;
-$grid-sorting-index-spacing-x: -$grid-sorting-index-spacing-y !default;
 
+$kendo-grid-focus-shadow: $kendo-table-focus-shadow !default;
 
-$grid-focused-shadow: $kendo-list-item-focus-shadow !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: 3px !default;
+$kendo-grid-sticky-bg: $kendo-component-bg !default;
+$kendo-grid-sticky-text: $kendo-grid-text !default;
+$kendo-grid-sticky-border: rgba( black, .3 ) !default;
 
-$grid-command-cell-button-spacing: map-get( $spacing, 2 ) !default;
+$kendo-grid-sticky-alt-bg: k-color-shade($kendo-grid-bg, 3.5%) !default;
 
-$grid-sticky-bg: $component-bg !default;
-$grid-sticky-text: $grid-text !default;
-$grid-sticky-border: rgba( black, .3 ) !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: shade($grid-bg, 3.5%) !default;
+$kendo-grid-sticky-footer-bg: $kendo-grid-header-bg !default;
+$kendo-grid-sticky-footer-hover-bg: $kendo-grid-hover-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, #ffffff, 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-hovered-bg !default;
+$kendo-grid-sticky-hover-bg: k-color-darken($kendo-grid-bg, 8%) !default;
+$kendo-grid-sticky-selected-hover-bg: k-color-shade($kendo-grid-sticky-selected-bg, .7) !default;
 
-$grid-sticky-selected-bg: mix($selected-bg, #ffffff, 25%) !default;
-$grid-sticky-selected-alt-bg: shade($grid-sticky-selected-bg, .4) !default;
+$kendo-grid-column-menu-width: 230px !default;
 
-$grid-sticky-hovered-bg: darken($grid-bg, 8%) !default;
-$grid-sticky-selected-hovered-bg: shade($grid-sticky-selected-bg, .7) !default;
+$kendo-grid-filter-menu-check-all-border-bottom-width: 1px !default;
 
-$grid-column-menu-width: 230px !default;
+$kendo-grid-filter-menu-item-spacing-x: k-map-get( $kendo-spacing, 2 ) !default;
+$kendo-grid-filter-menu-item-spacing-y: $kendo-grid-filter-menu-item-spacing-x !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: map-get( $spacing, 2 ) !default;
-$grid-filter-menu-item-spacing-y: $grid-filter-menu-item-spacing-x !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, 1.5 ) !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: $padding-y-lg !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 !default;
-$grid-column-menu-filter-container-padding-y: $padding-y !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 * 2.25) !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 * 2.25) !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";