@progress/kendo-theme-material 14.5.1-dev.3 → 14.5.1-dev.5

package/scss/menu/_variables.scss

@@ -9,6 +9,11 @@
 
 // Menu
 
+/// The default size of the Menu.
+/// @group menu
+/// @role default
+$kendo-menu-default-size: "md" !default;
+
 /// The default size of the Menu group.
 /// @group menu
 /// @role default
@@ -27,6 +32,20 @@ $kendo-menu-font-size: var(--kendo-font-size-lg) !default;
 /// @group menu
 $kendo-menu-line-height: var(--kendo-line-height-lg) !default;
 
+/// The font size of the small Menu.
+/// @group menu
+$kendo-menu-sm-font-size: var(--kendo-font-size-lg) !default;
+/// The font size of the large Menu.
+/// @group menu
+$kendo-menu-lg-font-size: var(--kendo-font-size-lg) !default;
+
+/// The line height of the small Menu.
+/// @group menu
+$kendo-menu-sm-line-height: var(--kendo-line-height-lg) !default;
+/// The line height of the large Menu.
+/// @group menu
+$kendo-menu-lg-line-height: var(--kendo-line-height-lg) !default;
+
 /// The background color of the Menu.
 /// @group menu
 $kendo-menu-bg: transparent !default;
@@ -54,6 +73,33 @@ $kendo-menu-item-spacing: 0 !default;
 /// The spacing between the Menu item text and icons.
 /// @group menu
 $kendo-menu-item-icon-spacing: k-spacing(3) !default;
+/// The border radius of the Menu item.
+/// @group menu
+$kendo-menu-item-border-radius: k-border-radius(xl) !default;
+
+/// The font size of the Menu item description.
+/// @group menu
+$kendo-menu-item-description-font-size: $kendo-list-item-description-font-size !default;
+/// The line height of the Menu item description.
+/// @group menu
+$kendo-menu-item-description-line-height: $kendo-list-item-description-line-height !default;
+/// The text color of the Menu item description.
+/// @group menu
+$kendo-menu-item-description-text: $kendo-list-item-description-text !default;
+
+/// The horizontal padding of the small Menu item.
+/// @group menu
+$kendo-menu-sm-item-padding-x: k-spacing(3) !default;
+/// The horizontal padding of the large Menu item.
+/// @group menu
+$kendo-menu-lg-item-padding-x: k-spacing(3) !default;
+
+/// The vertical padding of the small Menu item.
+/// @group menu
+$kendo-menu-sm-item-padding-y: k-spacing(2) !default;
+/// The vertical padding of the large Menu item.
+/// @group menu
+$kendo-menu-lg-item-padding-y: k-spacing(4) !default;
 
 /// The font weight of the selected Menu item.
 /// @group menu
@@ -157,7 +203,7 @@ $kendo-menu-expand-arrow-spacing: k-spacing(2) !default;
 
 /// The inline margin of the horizontal Menu separator.
 /// @group menu
-$kendo-menu-separator-margin-inline: k-spacing(1) !default;
+$kendo-menu-separator-margin-inline: k-spacing(2) !default;
 /// The block margin of the horizontal Menu separator.
 /// @group menu
 $kendo-menu-separator-margin-block: k-spacing(1) !default;
@@ -170,16 +216,20 @@ $kendo-menu-separator-border: k-color(border) !default;
 
 /// The horizontal padding of the Menu popup.
 /// @group menu
-$kendo-menu-popup-padding-x: null !default;
+$kendo-menu-popup-padding-x: k-spacing(1) !default;
 
 /// The vertical padding of the Menu popup.
 /// @group menu
-$kendo-menu-popup-padding-y: null !default;
+$kendo-menu-popup-padding-y: k-spacing(1) !default;
 
 /// The width of the border around the Menu popup.
 /// @group menu
 $kendo-menu-popup-border-width: $kendo-popup-border-width !default;
 
