@progress/kendo-theme-classic 5.0.0-alpha.3 → 5.0.0-beta.3

package/scss/combobox/_variables.scss

@@ -1,33 +1 @@
-// Comboboxes
-$combobox-select-padding-x: $kendo-button-padding-y !default;
-$combobox-select-padding-y: $kendo-button-padding-y !default;
-$combobox-select-width: $kendo-button-inner-calc-size !default;
-$combobox-select-border-width: 1px !default;
-
-$combobox-bg: $kendo-input-bg !default;
-$combobox-text: $kendo-input-text !default;
-$combobox-border: $kendo-input-border !default;
-
-$combobox-hovered-bg: $kendo-input-hover-bg !default;
-$combobox-hovered-text: $kendo-input-hover-text !default;
-$combobox-hovered-border: $kendo-input-hover-border !default;
-
-$combobox-focused-bg: $kendo-input-focus-bg !default;
-$combobox-focused-text: $kendo-input-focus-text !default;
-$combobox-focused-border: $kendo-input-focus-border !default;
-$combobox-focused-shadow: $kendo-input-focus-shadow !default;
-
-$combobox-select-bg: $kendo-button-bg !default;
-$combobox-select-text: $kendo-button-text !default;
-$combobox-select-border: $kendo-button-border !default;
-$combobox-select-gradient: $kendo-button-gradient !default;
-
-$combobox-select-hovered-bg: $kendo-button-hover-bg !default;
-$combobox-select-hovered-text: $kendo-button-hover-text !default;
-$combobox-select-hovered-border: $kendo-button-hover-border !default;
-$combobox-select-hovered-gradient: $kendo-button-hover-gradient !default;
-
-$combobox-select-pressed-bg: $kendo-button-active-bg !default;
-$combobox-select-pressed-text: $kendo-button-active-text !default;
-$combobox-select-pressed-border: $kendo-button-active-border !default;
-$combobox-select-pressed-gradient: $kendo-button-active-gradient !default;
+// Combobox

package/scss/dataviz/_index.scss

@@ -5,6 +5,7 @@
 @import "../common/_index.scss";
 @import "../popup/_index.scss";
 @import "../tooltip/_index.scss";
+@import "../button/_variables.scss";
 
 
 // Component

package/scss/dateinput/_index.scss

@@ -2,11 +2,7 @@
 
 
 // Dependencies
-@import "../common/_index.scss";
 @import "../input/_index.scss";
-@import "../floating-label/_index.scss";
-@import "../popup/_index.scss";
-@import "../icons/_index.scss";
 
 
 // Component

package/scss/dateinput/_variables.scss

@@ -1 +1 @@
-// Dateinput
+// Date input

package/scss/datepicker/_index.scss

@@ -2,11 +2,9 @@
 
 
 // Dependencies
-@import "../common/_index.scss";
 @import "../input/_index.scss";
-@import "../floating-label/_index.scss";
 @import "../popup/_index.scss";
-@import "../icons/_index.scss";
+@import "../calendar/_index.scss";
 
 
 // Component

package/scss/datetimepicker/_index.scss

@@ -2,11 +2,13 @@
 
 
 // Dependencies
-@import "../common/_index.scss";
 @import "../input/_index.scss";
-@import "../floating-label/_index.scss";
+@import "../button/_index.scss";
 @import "../popup/_index.scss";
-@import "../icons/_index.scss";
+@import "../list/_index.scss";
+@import "../calendar/_index.scss";
+@import "../timeselector/_index.scss";
+@import "../action-buttons/_index.scss";
 
 
 // Component

package/scss/datetimepicker/_variables.scss

