@progress/kendo-theme-default 11.2.1-dev.0 → 11.3.0-dev.0

package/scss/badge/_variables.scss

@@ -6,9 +6,6 @@
 /// @group badge
 $kendo-badge-border-width: 1px !default;
 
-/// The horizontal padding of the Badge.
-/// @group badge
-$kendo-badge-padding-x: k-spacing(1) !default;
 /// The horizontal padding of the small Badge.
 /// @group badge
 $kendo-badge-sm-padding-x: k-spacing(0.5) !default;
@@ -19,9 +16,6 @@ $kendo-badge-md-padding-x: k-spacing(1) !default;
 /// @group badge
 $kendo-badge-lg-padding-x: k-spacing(1.5) !default;
 
-/// The vertical padding of the Badge.
-/// @group badge
-$kendo-badge-padding-y: k-spacing(1) !default;
 /// The vertical padding of the small Badge.
 /// @group badge
 $kendo-badge-sm-padding-y: k-spacing(0.5) !default;
@@ -60,7 +54,7 @@ $kendo-badge-lg-line-height: $kendo-badge-line-height !default;
 
 /// The calculated minimum width of the circular Badge.
 /// @group badge
-$kendo-badge-min-width: calc( #{$kendo-badge-line-height * 1em} + calc( #{$kendo-badge-padding-y} * 2 ) + calc( #{$kendo-badge-border-width} * 2 )) !default;
+$kendo-badge-min-width: calc( #{$kendo-badge-line-height * 1em} + calc( #{$kendo-badge-md-padding-y} * 2 ) + calc( #{$kendo-badge-border-width} * 2 )) !default;
 /// The calculated minimum width of the small circular Badge.
 /// @group badge
 $kendo-badge-sm-min-width: calc( #{$kendo-badge-sm-line-height * 1em} + calc( #{$kendo-badge-sm-padding-y} * 2 ) + calc( #{$kendo-badge-border-width} * 2 ) ) !default;
@@ -112,11 +106,9 @@ $kendo-badge-theme-colors: (
 
 @forward "@progress/kendo-theme-core/scss/components/badge/_variables.scss" with (
     $kendo-badge-border-width: $kendo-badge-border-width,
-    $kendo-badge-padding-x: $kendo-badge-padding-x,
     $kendo-badge-sm-padding-x: $kendo-badge-sm-padding-x,
     $kendo-badge-md-padding-x: $kendo-badge-md-padding-x,
     $kendo-badge-lg-padding-x: $kendo-badge-lg-padding-x,
-    $kendo-badge-padding-y: $kendo-badge-padding-y,
     $kendo-badge-sm-padding-y: $kendo-badge-sm-padding-y,
     $kendo-badge-md-padding-y: $kendo-badge-md-padding-y,
     $kendo-badge-lg-padding-y: $kendo-badge-lg-padding-y,

package/scss/breadcrumb/_variables.scss

@@ -64,28 +64,22 @@ $kendo-breadcrumb-border: k-color(border) !default;
 /// @group breadcrumb
 $kendo-breadcrumb-focus-shadow: 0 0 2px 1px rgba(0, 0, 0, .06) !default;
 
-/// The horizontal padding of the Breadcrumb link.
-/// @group breadcrumb
-$kendo-breadcrumb-link-padding-x: k-spacing(2) !default;
 /// The horizontal padding of the small Breadcrumb link.
 /// @group breadcrumb
 $kendo-breadcrumb-sm-link-padding-x: k-spacing(2) !default;
 /// The horizontal padding of the medium Breadcrumb link.
 /// @group breadcrumb
-$kendo-breadcrumb-md-link-padding-x: $kendo-breadcrumb-link-padding-x !default;
+$kendo-breadcrumb-md-link-padding-x: k-spacing(2) !default;
 /// The horizontal padding of the large Breadcrumb link.
 /// @group breadcrumb
 $kendo-breadcrumb-lg-link-padding-x: k-spacing(2) !default;
 
-/// The vertical padding of the Breadcrumb link.
-/// @group breadcrumb
-$kendo-breadcrumb-link-padding-y: k-spacing(1.5) !default;
 /// The vertical padding of the small Breadcrumb link.
 /// @group breadcrumb
 $kendo-breadcrumb-sm-link-padding-y: k-spacing(1) !default;
 /// The vertical padding of the medium Breadcrumb link.
 /// @group breadcrumb
-$kendo-breadcrumb-md-link-padding-y: $kendo-breadcrumb-link-padding-y !default;
+$kendo-breadcrumb-md-link-padding-y: k-spacing(1.5) !default;
 /// The vertical padding of the large Breadcrumb link.
 /// @group breadcrumb
 $kendo-breadcrumb-lg-link-padding-y: k-spacing(2) !default;
@@ -94,28 +88,22 @@ $kendo-breadcrumb-lg-link-padding-y: k-spacing(2) !default;
 /// @group breadcrumb
 $kendo-breadcrumb-link-border-radius: k-border-radius(md) !default;
 
-/// The vertical padding of the Breadcrumb link icon.
-/// @group breadcrumb
-$kendo-breadcrumb-icon-link-padding-y: k-spacing(2) !default;
 /// The vertical padding of the small Breadcrumb link icon.
 /// @group breadcrumb
 $kendo-breadcrumb-sm-icon-link-padding-y: k-spacing(1.5) !default;
 /// The vertical padding of the medium Breadcrumb link icon.
 /// @group breadcrumb
-$kendo-breadcrumb-md-icon-link-padding-y: $kendo-breadcrumb-icon-link-padding-y !default;
+$kendo-breadcrumb-md-icon-link-padding-y: k-spacing(2) !default;
 /// The vertical padding of the large Breadcrumb link icon.
 /// @group breadcrumb
 $kendo-breadcrumb-lg-icon-link-padding-y: k-spacing(3) !default;
 
-/// The horizontal padding of the Breadcrumb link icon.
-/// @group breadcrumb
-$kendo-breadcrumb-icon-link-padding-x: $kendo-breadcrumb-icon-link-padding-y !default;
 /// The horizontal padding of the small Breadcrumb link icon.
 /// @group breadcrumb
 $kendo-breadcrumb-sm-icon-link-padding-x: $kendo-breadcrumb-sm-icon-link-padding-y !default;
 /// The horizontal padding of the medium Breadcrumb link icon.
 /// @group breadcrumb
-$kendo-breadcrumb-md-icon-link-padding-x: $kendo-breadcrumb-icon-link-padding-x !default;
+$kendo-breadcrumb-md-icon-link-padding-x: $kendo-breadcrumb-md-icon-link-padding-y !default;
 /// The horizontal padding of the large Breadcrumb link icon.
 /// @group breadcrumb
 $kendo-breadcrumb-lg-icon-link-padding-x: $kendo-breadcrumb-lg-icon-link-padding-y !default;
@@ -251,20 +239,16 @@ $kendo-breadcrumb-sizes: (
     $kendo-breadcrumb-text: $kendo-breadcrumb-text,
     $kendo-breadcrumb-border: $kendo-breadcrumb-border,
     $kendo-breadcrumb-focus-shadow: $kendo-breadcrumb-focus-shadow,
-    $kendo-breadcrumb-link-padding-x: $kendo-breadcrumb-link-padding-x,
     $kendo-breadcrumb-sm-link-padding-x: $kendo-breadcrumb-sm-link-padding-x,
     $kendo-breadcrumb-md-link-padding-x: $kendo-breadcrumb-md-link-padding-x,
     $kendo-breadcrumb-lg-link-padding-x: $kendo-breadcrumb-lg-link-padding-x,
-    $kendo-breadcrumb-link-padding-y: $kendo-breadcrumb-link-padding-y,
     $kendo-breadcrumb-sm-link-padding-y: $kendo-breadcrumb-sm-link-padding-y,
     $kendo-breadcrumb-md-link-padding-y: $kendo-breadcrumb-md-link-padding-y,
     $kendo-breadcrumb-lg-link-padding-y: $kendo-breadcrumb-lg-link-padding-y,
     $kendo-breadcrumb-link-border-radius: $kendo-breadcrumb-link-border-radius,
-    $kendo-breadcrumb-icon-link-padding-y: $kendo-breadcrumb-icon-link-padding-y,
     $kendo-breadcrumb-sm-icon-link-padding-y: $kendo-breadcrumb-sm-icon-link-padding-y,
     $kendo-breadcrumb-md-icon-link-padding-y: $kendo-breadcrumb-md-icon-link-padding-y,
     $kendo-breadcrumb-lg-icon-link-padding-y: $kendo-breadcrumb-lg-icon-link-padding-y,
-    $kendo-breadcrumb-icon-link-padding-x: $kendo-breadcrumb-icon-link-padding-x,
     $kendo-breadcrumb-sm-icon-link-padding-x: $kendo-breadcrumb-sm-icon-link-padding-x,
     $kendo-breadcrumb-md-icon-link-padding-x: $kendo-breadcrumb-md-icon-link-padding-x,
     $kendo-breadcrumb-lg-icon-link-padding-x: $kendo-breadcrumb-lg-icon-link-padding-x,

package/scss/button/_variables.scss

@@ -12,28 +12,22 @@ $kendo-button-border-width: 1px !default;
 /// @group button
 $kendo-button-border-radius: null !default;
 
-/// The horizontal padding of the Button.
-/// @group button
-$kendo-button-padding-x: k-spacing(2) !default;
 /// The horizontal padding of the small Button.
 /// @group button
 $kendo-button-sm-padding-x: k-spacing(2) !default;
 /// The horizontal padding of the medium Button.
 /// @group button
-$kendo-button-md-padding-x: $kendo-button-padding-x !default;
+$kendo-button-md-padding-x: k-spacing(2) !default;
 /// The horizontal padding of the large Button.
 /// @group button
 $kendo-button-lg-padding-x: k-spacing(2) !default;
 
-/// The vertical padding of the Button.
-/// @group button
-$kendo-button-padding-y: k-spacing(1) !default;
 /// The vertical padding of the small Button.
 /// @group button
 $kendo-button-sm-padding-y: k-spacing(0.5) !default;
 /// The vertical padding of the medium Button.
 /// @group button
-$kendo-button-md-padding-y: $kendo-button-padding-y !default;
+$kendo-button-md-padding-y: k-spacing(1) !default;
 /// The vertical padding of the large Button.
 /// @group button
 $kendo-button-lg-padding-y: k-spacing(2) !default;
@@ -73,14 +67,13 @@ $kendo-button-lg-line-height: var( --kendo-line-height-lg, normal ) !default;
 
 /// The calculated height of the Button.
 /// @group button
-$kendo-button-calc-size: calc( ( #{$kendo-button-line-height} * 1em ) + ( #{$kendo-button-padding-y} * 2 ) + ( #{$kendo-button-border-width} * 2 ) ) !default;
 $kendo-button-sm-calc-size: calc( ( #{$kendo-button-sm-line-height} * 1em ) + ( #{$kendo-button-sm-padding-y} * 2 ) + ( #{$kendo-button-border-width} * 2 ) ) !default;
 $kendo-button-md-calc-size: calc( ( #{$kendo-button-md-line-height} * 1em ) + ( #{$kendo-button-md-padding-y} * 2 ) + ( #{$kendo-button-border-width} * 2 ) ) !default;
 $kendo-button-lg-calc-size: calc( ( #{$kendo-button-lg-line-height} * 1em ) + ( #{$kendo-button-lg-padding-y} * 2 ) + ( #{$kendo-button-border-width} * 2 ) ) !default;
 
 /// The calculated inner height of the Button excluding the border width.
 /// @group button
-$kendo-button-inner-calc-size: calc( ( #{$kendo-button-line-height} * 1em ) + ( #{$kendo-button-padding-y} * 2 ) ) !default;
+$kendo-button-inner-calc-size: calc( ( #{$kendo-button-line-height} * 1em ) + ( #{$kendo-button-md-padding-y} * 2 ) ) !default;
 $kendo-button-sm-inner-calc-size: calc( ( #{$kendo-button-sm-line-height} * 1em ) + ( #{$kendo-button-sm-padding-y} * 2 ) ) !default;
 $kendo-button-md-inner-calc-size: calc( ( #{$kendo-button-md-line-height} * 1em ) + ( #{$kendo-button-md-padding-y} * 2 ) ) !default;
 $kendo-button-lg-inner-calc-size: calc( ( #{$kendo-button-lg-line-height} * 1em ) + ( #{$kendo-button-lg-padding-y} * 2 ) ) !default;
@@ -267,11 +260,9 @@ $kendo-button-transition: color .2s ease-in-out !default;
 @forward "@progress/kendo-theme-core/scss/components/button/_variables.scss" with (
     $kendo-button-border-width: $kendo-button-border-width,
     $kendo-button-border-radius: $kendo-button-border-radius,
-    $kendo-button-padding-x: $kendo-button-padding-x,
     $kendo-button-sm-padding-x: $kendo-button-sm-padding-x,
     $kendo-button-md-padding-x: $kendo-button-md-padding-x,
     $kendo-button-lg-padding-x: $kendo-button-lg-padding-x,
-    $kendo-button-padding-y: $kendo-button-padding-y,
     $kendo-button-sm-padding-y: $kendo-button-sm-padding-y,
     $kendo-button-md-padding-y: $kendo-button-md-padding-y,
     $kendo-button-lg-padding-y: $kendo-button-lg-padding-y,
@@ -285,7 +276,6 @@ $kendo-button-transition: color .2s ease-in-out !default;
     $kendo-button-sm-line-height: $kendo-button-sm-line-height,
     $kendo-button-md-line-height: $kendo-button-md-line-height,
     $kendo-button-lg-line-height: $kendo-button-lg-line-height,
-    $kendo-button-calc-size: $kendo-button-calc-size,
     $kendo-button-sm-calc-size: $kendo-button-sm-calc-size,
     $kendo-button-md-calc-size: $kendo-button-md-calc-size,
     $kendo-button-lg-calc-size: $kendo-button-lg-calc-size,

package/scss/chat/_variables.scss

@@ -211,6 +211,13 @@ $kendo-chat-quick-reply-shadow-spread: 2px !default;
 /// @group chat
 $kendo-chat-quick-reply-shadow-opacity: .3 !default;
 
+/// The size of the Chat typing indicator dot.
+/// @group chat
+$kendo-chat-typing-indicator-dot-size: 8px !default;
+/// The spacing of the Chat typing indicator dot.
+/// @group chat
+$kendo-chat-typing-indicator-dot-spacing: 5px !default;
+
 @forward "@progress/kendo-theme-core/scss/components/chat/_variables.scss" with (
     $kendo-chat-padding-x: $kendo-chat-padding-x,
     $kendo-chat-padding-y: $kendo-chat-padding-y,
@@ -274,5 +281,7 @@ $kendo-chat-quick-reply-shadow-opacity: .3 !default;
     $kendo-chat-quick-reply-hover-border: $kendo-chat-quick-reply-hover-border,
     $kendo-chat-quick-reply-shadow-blur: $kendo-chat-quick-reply-shadow-blur,
     $kendo-chat-quick-reply-shadow-spread: $kendo-chat-quick-reply-shadow-spread,
-    $kendo-chat-quick-reply-shadow-opacity: $kendo-chat-quick-reply-shadow-opacity
+    $kendo-chat-quick-reply-shadow-opacity: $kendo-chat-quick-reply-shadow-opacity,
+    $kendo-chat-typing-indicator-dot-size: $kendo-chat-typing-indicator-dot-size,
+    $kendo-chat-typing-indicator-dot-spacing: $kendo-chat-typing-indicator-dot-spacing
 );

package/scss/chip/_variables.scss

@@ -13,28 +13,22 @@ $kendo-chip-border-width: 1px !default;
 /// @group chip
 $kendo-chip-spacing: k-spacing(1) !default;
 
-/// The horizontal padding of the Chip.
-/// @group chip
-$kendo-chip-padding-x: k-spacing(1) !default;
 /// The horizontal padding of the small Chip.
 /// @group chip
 $kendo-chip-sm-padding-x: k-spacing(1) !default;
 /// The horizontal padding of the medium Chip.
 /// @group chip
-$kendo-chip-md-padding-x: $kendo-chip-padding-x !default;
+$kendo-chip-md-padding-x: k-spacing(1) !default;
 /// The horizontal padding of the large Chip.
 /// @group chip
 $kendo-chip-lg-padding-x: k-spacing(1) !default;
 
-/// The vertical padding of the Chip.
-/// @group chip
-$kendo-chip-padding-y: k-spacing(1) !default;
 /// The vertical padding of the small Chip.
 /// @group chip
 $kendo-chip-sm-padding-y: k-spacing(0.5) !default;
 /// The vertical padding of the medium Chip.
 /// @group chip
-$kendo-chip-md-padding-y: $kendo-chip-padding-y !default;
+$kendo-chip-md-padding-y: k-spacing(1) !default;
 /// The vertical padding of the large Chip.
 /// @group chip
 $kendo-chip-lg-padding-y: k-spacing(1.5) !default;
@@ -71,7 +65,7 @@ $kendo-chip-lg-line-height: $kendo-chip-line-height !default;
 
 /// The calculated height of the Chip.
 /// @group chip
-$kendo-chip-calc-size: calc( #{$kendo-chip-line-height} * 1em + calc( #{$kendo-chip-padding-y} * 2 ) + #{$kendo-chip-border-width} * 2 ) !default;
+$kendo-chip-calc-size: calc( #{$kendo-chip-line-height} * 1em + calc( #{$kendo-chip-md-padding-y} * 2 ) + #{$kendo-chip-border-width} * 2 ) !default;
 $kendo-chip-sm-calc-size: calc( #{$kendo-chip-sm-line-height} * 1em + calc( #{$kendo-chip-sm-padding-y} * 2 ) + #{$kendo-chip-border-width} * 2 ) !default;
 
 /// The map with the sizes of the Chip.
@@ -187,11 +181,9 @@ $kendo-chip-list-sizes: (
 @forward "@progress/kendo-theme-core/scss/components/chip/_variables.scss" with (
     $kendo-chip-border-width: $kendo-chip-border-width,
     $kendo-chip-spacing: $kendo-chip-spacing,
-    $kendo-chip-padding-x: $kendo-chip-padding-x,
     $kendo-chip-sm-padding-x: $kendo-chip-sm-padding-x,
     $kendo-chip-md-padding-x: $kendo-chip-md-padding-x,
     $kendo-chip-lg-padding-x: $kendo-chip-lg-padding-x,
-    $kendo-chip-padding-y: $kendo-chip-padding-y,
     $kendo-chip-sm-padding-y: $kendo-chip-sm-padding-y,
     $kendo-chip-md-padding-y: $kendo-chip-md-padding-y,
     $kendo-chip-lg-padding-y: $kendo-chip-lg-padding-y,

package/scss/coloreditor/_variables.scss

@@ -51,27 +51,21 @@ $kendo-color-editor-focus-border: null !default;
 /// @group color-editor
 $kendo-color-editor-focus-shadow: null  !default; // 1px 1px 7px 1px rgba(0, 0, 0, .3)
 
-/// The vertical padding of the ColorEditor header.
-/// @group color-editor
-$kendo-color-editor-header-padding-y: $kendo-color-editor-spacer !default;
-/// The horizontal padding of the ColorEditor header.
-/// @group color-editor
-$kendo-color-editor-header-padding-x: $kendo-color-editor-header-padding-y !default;
 /// The spacing between the ColorEditor header actions.
 /// @group color-editor
 $kendo-color-editor-header-actions-gap: k-spacing(2) !default;
 /// The vertical padding of the small ColorEditor header.
 /// @group color-editor
-$kendo-color-editor-sm-header-padding-y: $kendo-color-editor-header-padding-y !default;
+$kendo-color-editor-sm-header-padding-y: k-spacing(3) !default;
 /// The horizontal padding of the small ColorEditor header.
 /// @group color-editor
-$kendo-color-editor-sm-header-padding-x: $kendo-color-editor-header-padding-x !default;
+$kendo-color-editor-sm-header-padding-x: k-spacing(3) !default;
 /// The vertical padding of the medium ColorEditor header.
 /// @group color-editor
-$kendo-color-editor-md-header-padding-y: $kendo-color-editor-header-padding-y !default;
+$kendo-color-editor-md-header-padding-y: k-spacing(3) !default;
 /// The horizontal padding of the medium ColorEditor header.
 /// @group color-editor
-$kendo-color-editor-md-header-padding-x: $kendo-color-editor-header-padding-x !default;
+$kendo-color-editor-md-header-padding-x: k-spacing(3) !default;
 /// The vertical padding of the large ColorEditor header.
 /// @group color-editor
 $kendo-color-editor-lg-header-padding-y: k-spacing(4.5) !default;
@@ -117,12 +111,6 @@ $kendo-color-editor-lg-color-preview-width: 44px !default;
 /// @group color-editor
 $kendo-color-editor-lg-color-preview-height: 16px !default;
 
-/// The vertical padding of the ColorEditor views container.
-/// @group color-editor
-$kendo-color-editor-views-padding-y: $kendo-color-editor-spacer !default;
-/// The horizontal padding of the ColorEditor views container.
-/// @group color-editor
-$kendo-color-editor-views-padding-x: $kendo-color-editor-views-padding-y !default;
 /// The spacing of the ColorEditor views container.
 /// @group color-editor
 $kendo-color-editor-views-gap: $kendo-color-editor-spacer !default;
@@ -131,13 +119,13 @@ $kendo-color-editor-views-gap: $kendo-color-editor-spacer !default;
 $kendo-color-editor-sm-views-padding-y: $kendo-color-editor-spacer !default;
 /// The horizontal padding of the small ColorEditor views container.
 /// @group color-editor
-$kendo-color-editor-sm-views-padding-x: $kendo-color-editor-views-padding-y !default;
+$kendo-color-editor-sm-views-padding-x: k-spacing(3) !default;
 /// The vertical padding of the medium ColorEditor views container.
 /// @group color-editor
-$kendo-color-editor-md-views-padding-y: $kendo-color-editor-views-padding-y !default;
+$kendo-color-editor-md-views-padding-y: k-spacing(3) !default;
 /// The horizontal padding of the medium ColorEditor views container.
 /// @group color-editor
-$kendo-color-editor-md-views-padding-x: $kendo-color-editor-views-padding-x !default;
+$kendo-color-editor-md-views-padding-x: k-spacing(3) !default;
 /// The vertical padding of the large ColorEditor views container.
 /// @group color-editor
 $kendo-color-editor-lg-views-padding-y: k-spacing(4.5) !default;
@@ -207,8 +195,6 @@ $kendo-color-editor-sizes: (
     $kendo-color-editor-border: $kendo-color-editor-border,
     $kendo-color-editor-focus-border: $kendo-color-editor-focus-border,
     $kendo-color-editor-focus-shadow: $kendo-color-editor-focus-shadow,
-    $kendo-color-editor-header-padding-y: $kendo-color-editor-header-padding-y,
-    $kendo-color-editor-header-padding-x: $kendo-color-editor-header-padding-x,
     $kendo-color-editor-header-actions-gap: $kendo-color-editor-header-actions-gap,
     $kendo-color-editor-sm-header-padding-y: $kendo-color-editor-sm-header-padding-y,
     $kendo-color-editor-sm-header-padding-x: $kendo-color-editor-sm-header-padding-x,
@@ -228,8 +214,6 @@ $kendo-color-editor-sizes: (
     $kendo-color-editor-md-color-preview-height: $kendo-color-editor-md-color-preview-height,
     $kendo-color-editor-lg-color-preview-width: $kendo-color-editor-lg-color-preview-width,
     $kendo-color-editor-lg-color-preview-height: $kendo-color-editor-lg-color-preview-height,
-    $kendo-color-editor-views-padding-y: $kendo-color-editor-views-padding-y,
-    $kendo-color-editor-views-padding-x: $kendo-color-editor-views-padding-x,
     $kendo-color-editor-views-gap: $kendo-color-editor-views-gap,
     $kendo-color-editor-sm-views-padding-y: $kendo-color-editor-sm-views-padding-y,
     $kendo-color-editor-sm-views-padding-x: $kendo-color-editor-sm-views-padding-x,

package/scss/colorgradient/_variables.scss

@@ -16,12 +16,6 @@ $kendo-color-gradient-border-width: 1px !default;
 /// The border radius of the ColorGradient.
 /// @group color-gradient
 $kendo-color-gradient-border-radius: k-border-radius(md) !default;
-/// The vertical padding of the ColorGradient.
-/// @group color-gradient
-$kendo-color-gradient-padding-y: $kendo-color-gradient-spacer !default;
-/// The horizontal padding of the ColorGradient.
-/// @group color-gradient
-$kendo-color-gradient-padding-x: $kendo-color-gradient-padding-y !default;
 /// The spacing between the sections of the ColorGradient.
 /// @group color-gradient
 $kendo-color-gradient-gap: $kendo-color-gradient-spacer !default;
@@ -49,13 +43,13 @@ $kendo-color-gradient-border: k-color(border) !default;
 $kendo-color-gradient-sm-padding-y: $kendo-color-gradient-spacer !default;
 /// The horizontal padding of the small ColorGradient.
 /// @group color-gradient
-$kendo-color-gradient-sm-padding-x: $kendo-color-gradient-padding-y !default;
+$kendo-color-gradient-sm-padding-x: k-spacing(3) !default;
 /// The vertical padding of the medium ColorGradient.
 /// @group color-gradient
 $kendo-color-gradient-md-padding-y: $kendo-color-gradient-spacer !default;
 /// The horizontal padding of the medium ColorGradient.
 /// @group color-gradient
-$kendo-color-gradient-md-padding-x: $kendo-color-gradient-padding-y !default;
+$kendo-color-gradient-md-padding-x: k-spacing(3) !default;
 /// The vertical padding of the large ColorGradient.
 /// @group color-gradient
 $kendo-color-gradient-lg-padding-y: k-spacing(4.5) !default;
@@ -260,8 +254,6 @@ $kendo-color-gradient-sizes: (
     $kendo-color-gradient-width: $kendo-color-gradient-width,
     $kendo-color-gradient-border-width: $kendo-color-gradient-border-width,
     $kendo-color-gradient-border-radius: $kendo-color-gradient-border-radius,
-    $kendo-color-gradient-padding-y: $kendo-color-gradient-padding-y,
-    $kendo-color-gradient-padding-x: $kendo-color-gradient-padding-x,
     $kendo-color-gradient-gap: $kendo-color-gradient-gap,
     $kendo-color-gradient-font-family: $kendo-color-gradient-font-family,
     $kendo-color-gradient-font-size: $kendo-color-gradient-font-size,

package/scss/column-menu/_variables.scss

@@ -1,15 +1,12 @@
 @use "../core/_index.scss" as *;
 
-$kendo-column-menu-item-padding-x: k-spacing(2) !default;
-$kendo-column-menu-item-padding-y: k-spacing(1) !default;
-
-$kendo-column-menu-item-sm-padding-x: $kendo-column-menu-item-padding-x !default;
+$kendo-column-menu-item-sm-padding-x: k-spacing(2) !default;
 $kendo-column-menu-item-sm-padding-y: k-spacing(0.5) !default;
 
-$kendo-column-menu-item-md-padding-x: $kendo-column-menu-item-padding-x !default;
-$kendo-column-menu-item-md-padding-y: $kendo-column-menu-item-padding-y !default;
+$kendo-column-menu-item-md-padding-x: k-spacing(2) !default;
+$kendo-column-menu-item-md-padding-y: k-spacing(1) !default;
 
-$kendo-column-menu-item-lg-padding-x: $kendo-column-menu-item-padding-x !default;
+$kendo-column-menu-item-lg-padding-x: k-spacing(2) !default;
 $kendo-column-menu-item-lg-padding-y: k-spacing(1.5) !default;
 
 $kendo-column-menu-font-size: var( --kendo-font-size, inherit ) !default;
@@ -62,8 +59,6 @@ $kendo-group-menu-item-border: k-color(border) !default;
     $kendo-column-menu-md-line-height: $kendo-column-menu-md-line-height,
     $kendo-column-menu-lg-line-height: $kendo-column-menu-lg-line-height,
     $kendo-column-menu-font-family: $kendo-column-menu-font-family,
-    $kendo-column-menu-item-padding-x: $kendo-column-menu-item-padding-x,
-    $kendo-column-menu-item-padding-y: $kendo-column-menu-item-padding-y,
     $kendo-column-menu-item-sm-padding-x: $kendo-column-menu-item-sm-padding-x,
     $kendo-column-menu-item-sm-padding-y: $kendo-column-menu-item-sm-padding-y,
     $kendo-column-menu-item-md-padding-x: $kendo-column-menu-item-md-padding-x,

package/scss/fab/_variables.scss

@@ -17,31 +17,28 @@ $kendo-fab-font-size: var( --kendo-font-size, inherit ) !default;
 /// @group floating-action-button
 $kendo-fab-line-height: var( --kendo-line-height, normal ) !default;
 
-/// The horizontal padding of the FAB.
-/// @group floating-action-button
-$kendo-fab-padding-x: k-spacing(4) !default;
 /// The horizontal padding of the small FAB.
 /// @group floating-action-button
-$kendo-fab-sm-padding-x: calc( #{$kendo-fab-padding-x} / 2 ) !default;
+$kendo-fab-sm-padding-x: calc( #{k-spacing(4)} / 2 ) !default;
 /// The horizontal padding of the medium FAB.
 /// @group floating-action-button
-$kendo-fab-md-padding-x: $kendo-fab-padding-x !default;
+$kendo-fab-md-padding-x: k-spacing(4) !default;
 /// The horizontal padding of the large FAB.
 /// @group floating-action-button
-$kendo-fab-lg-padding-x: calc( #{$kendo-fab-padding-x} * 1.5 ) !default;
+$kendo-fab-lg-padding-x: calc( #{k-spacing(4)} * 1.5 ) !default;
 
 /// The vertical padding of the FAB.
 /// @group floating-action-button
-$kendo-fab-padding-y: $kendo-fab-padding-x !default;
+$kendo-fab-padding-y: k-spacing(4) !default;
 /// The vertical padding of the small FAB.
 /// @group floating-action-button
-$kendo-fab-sm-padding-y: calc( #{$kendo-fab-padding-y} / 2 ) !default;
+$kendo-fab-sm-padding-y: calc( #{k-spacing(4)} / 2 ) !default;
 /// The vertical padding of the medium FAB.
 /// @group floating-action-button
-$kendo-fab-md-padding-y: $kendo-fab-padding-y !default;
+$kendo-fab-md-padding-y: k-spacing(4) !default;
 /// The vertical padding of the large FAB.
 /// @group floating-action-button
-$kendo-fab-lg-padding-y: calc( #{$kendo-fab-padding-y} * 1.5 ) !default;
+$kendo-fab-lg-padding-y: calc( #{k-spacing(4)} * 1.5 ) !default;
 
 /// The horizontal padding of the FAB icon.
 /// @group floating-action-button
@@ -188,11 +185,9 @@ $kendo-fab-generating-opacity: 40% !default;
     $kendo-fab-font-family: $kendo-fab-font-family,
     $kendo-fab-font-size: $kendo-fab-font-size,
     $kendo-fab-line-height: $kendo-fab-line-height,
-    $kendo-fab-padding-x: $kendo-fab-padding-x,
     $kendo-fab-sm-padding-x: $kendo-fab-sm-padding-x,
     $kendo-fab-md-padding-x: $kendo-fab-md-padding-x,
     $kendo-fab-lg-padding-x: $kendo-fab-lg-padding-x,
-    $kendo-fab-padding-y: $kendo-fab-padding-y,
     $kendo-fab-sm-padding-y: $kendo-fab-sm-padding-y,
     $kendo-fab-md-padding-y: $kendo-fab-md-padding-y,
     $kendo-fab-lg-padding-y: $kendo-fab-lg-padding-y,

package/scss/floating-label/_variables.scss

@@ -19,10 +19,10 @@ $kendo-floating-label-line-height: $kendo-input-line-height !default;
 $kendo-floating-label-height: calc( #{$kendo-floating-label-line-height} * #{$kendo-floating-label-font-size} ) !default;
 /// The horizontal offset of the Floating Label.
 /// @group floating-label
-$kendo-floating-label-offset-x: calc( #{$kendo-input-padding-x} + #{$kendo-input-border-width} ) !default;
+$kendo-floating-label-offset-x: calc( #{$kendo-input-md-padding-x} + #{$kendo-input-border-width} ) !default;
 /// The vertical offset of the Floating Label.
 /// @group floating-label
-$kendo-floating-label-offset-y: calc( #{$kendo-floating-label-height} + #{$kendo-input-border-width} + #{$kendo-input-padding-y} ) !default;
+$kendo-floating-label-offset-y: calc( #{$kendo-floating-label-height} + #{$kendo-input-border-width} + #{$kendo-input-md-padding-y} ) !default;
 
 /// The transformation scale of the focused Floating Label.
 /// @group floating-label

package/scss/forms/_index.scss

@@ -18,7 +18,6 @@
         @include kendo-form--layout();
         @include kendo-form--theme();
         @include kendo-utils--layout--display();
-        @include kendo-utils--flex-grid--gap();
         @include kendo-utils--flex-grid--grid-template-columns();
         @include kendo-utils--flex-grid--grid-column-start-end();
     }

package/scss/grid/_variables.scss

@@ -267,8 +267,8 @@ $kendo-grid-filter-menu-item-spacing-y: $kendo-grid-filter-menu-item-spacing-x !
 $kendo-grid-column-menu-popup-padding-x: null !default;
 $kendo-grid-column-menu-popup-padding-y: null !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;
+$kendo-grid-column-menu-item-padding-x: $kendo-menu-popup-md-item-padding-x !default;
+$kendo-grid-column-menu-item-padding-y: $kendo-menu-popup-md-item-padding-y !default;
 
 $kendo-grid-column-menu-list-item-padding-x: $kendo-list-md-item-padding-x !default;
 $kendo-grid-column-menu-list-item-padding-y: $kendo-list-md-item-padding-y !default;

package/scss/input/_variables.scss

@@ -16,28 +16,22 @@ $kendo-input-border-height: ( $kendo-input-border-width * 2 ) !default;
 /// @group input
 $kendo-input-border-radius: null !default;
 
-/// The horizontal padding of the Input components.
-/// @group input
-$kendo-input-padding-x: k-spacing(2) !default;
 /// The horizontal padding of the small Input components.
 /// @group input
 $kendo-input-sm-padding-x: k-spacing(2) !default;
 /// The horizontal padding of the medium Input components.
 /// @group input
-$kendo-input-md-padding-x: $kendo-input-padding-x !default;
+$kendo-input-md-padding-x: k-spacing(2) !default;
 /// The horizontal padding of the large Input components.
 /// @group input
 $kendo-input-lg-padding-x: k-spacing(2) !default;
 
-/// The vertical padding of the Input components.
-/// @group input
-$kendo-input-padding-y: k-spacing(1) !default;
 /// The vertical padding of the small Input components.
 /// @group input
 $kendo-input-sm-padding-y: k-spacing(0.5) !default;
 /// The vertical padding of the medium Input components.
 /// @group input
-$kendo-input-md-padding-y: $kendo-input-padding-y !default;
+$kendo-input-md-padding-y: k-spacing(1) !default;
 /// The vertical padding of the large Input components.
 /// @group input
 $kendo-input-lg-padding-y: k-spacing(2) !default;
@@ -74,7 +68,6 @@ $kendo-input-lg-line-height: var( --kendo-line-height-lg, normal ) !default;
 
 /// The calculated height of the Input.
 /// @group input
-$kendo-input-calc-size: calc( ( #{$kendo-input-line-height} * 1em ) + ( #{$kendo-input-padding-y} * 2 ) + ( #{$kendo-input-border-width * 2} ) ) !default;
 $kendo-input-sm-calc-size: calc( ( #{$kendo-input-sm-line-height} * 1em ) + ( #{$kendo-input-sm-padding-y} * 2 ) + ( #{$kendo-input-border-width * 2} ) ) !default;
 $kendo-input-md-calc-size: calc( ( #{$kendo-input-md-line-height} * 1em ) + ( #{$kendo-input-md-padding-y} * 2 ) + ( #{$kendo-input-border-width * 2} ) ) !default;
 $kendo-input-lg-calc-size: calc( ( #{$kendo-input-lg-line-height} * 1em ) + ( #{$kendo-input-lg-padding-y} * 2 ) + ( #{$kendo-input-border-width * 2} ) ) !default;
@@ -269,9 +262,15 @@ $kendo-input-separator-text: $kendo-input-border !default;
 /// The text color of the Input prefix.
 /// @group input
 $kendo-input-prefix-text: k-color(subtle) !default;
+/// The background color of the Input prefix.
+/// @group input
+$kendo-input-prefix-bg: null !default;
 /// The text color of the Input suffix.
 /// @group input
 $kendo-input-suffix-text: k-color(subtle) !default;
+/// The background color of the Input suffix.
+/// @group input
+$kendo-input-suffix-bg: null !default;
 
 /// The border color of the invalid Input components.
 /// @group input
@@ -439,11 +438,9 @@ $kendo-use-input-spinner-icon-offset: false !default;
     $kendo-input-border-width: $kendo-input-border-width,
     $kendo-input-border-height: $kendo-input-border-height,
     $kendo-input-border-radius: $kendo-input-border-radius,
-    $kendo-input-padding-x: $kendo-input-padding-x,
     $kendo-input-sm-padding-x: $kendo-input-sm-padding-x,
     $kendo-input-md-padding-x: $kendo-input-md-padding-x,
     $kendo-input-lg-padding-x: $kendo-input-lg-padding-x,
-    $kendo-input-padding-y: $kendo-input-padding-y,
     $kendo-input-sm-padding-y: $kendo-input-sm-padding-y,
     $kendo-input-md-padding-y: $kendo-input-md-padding-y,
     $kendo-input-lg-padding-y: $kendo-input-lg-padding-y,
@@ -456,7 +453,6 @@ $kendo-use-input-spinner-icon-offset: false !default;
     $kendo-input-sm-line-height: $kendo-input-sm-line-height,
     $kendo-input-md-line-height: $kendo-input-md-line-height,
     $kendo-input-lg-line-height: $kendo-input-lg-line-height,
-    $kendo-input-calc-size: $kendo-input-calc-size,
     $kendo-input-sm-calc-size: $kendo-input-sm-calc-size,
     $kendo-input-md-calc-size: $kendo-input-md-calc-size,
     $kendo-input-lg-calc-size: $kendo-input-lg-calc-size,
@@ -510,7 +506,9 @@ $kendo-use-input-spinner-icon-offset: false !default;
     $kendo-input-spinner-icon-offset: $kendo-input-spinner-icon-offset,
     $kendo-input-separator-text: $kendo-input-separator-text,
     $kendo-input-prefix-text: $kendo-input-prefix-text,
+    $kendo-input-prefix-bg: $kendo-input-prefix-bg,
     $kendo-input-suffix-text: $kendo-input-suffix-text,
+    $kendo-input-suffix-bg: $kendo-input-suffix-bg,
     $kendo-input-invalid-border: $kendo-input-invalid-border,
     $kendo-input-invalid-shadow: $kendo-input-invalid-shadow,
     $kendo-picker-bg: $kendo-picker-bg,