+/// The border radius of the Menu popup.
+/// @group menu
+$kendo-menu-popup-border-radius: k-border-radius(xl) !default;
+
 /// The font size of the small Menu popup.
 /// @group menu
 $kendo-menu-popup-sm-font-size: var(--kendo-font-size) !default;
@@ -228,13 +278,13 @@ $kendo-menu-popup-lg-item-padding-x: $kendo-menu-item-padding-x !default;
 
 /// The vertical padding of the small Menu popup item.
 /// @group menu
-$kendo-menu-popup-sm-item-padding-y: k-spacing(2) !default;
+$kendo-menu-popup-sm-item-padding-y: $kendo-list-sm-item-padding-y !default;
 /// The vertical padding of the medium Menu popup item.
 /// @group menu
-$kendo-menu-popup-md-item-padding-y: $kendo-menu-item-padding-y !default;
+$kendo-menu-popup-md-item-padding-y: $kendo-list-md-item-padding-y !default;
 /// The vertical padding of the large Menu popup item.
 /// @group menu
-$kendo-menu-popup-lg-item-padding-y: k-spacing(4) !default;
+$kendo-menu-popup-lg-item-padding-y: $kendo-list-lg-item-padding-y !default;
 
 /// The end padding of the small Menu popup item.
 /// @group menu