@@ -1 +1,2 @@
-// Datetimepicker
+// DateTime
+$datetime-width: calc( #{$calendar-cell-size * 8} + #{$infinite-calendar-view-padding-x * 2}) !default;

package/scss/drawer/_index.scss

@@ -5,6 +5,7 @@
 @import "../common/_index.scss";
 @import "../overlay/_index.scss";
 @import "../toolbar/_index.scss";
+@import "../list/_index.scss";
 
 
 // Component

package/scss/drawer/_variables.scss

@@ -27,7 +27,7 @@ $drawer-hovered-bg: $hovered-bg !default;
 $drawer-hovered-text: $hovered-text !default;
 
 $drawer-focused-bg: $drawer-bg !default;
-$drawer-focused-shadow: $list-item-focused-shadow !default;
+$drawer-focused-shadow: $kendo-list-item-focus-shadow !default;
 
 $drawer-selected-bg: $selected-bg !default;
 $drawer-selected-text: $selected-text !default;

package/scss/dropdownlist/_index.scss

@@ -6,6 +6,7 @@
 @import "../input/_index.scss";
 @import "../floating-label/_index.scss";
 @import "../popup/_index.scss";
+@import "../list/_index.scss";
 
 
 // Component

package/scss/editor/_variables.scss

@@ -14,7 +14,7 @@ $editor-highlighted-bg: mix($primary, #ffffff, 20%) !default;
 
 $editor-export-tool-icon-margin-x: .25em !default;
 
-$editor-resize-handle-size: 5px !default;
+$editor-resize-handle-size: 8px !default;
 $editor-resize-handle-border-width: 1px !default;
 $editor-resize-handle-border: #000000 !default;
 $editor-resize-handle-bg: #ffffff !default;

package/scss/expansion-panel/_index.scss

@@ -3,7 +3,10 @@
 
 // Dependencies
 @import "../common/_index.scss";
+@import "../utils/_display.scss";
+@import "../utils/_spacer.scss";
 @import "../icons/_index.scss";
+@import "../list/_index.scss";
 
 
 // Component

package/scss/expansion-panel/_variables.scss

@@ -14,7 +14,7 @@ $expander-bg: $component-bg !default;
 $expander-text: $component-text !default;
 $expander-border: $component-border !default;
 
-$expander-focus-shadow: $list-item-focused-shadow !default;
+$expander-focus-shadow: $kendo-list-item-focus-shadow !default;
 
 $expander-header-bg: transparent !default;
 $expander-header-text: $expander-text !default;
@@ -23,7 +23,7 @@ $expander-header-border: null !default;
 $expander-header-hover-bg: shade($expander-bg) !default;
 
 $expander-header-focused-bg: null !default;
-$expander-header-focused-shadow: $list-item-focused-shadow !default;
+$expander-header-focused-shadow: $kendo-list-item-focus-shadow !default;
 
 $expander-title-text: $primary !default;
 

package/scss/fab/_variables.scss

@@ -1,74 +1,131 @@
 // Floating Action Button
-$fab-padding-x: map-get( $spacing, 4 ) !default;
-$fab-padding-y: $fab-padding-x !default;
-$fab-border-width: 1px !default;
-$fab-border-radius: $border-radius !default;
-$fab-font-family: $font-family !default;
-$fab-font-size: $font-size !default;
-$fab-line-height: $line-height !default;
 
-$fab-padding-x-sm: ( $fab-padding-x / 2 ) !default;
-$fab-padding-y-sm: ( $fab-padding-y / 2 ) !default;
-
-$fab-padding-x-md: $fab-padding-x !default;
-$fab-padding-y-md: $fab-padding-y !default;
-
-$fab-padding-x-lg: ( $fab-padding-x * 1.5 ) !default;
-$fab-padding-y-lg: ( $fab-padding-y * 1.5 ) !default;
-
-$fab-icon-width: 20px !default;
-$fab-icon-height: $fab-icon-width !default;
-$fab-icon-spacing: map-get( $spacing, 1 ) / 2 !default;
-
-$fab-items-padding-x: 0px !default;
-$fab-items-padding-y: map-get( $spacing, 4 ) !default;
-
-$fab-item-text-padding-x: map-get( $spacing, 1 ) !default;
-$fab-item-text-padding-y: $fab-item-text-padding-x !default;
-$fab-item-text-border-width: 1px !default;
-$fab-item-text-border-radius: 2px !default;
-$fab-item-text-font-size: $font-size-xs !default;
-$fab-item-text-line-height: 1.2 !default;
-
-$fab-item-icon-padding-x: map-get( $spacing, 2 ) !default;
-$fab-item-icon-padding-y: $fab-item-icon-padding-x !default;
-$fab-item-icon-border-width: 0 !default;
-$fab-item-icon-border-radius: 50% !default;
-$fab-item-icon-width: 20px !default;
-$fab-item-icon-height: $fab-item-icon-width !default;
-
-$fab-sizes: (
-    sm: map-get( $spacing, 4 ),
-    md: map-get( $spacing, 8 ),
-    lg: map-get( $spacing, 16 )
-) !default;
-
-$fab-theme-colors: $theme-colors !default;
-
-$fab-shadow: 0 6px 10px rgba(0, 0, 0, .14), 0 1px 18px rgba(0, 0, 0, .12), 0 3px 5px rgba(0, 0, 0, .2) !default;
-$fab-disabled-shadow: 0 6px 10px try-tint( rgba(0, 0, 0, .14), .5 ), 0 1px 18px try-tint( rgba(0, 0, 0, .12), .5 ), 0 3px 5px try-tint( rgba(0, 0, 0, .2), .5 ) !default;
-$fab-active-shadow: null !default;
-
-$fab-item-text: $component-text !default;
-$fab-item-bg: $component-bg !default;
-$fab-item-border: $component-border !default;
-
-$fab-item-icon-text: $kendo-button-text !default;
-$fab-item-icon-bg: $kendo-button-bg !default;
-$fab-item-icon-border: $kendo-button-border !default;
-
-$fab-item-shadow: $fab-shadow !default;
-$fab-item-disabled-shadow: $fab-disabled-shadow !default;
-$fab-item-active-shadow: $fab-active-shadow !default;
-
-$fab-border-width-sm: $fab-border-width !default;
-$fab-line-height-sm: $fab-line-height !default;
-$fab-size-sm: calc( #{$fab-line-height-sm * 1em} + #{$fab-padding-y-sm * 2} + #{$fab-border-width-sm * 2} ) !default;
-
-$fab-border-width-md: $fab-border-width !default;
-$fab-line-height-md: $fab-line-height !default;
-$fab-size-md: calc( #{$fab-line-height-md * 1em} + #{$fab-padding-y-md * 2} + #{$fab-border-width-md * 2} ) !default;
-
-$fab-border-width-lg: $fab-border-width !default;
-$fab-line-height-lg: $fab-line-height !default;
-$fab-size-lg: calc( #{$fab-line-height-lg * 1em} + #{$fab-padding-y-lg * 2} + #{$fab-border-width-lg * 2} ) !default;
+/// Width of the border around the FAB.
+/// @group floating-action-button
+$kendo-fab-border-width: 1px !default;
+/// Border radius of the FAB.
+/// @group floating-action-button
+$kendo-fab-border-radius: $border-radius !default;
+
+/// Font family of the FAB.
+/// @group floating-action-button
+$kendo-fab-font-family: $font-family !default;
+/// Font size of the FAB.
+/// @group floating-action-button
+$kendo-fab-font-size: $font-size !default;
+/// Line height of the FAB.
+/// @group floating-action-button
+$kendo-fab-line-height: $line-height !default;
+
+/// Horizontal padding of the FAB.
+/// @group floating-action-button
+$kendo-fab-padding-x: map-get( $spacing, 4 ) !default;
+$kendo-fab-padding-x-sm: ( $kendo-fab-padding-x / 2 ) !default;
+$kendo-fab-padding-x-md: $kendo-fab-padding-x !default;
+$kendo-fab-padding-x-lg: ( $kendo-fab-padding-x * 1.5 ) !default;
+
+/// Vertical padding of the FAB.
+/// @group floating-action-button
+$kendo-fab-padding-y: $kendo-fab-padding-x !default;
+$kendo-fab-padding-y-sm: ( $kendo-fab-padding-y / 2 ) !default;
+$kendo-fab-padding-y-md: $kendo-fab-padding-y !default;
+$kendo-fab-padding-y-lg: ( $kendo-fab-padding-y * 1.5 ) !default;
+
+/// FAB icon width.
+/// @group floating-action-button
+$kendo-fab-icon-width: 20px !default;
+/// FAB icon height.
+/// @group floating-action-button
+$kendo-fab-icon-height: $kendo-fab-icon-width !default;
+/// FAB icon spacing.
+/// @group floating-action-button
+$kendo-fab-icon-spacing: map-get( $spacing, 1 ) / 2 !default;
+
+/// FAB items horizontal padding.
+/// @group floating-action-button
+$kendo-fab-items-padding-x: 0px !default;
+/// FAB items vertical padding.
+/// @group floating-action-button
+$kendo-fab-items-padding-y: map-get( $spacing, 4 ) !default;
+
+/// FAB item text horizontal padding.
+/// @group floating-action-button
+$kendo-fab-item-text-padding-x: map-get( $spacing, 1 ) !default;
+/// FAB item text vertical padding.
+/// @group floating-action-button
+$kendo-fab-item-text-padding-y: $kendo-fab-item-text-padding-x !default;
+/// Width of the FAB item text border.
+/// @group floating-action-button
+$kendo-fab-item-text-border-width: 1px !default;
+/// Border radius of the FAB item text.
+/// @group floating-action-button
+$kendo-fab-item-text-border-radius: 2px !default;
+/// Font size of the FAB item text.
+/// @group floating-action-button
+$kendo-fab-item-text-font-size: $font-size-xs !default;
+/// Line height of the FAB item text.
+/// @group floating-action-button
+$kendo-fab-item-text-line-height: 1.2 !default;
+
+/// FAB item icon horizontal padding.
+/// @group floating-action-button
+$kendo-fab-item-icon-padding-x: map-get( $spacing, 2 ) !default;
+/// FAB item icon vertical padding.
+/// @group floating-action-button
+$kendo-fab-item-icon-padding-y: $kendo-fab-item-icon-padding-x !default;
+/// Width of the FAB item icon border.
+/// @group floating-action-button
+$kendo-fab-item-icon-border-width: 0 !default;
+/// Border radius of the FAB item icon.
+/// @group floating-action-button
+$kendo-fab-item-icon-border-radius: 50% !default;
+/// Width of the FAB item icon.
+/// @group floating-action-button
+$kendo-fab-item-icon-width: 20px !default;
+/// Height of the FAB item icon.
+/// @group floating-action-button
+$kendo-fab-item-icon-height: $kendo-fab-item-icon-width !default;
+
+/// Theme colors map for the FAB.
+/// @group floating-action-button
+$kendo-fab-theme-colors: $theme-colors !default;
+
+/// The base shadow of the FAB.
+/// @group floating-action-button
+$kendo-fab-shadow: 0 6px 10px rgba(0, 0, 0, .14), 0 1px 18px rgba(0, 0, 0, .12), 0 3px 5px rgba(0, 0, 0, .2) !default;
+/// The disabled shadow of the FAB.
+/// @group floating-action-button
+$kendo-fab-disabled-shadow: 0 6px 10px try-tint( rgba(0, 0, 0, .14), .5 ), 0 1px 18px try-tint( rgba(0, 0, 0, .12), .5 ), 0 3px 5px try-tint( rgba(0, 0, 0, .2), .5 ) !default;
+/// The active shadow of the FAB.
+/// @group floating-action-button
+$kendo-fab-active-shadow: null !default;
+
+/// The base text color of the FAB item.
+/// @group floating-action-button
+$kendo-fab-item-text: $component-text !default;
+/// The base background color of the FAB item.
+/// @group floating-action-button
+$kendo-fab-item-bg: $component-bg !default;
+/// The base border color of the FAB item.
+/// @group floating-action-button
+$kendo-fab-item-border: $component-border !default;
+
+/// The base text color of the FAB item icon.
+/// @group floating-action-button
+$kendo-fab-item-icon-text: $kendo-button-text !default;
+/// The base background color of the FAB item icon.
+/// @group floating-action-button
+$kendo-fab-item-icon-bg: $kendo-button-bg !default;
+/// The base border color of the FAB item icon.
+/// @group floating-action-button
+$kendo-fab-item-icon-border: $kendo-button-border !default;
+
+/// The base shadow of the FAB item.
+/// @group floating-action-button
+$kendo-fab-item-shadow: $kendo-fab-shadow !default;
+/// The disabled shadow of the FAB item.
+/// @group floating-action-button
+$kendo-fab-item-disabled-shadow: $kendo-fab-disabled-shadow !default;
+/// The active shadow of the FAB item.
+/// @group floating-action-button
+$kendo-fab-item-active-shadow: $kendo-fab-active-shadow !default;

package/scss/filter/_index.scss

@@ -6,7 +6,7 @@
 @import "../button/_index.scss";
 @import "../input/_index.scss";
 @import "../checkbox/_index.scss";
-@import "../datetime/_index.scss";
+@import "../datetimepicker/_index.scss";
 @import "../dropdownlist/_index.scss";
 @import "../numerictextbox/_index.scss";
 @import "../toolbar/_index.scss";

package/scss/forms/_index.scss

@@ -7,7 +7,7 @@
 @import "../button/_variables.scss";
 @import "../input/_variables.scss";
 @import "../toolbar/_index.scss";
-@import "../action-buttons/_variables.scss";
+@import "../action-buttons/_index.scss";
 @import "../window/_variables.scss";
 
 

package/scss/gantt/_index.scss

@@ -6,7 +6,7 @@
 @import "../button/_index.scss";
 @import "../input/_index.scss";
 @import "../validator/_index.scss";
-@import "../datetime/_index.scss";
+@import "../datetimepicker/_index.scss";
 @import "../numerictextbox/_index.scss";
 @import "../window/_index.scss";
 @import "../splitter/_index.scss";

package/scss/grid/_index.scss

@@ -14,7 +14,7 @@
 @import "../radio/_index.scss";
 @import "../validator/_index.scss";
 @import "../autocomplete/_index.scss";
-@import "../datetime/_index.scss";
+@import "../datetimepicker/_index.scss";
 @import "../dropdownlist/_index.scss";
 @import "../numerictextbox/_index.scss";
 @import "../menu/_index.scss";
@@ -23,6 +23,7 @@
 @import "../skeleton/_index.scss";
 @import "../utils/_float.scss";
 @import "../utils/_spacer.scss";
+@import "../list/_index.scss";
 
 
 // Component

package/scss/grid/_variables.scss

@@ -109,7 +109,7 @@ $grid-sorting-index-spacing-y: ($icon-spacing / 2) !default;
 $grid-sorting-index-spacing-x: -$grid-sorting-index-spacing-y !default;
 
 
-$grid-focused-shadow: $list-item-focused-shadow !default;
+$grid-focused-shadow: $kendo-list-item-focus-shadow !default;
 
 $grid-edit-cell-padding-x: $grid-cell-padding-x !default;
 $grid-edit-cell-padding-y: 3px !default;
@@ -135,21 +135,21 @@ $grid-sticky-selected-alt-bg: $grid-selected-alt-bg !default;
 $grid-sticky-hovered-bg: $grid-hovered-bg !default;
 $grid-sticky-selected-hovered-bg: $grid-selected-hovered-bg !default;
 
-$grid-filter-menu-width: 230px !default;
+$grid-column-menu-width: 230px !default;
 
 $grid-filter-menu-check-all-border-bottom-width: 1px !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;
 
-$grid-column-menu-popup-padding-x: 0 !default;
-$grid-column-menu-popup-padding-y: $padding-y-sm !default;
+$grid-column-menu-popup-padding-x: null !default;
+$grid-column-menu-popup-padding-y: null !default;
 
-$grid-column-menu-item-padding-x: $padding-x !default;
-$grid-column-menu-item-padding-y: $padding-y !default;
+$grid-column-menu-item-padding-x: $kendo-menu-popup-item-padding-x-md !default;
+$grid-column-menu-item-padding-y: $kendo-menu-popup-item-padding-y-md !default;
 
-$grid-column-menu-list-item-padding-x: $padding-x !default;
-$grid-column-menu-list-item-padding-y: $padding-y-sm !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;
 
 $grid-column-menu-items-wrap-padding-x: 0 !default;
 $grid-column-menu-items-wrap-padding-y: $padding-y-lg !default;
@@ -157,8 +157,8 @@ $grid-column-menu-items-wrap-padding-y: $padding-y-lg !default;
 $grid-column-menu-filter-container-padding-x: $padding-x !default;
 $grid-column-menu-filter-container-padding-y: $padding-y !default;
 
-$grid-column-menu-group-header-padding-x: $menu-popup-item-padding-x !default;
-$grid-column-menu-group-header-padding-y: $menu-popup-item-padding-y !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;
 
 $grid-column-menu-group-header-font-size: $font-size-sm !default;
 $grid-column-menu-group-header-line-height: $line-height !default;

package/scss/imageeditor/_variables.scss

@@ -13,6 +13,7 @@ $imageeditor-content-border-width: 1px !default;
 
 $imageeditor-action-pane-padding-y: map-get( $spacing, 8 ) !default;
 $imageeditor-action-pane-padding-x: map-get( $spacing, 4 ) !default;
+$imageeditor-action-pane-width: if( $imageeditor-content-border-width == null, 240px, calc(240px + #{$imageeditor-content-border-width}) );
 
 $imageeditor-crop-border-width: 1px !default;
 $imageeditor-crop-border-style: dashed !default;

package/scss/index.scss

@@ -15,12 +15,13 @@
 
 
 // Primitive components
-// @import "list/_index.scss";
+@import "list/_index.scss";
 @import "listgroup/_index.scss";
 @import "overlay/_index.scss";
 @import "popup/_index.scss";
 @import "ripple/_index.scss";
-// @import "table/_index.scss";
+@import "table/_index.scss";
+@import "virtual-scroller/_index.scss";
 
 
 // Indicators
@@ -53,6 +54,7 @@
 
 // Form requirements
 @import "calendar/_index.scss";
+@import "timeselector/_index.scss";
 
 
 // Augmented forms
@@ -68,7 +70,6 @@
 @import "timepicker/_index.scss";
 @import "datetimepicker/_index.scss";
 @import "daterangepicker/_index.scss";
-@import "datetime/_index.scss";
 @import "dropdowngrid/_index.scss";
 @import "dropdownlist/_index.scss";
 @import "dropdowntree/_index.scss";

package/scss/input/_index.scss

@@ -3,7 +3,7 @@
 
 // Dependencies
 @import "../common/_index.scss";
-@import "../button/_variables.scss";
+@import "../button/_index.scss";
 
 
 // Component