@@ -268,7 +318,58 @@ $kendo-menu-popup-lg-item-icon-margin-end: calc( -1 * (#{$kendo-menu-popup-lg-it
 
 /// The spacing between the Menu items in popup.
 /// @group menu
-$kendo-menu-popup-item-spacing: k-spacing(0) !default;
+$kendo-menu-popup-item-spacing: k-spacing(0.5) !default;
+
+/// The horizontal padding of the small Menu popup group header.
+/// @group menu
+$kendo-menu-popup-sm-group-header-padding-x: $kendo-list-sm-group-item-padding-x !default;
+/// The horizontal padding of the medium Menu popup group header.
+/// @group menu
+$kendo-menu-popup-md-group-header-padding-x: $kendo-list-md-group-item-padding-x !default;
+/// The horizontal padding of the large Menu popup group header.
+/// @group menu
+$kendo-menu-popup-lg-group-header-padding-x: $kendo-list-lg-group-item-padding-x !default;
+
+/// The vertical padding of the small Menu popup group header.
+/// @group menu
+$kendo-menu-popup-sm-group-header-padding-y: $kendo-list-sm-group-item-padding-y !default;
+/// The vertical padding of the medium Menu popup group header.
+/// @group menu
+$kendo-menu-popup-md-group-header-padding-y: $kendo-list-md-group-item-padding-y !default;
+/// The vertical padding of the large Menu popup group header.
+/// @group menu
+$kendo-menu-popup-lg-group-header-padding-y: $kendo-list-lg-group-item-padding-y !default;
+
+/// The font size of the small Menu popup group header.
+/// @group menu
+$kendo-menu-popup-sm-group-header-font-size: $kendo-list-item-group-label-sm-font-size !default;
+/// The font size of the medium Menu popup group header.
+/// @group menu
+$kendo-menu-popup-md-group-header-font-size: $kendo-list-item-group-label-md-font-size !default;
+/// The font size of the large Menu popup group header.
+/// @group menu
+$kendo-menu-popup-lg-group-header-font-size: $kendo-list-item-group-label-lg-font-size !default;
+
+/// The line height of the small Menu popup group header.
+/// @group menu
+$kendo-menu-popup-sm-group-header-line-height: $kendo-menu-popup-sm-line-height !default;
+/// The line height of the medium Menu popup group header.
+/// @group menu
+$kendo-menu-popup-md-group-header-line-height: $kendo-menu-popup-md-line-height !default;
+/// The line height of the large Menu popup group header.
+/// @group menu
+$kendo-menu-popup-lg-group-header-line-height: $kendo-menu-popup-lg-line-height !default;
+
+/// The font weight of the Menu popup group header.
+/// @group menu
+$kendo-menu-popup-group-header-font-weight: $kendo-list-group-item-font-weight !default;
+
+/// The background color of the Menu popup group header.
+/// @group menu
+$kendo-menu-popup-group-header-bg: $kendo-list-group-item-bg !default;
+/// The text color of the Menu popup group header.
+/// @group menu
+$kendo-menu-popup-group-header-text: $kendo-list-group-item-text !default;
 
 /// The background color of the Menu item in popup.
 /// @group menu
@@ -298,10 +399,10 @@ $kendo-menu-popup-item-hover-gradient: null !default;
 
 /// The background color of active Menu item in popup.
 /// @group menu
-$kendo-menu-popup-item-active-bg: $kendo-menu-item-active-bg !default;
+$kendo-menu-popup-item-active-bg: k-color(primary-subtle) !default;
 /// The text color of active Menu item in popup.
 /// @group menu
-$kendo-menu-popup-item-active-text: inherit !default;
+$kendo-menu-popup-item-active-text: k-color(base-on-subtle) !default;
 /// The border color of active Menu item in popup.
 /// @group menu
 $kendo-menu-popup-item-active-border: null !default;
@@ -314,19 +415,32 @@ $kendo-menu-popup-item-active-gradient: null !default;
 $kendo-menu-popup-item-focus-shadow: null !default;
 
 @forward "@progress/kendo-theme-core/scss/components/menu/_variables.scss" with (
+    $kendo-menu-default-size: $kendo-menu-default-size,
     $kendo-menu-group-default-size: $kendo-menu-group-default-size,
     $kendo-menu-border-width: $kendo-menu-border-width,
     $kendo-menu-font-family: $kendo-menu-font-family,
     $kendo-menu-font-size: $kendo-menu-font-size,
     $kendo-menu-line-height: $kendo-menu-line-height,
+    $kendo-menu-sm-font-size: $kendo-menu-sm-font-size,
+    $kendo-menu-lg-font-size: $kendo-menu-lg-font-size,
+    $kendo-menu-sm-line-height: $kendo-menu-sm-line-height,
+    $kendo-menu-lg-line-height: $kendo-menu-lg-line-height,
     $kendo-menu-bg: $kendo-menu-bg,
     $kendo-menu-text: $kendo-menu-text,
     $kendo-menu-border: $kendo-menu-border,
     $kendo-menu-gradient: $kendo-menu-gradient,
     $kendo-menu-item-padding-x: $kendo-menu-item-padding-x,
     $kendo-menu-item-padding-y: $kendo-menu-item-padding-y,
+    $kendo-menu-sm-item-padding-x: $kendo-menu-sm-item-padding-x,
+    $kendo-menu-lg-item-padding-x: $kendo-menu-lg-item-padding-x,
+    $kendo-menu-sm-item-padding-y: $kendo-menu-sm-item-padding-y,
+    $kendo-menu-lg-item-padding-y: $kendo-menu-lg-item-padding-y,
     $kendo-menu-item-spacing: $kendo-menu-item-spacing,
     $kendo-menu-item-icon-spacing: $kendo-menu-item-icon-spacing,
+    $kendo-menu-item-border-radius: $kendo-menu-item-border-radius,
+    $kendo-menu-item-description-font-size: $kendo-menu-item-description-font-size,
+    $kendo-menu-item-description-line-height: $kendo-menu-item-description-line-height,
+    $kendo-menu-item-description-text: $kendo-menu-item-description-text,
     $kendo-menu-item-selected-font-weight: $kendo-menu-item-selected-font-weight,
     $kendo-menu-item-bg: $kendo-menu-item-bg,
     $kendo-menu-item-text: $kendo-menu-item-text,
@@ -362,6 +476,7 @@ $kendo-menu-popup-item-focus-shadow: null !default;
     $kendo-menu-popup-padding-x: $kendo-menu-popup-padding-x,
     $kendo-menu-popup-padding-y: $kendo-menu-popup-padding-y,
     $kendo-menu-popup-border-width: $kendo-menu-popup-border-width,
+    $kendo-menu-popup-border-radius: $kendo-menu-popup-border-radius,
     $kendo-menu-popup-sm-font-size: $kendo-menu-popup-sm-font-size,
     $kendo-menu-popup-md-font-size: $kendo-menu-popup-md-font-size,
     $kendo-menu-popup-lg-font-size: $kendo-menu-popup-lg-font-size,
@@ -388,6 +503,21 @@ $kendo-menu-popup-item-focus-shadow: null !default;
     $kendo-menu-popup-md-item-icon-margin-end: $kendo-menu-popup-md-item-icon-margin-end,
     $kendo-menu-popup-lg-item-icon-margin-end: $kendo-menu-popup-lg-item-icon-margin-end,
     $kendo-menu-popup-item-spacing: $kendo-menu-popup-item-spacing,
+    $kendo-menu-popup-sm-group-header-padding-x: $kendo-menu-popup-sm-group-header-padding-x,
+    $kendo-menu-popup-md-group-header-padding-x: $kendo-menu-popup-md-group-header-padding-x,
+    $kendo-menu-popup-lg-group-header-padding-x: $kendo-menu-popup-lg-group-header-padding-x,
+    $kendo-menu-popup-sm-group-header-padding-y: $kendo-menu-popup-sm-group-header-padding-y,
+    $kendo-menu-popup-md-group-header-padding-y: $kendo-menu-popup-md-group-header-padding-y,
+    $kendo-menu-popup-lg-group-header-padding-y: $kendo-menu-popup-lg-group-header-padding-y,
+    $kendo-menu-popup-sm-group-header-font-size: $kendo-menu-popup-sm-group-header-font-size,
+    $kendo-menu-popup-md-group-header-font-size: $kendo-menu-popup-md-group-header-font-size,
+    $kendo-menu-popup-lg-group-header-font-size: $kendo-menu-popup-lg-group-header-font-size,
+    $kendo-menu-popup-sm-group-header-line-height: $kendo-menu-popup-sm-group-header-line-height,
+    $kendo-menu-popup-md-group-header-line-height: $kendo-menu-popup-md-group-header-line-height,
+    $kendo-menu-popup-lg-group-header-line-height: $kendo-menu-popup-lg-group-header-line-height,
+    $kendo-menu-popup-group-header-font-weight: $kendo-menu-popup-group-header-font-weight,
+    $kendo-menu-popup-group-header-bg: $kendo-menu-popup-group-header-bg,
+    $kendo-menu-popup-group-header-text: $kendo-menu-popup-group-header-text,
     $kendo-menu-popup-item-bg: $kendo-menu-popup-item-bg,
     $kendo-menu-popup-item-text: $kendo-menu-popup-item-text,
     $kendo-menu-popup-item-border: $kendo-menu-popup-item-border,

package/scss/scheduler/_variables.scss

@@ -158,16 +158,19 @@ $kendo-scheduler-event-ongoing-shadow: inset 0px 0px 0px 1px #ff0000 !default;
 $kendo-scheduler-resizer-size: 0.5em !default;
 /// The length of the Scheduler resize handle visual indicator.
 /// @group scheduler
-$kendo-scheduler-resize-handle-size: 8px !default;
+$kendo-scheduler-resize-handle-size: 12px !default;
+/// The thickness of the Scheduler resize handle visual indicator.
+/// @group scheduler
+$kendo-scheduler-resize-handle-thickness: 1px !default;
 /// The border radius of the Scheduler resize handle.
 /// @group scheduler
 $kendo-scheduler-resize-handle-border-radius: k-border-radius(full) !default;
 /// The border width of the Scheduler resize handle.
 /// @group scheduler
-$kendo-scheduler-resize-handle-border-width: 2px !default;
+$kendo-scheduler-resize-handle-border-width: 0 !default;
 /// The background color of the Scheduler resize handle.
 /// @group scheduler
-$kendo-scheduler-resize-handle-bg: $kendo-scheduler-event-bg !default;
+$kendo-scheduler-resize-handle-bg: k-color(primary-subtle) !default;
 
 /// The horizontal padding of the Scheduler cell.
 /// @group scheduler
@@ -350,6 +353,7 @@ $kendo-scheduler-recurrence-fields-row-gap: k-spacing(6) !default;
     $kendo-scheduler-event-ongoing-shadow: $kendo-scheduler-event-ongoing-shadow,
     $kendo-scheduler-resizer-size: $kendo-scheduler-resizer-size,
     $kendo-scheduler-resize-handle-size: $kendo-scheduler-resize-handle-size,
+    $kendo-scheduler-resize-handle-thickness: $kendo-scheduler-resize-handle-thickness,
     $kendo-scheduler-resize-handle-border-radius: $kendo-scheduler-resize-handle-border-radius,
     $kendo-scheduler-resize-handle-border-width: $kendo-scheduler-resize-handle-border-width,
     $kendo-scheduler-resize-handle-bg: $kendo-scheduler-resize-handle-bg,

package/scss/segmented-control/_variables.scss

@@ -7,6 +7,10 @@
 /// @group segmented-control
 /// @role default
 $kendo-segmented-control-default-size: "md" !default;
+/// The default roundness of the Segmented Control.
+/// @group segmented-control
+/// @role default
+$kendo-segmented-control-default-roundness: "full" !default;
 
 /// The horizontal padding of the Segmented Control.
 /// @group segmented-control
@@ -109,6 +113,7 @@ $kendo-segmented-control-button-focus-indicator: inset 0 0 0 2px color-mix(in sr
 
 @forward "@progress/kendo-theme-core/scss/components/segmented-control/_variables.scss" with (
     $kendo-segmented-control-default-size: $kendo-segmented-control-default-size,
+    $kendo-segmented-control-default-roundness: $kendo-segmented-control-default-roundness,
     $kendo-segmented-control-padding-x: $kendo-segmented-control-padding-x,
     $kendo-segmented-control-padding-y: $kendo-segmented-control-padding-y,
     $kendo-segmented-control-border-radius: $kendo-segmented-control-border-radius,

package/scss/toolbar/_variables.scss

@@ -154,10 +154,6 @@ $kendo-toolbar-overflow-button-padding-y: $kendo-menu-popup-md-item-padding-y !d
 /// @group toolbar
 $kendo-toolbar-overflow-button-padding-x: $kendo-menu-popup-md-item-padding-x !default;
 
-/// The border radius of the floating Toolbar.
-/// @group toolbar
-$kendo-floating-toolbar-border-radius: k-border-radius(xxl) !default;
-
 @forward "@progress/kendo-theme-core/scss/components/toolbar/_variables.scss" with (
     $kendo-toolbar-default-fill-mode: $kendo-toolbar-default-fill-mode,
     $kendo-toolbar-default-size: $kendo-toolbar-default-size,
@@ -201,6 +197,5 @@ $kendo-floating-toolbar-border-radius: k-border-radius(xxl) !default;
     $kendo-toolbar-overflow-container-font-size: $kendo-toolbar-overflow-container-font-size,
     $kendo-toolbar-overflow-container-line-height: $kendo-toolbar-overflow-container-line-height,
     $kendo-toolbar-overflow-button-padding-y: $kendo-toolbar-overflow-button-padding-y,
-    $kendo-toolbar-overflow-button-padding-x: $kendo-toolbar-overflow-button-padding-x,
-    $kendo-floating-toolbar-border-radius: $kendo-floating-toolbar-border-radius
+    $kendo-toolbar-overflow-button-padding-x: $kendo-toolbar-overflow-button-padding-x
 );