diff --git a/packages/bootstrap/docs/customization-button.md b/packages/bootstrap/docs/customization-button.md index 62e8fb07f90..a89756c99e7 100644 --- a/packages/bootstrap/docs/customization-button.md +++ b/packages/bootstrap/docs/customization-button.md @@ -633,7 +633,7 @@ The following table lists the available variables for customization. $kendo-button-transition List $kendo-transition - color 0.2s ease-in-out, background-color 0.2s ease-in-out, border-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out + color var(--kendo-global-duration, var(--kendo-motion-short-4, 0.2s)) var(--kendo-motion-ease-in-out, ease-in-out), background-color var(--kendo-global-duration, var(--kendo-motion-short-4, 0.2s)) var(--kendo-motion-ease-in-out, ease-in-out), border-color var(--kendo-global-duration, var(--kendo-motion-short-4, 0.2s)) var(--kendo-motion-ease-in-out, ease-in-out), box-shadow var(--kendo-global-duration, var(--kendo-motion-short-4, 0.2s)) var(--kendo-motion-ease-in-out, ease-in-out)
Description
The color transition of the Button.
diff --git a/packages/bootstrap/docs/customization-common.md b/packages/bootstrap/docs/customization-common.md index 2e28984c549..572b00c2de2 100644 --- a/packages/bootstrap/docs/customization-common.md +++ b/packages/bootstrap/docs/customization-common.md @@ -167,6 +167,36 @@ The following table lists the available variables for customization.
Description
The font size of the large Chip.
+ + $kendo-transition-duration + String + var(--kendo-global-duration, var(--kendo-motion-short-4, .2s)) + var(--kendo-global-duration, var(--kendo-motion-short-4, 0.2s)) + + +
Description
Transition duration used across all components.
+ + + + $kendo-transition-easing + String + var(--kendo-motion-ease-in-out, ease-in-out) + var(--kendo-motion-ease-in-out, ease-in-out) + + +
Description
Transition timing function used across all components.
+ + + + $kendo-transition + List + color $kendo-transition-duration $kendo-transition-easing, background-color $kendo-transition-duration $kendo-transition-easing, border-color $kendo-transition-duration $kendo-transition-easing, box-shadow $kendo-transition-duration $kendo-transition-easing + color var(--kendo-global-duration, var(--kendo-motion-short-4, 0.2s)) var(--kendo-motion-ease-in-out, ease-in-out), background-color var(--kendo-global-duration, var(--kendo-motion-short-4, 0.2s)) var(--kendo-motion-ease-in-out, ease-in-out), border-color var(--kendo-global-duration, var(--kendo-motion-short-4, 0.2s)) var(--kendo-motion-ease-in-out, ease-in-out), box-shadow var(--kendo-global-duration, var(--kendo-motion-short-4, 0.2s)) var(--kendo-motion-ease-in-out, ease-in-out) + + +
Description
Transition used across all components.
+ + diff --git a/packages/bootstrap/docs/customization-floating-label.md b/packages/bootstrap/docs/customization-floating-label.md index 33554121114..f4934cc5960 100644 --- a/packages/bootstrap/docs/customization-floating-label.md +++ b/packages/bootstrap/docs/customization-floating-label.md @@ -130,8 +130,8 @@ The following table lists the available variables for customization. $kendo-floating-label-transition List - .2s ease-out - 0.2s ease-out + var(--kendo-motion-short-4, .2s) var(--kendo-motion-ease-out, ease-out) + var(--kendo-motion-short-4, 0.2s) var(--kendo-motion-ease-out, ease-out)
Description
The transition of the Floating Label.
diff --git a/packages/bootstrap/docs/customization-scrollview.md b/packages/bootstrap/docs/customization-scrollview.md index 8b386681d80..9fa32b34da3 100644 --- a/packages/bootstrap/docs/customization-scrollview.md +++ b/packages/bootstrap/docs/customization-scrollview.md @@ -289,9 +289,9 @@ The following table lists the available variables for customization. $kendo-scrollview-transition-duration - Number - .3s - 0.3s + String + var(--kendo-motion-medium-2, .3s) + var(--kendo-motion-medium-2, 0.3s)
Description
The duration of the ScrollView transition.
@@ -300,8 +300,8 @@ The following table lists the available variables for customization. $kendo-scrollview-transition-timing-function String - ease-in-out - ease-in-out + var(--kendo-motion-ease-in-out, ease-in-out) + var(--kendo-motion-ease-in-out, ease-in-out)
Description
The timing function of the ScrollView transition.
diff --git a/packages/bootstrap/docs/customization.md b/packages/bootstrap/docs/customization.md index 076a9e05a8b..0e829ec67dc 100644 --- a/packages/bootstrap/docs/customization.md +++ b/packages/bootstrap/docs/customization.md @@ -171,6 +171,36 @@ The following table lists the available variables for customizing the Bootstrap
Description
The font size of the large Chip.
+ + $kendo-transition-duration + String + var(--kendo-global-duration, var(--kendo-motion-short-4, .2s)) + var(--kendo-global-duration, var(--kendo-motion-short-4, 0.2s)) + + +
Description
Transition duration used across all components.
+ + + + $kendo-transition-easing + String + var(--kendo-motion-ease-in-out, ease-in-out) + var(--kendo-motion-ease-in-out, ease-in-out) + + +
Description
Transition timing function used across all components.
+ + + + $kendo-transition + List + color $kendo-transition-duration $kendo-transition-easing, background-color $kendo-transition-duration $kendo-transition-easing, border-color $kendo-transition-duration $kendo-transition-easing, box-shadow $kendo-transition-duration $kendo-transition-easing + color var(--kendo-global-duration, var(--kendo-motion-short-4, 0.2s)) var(--kendo-motion-ease-in-out, ease-in-out), background-color var(--kendo-global-duration, var(--kendo-motion-short-4, 0.2s)) var(--kendo-motion-ease-in-out, ease-in-out), border-color var(--kendo-global-duration, var(--kendo-motion-short-4, 0.2s)) var(--kendo-motion-ease-in-out, ease-in-out), box-shadow var(--kendo-global-duration, var(--kendo-motion-short-4, 0.2s)) var(--kendo-motion-ease-in-out, ease-in-out) + + +
Description
Transition used across all components.
+ + @@ -2198,7 +2228,7 @@ The following table lists the available variables for customizing the Bootstrap $kendo-button-transition List $kendo-transition - color 0.2s ease-in-out, background-color 0.2s ease-in-out, border-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out + color var(--kendo-global-duration, var(--kendo-motion-short-4, 0.2s)) var(--kendo-motion-ease-in-out, ease-in-out), background-color var(--kendo-global-duration, var(--kendo-motion-short-4, 0.2s)) var(--kendo-motion-ease-in-out, ease-in-out), border-color var(--kendo-global-duration, var(--kendo-motion-short-4, 0.2s)) var(--kendo-motion-ease-in-out, ease-in-out), box-shadow var(--kendo-global-duration, var(--kendo-motion-short-4, 0.2s)) var(--kendo-motion-ease-in-out, ease-in-out)
Description
The color transition of the Button.
@@ -6553,8 +6583,8 @@ The following table lists the available variables for customizing the Bootstrap $kendo-floating-label-transition List - .2s ease-out - 0.2s ease-out + var(--kendo-motion-short-4, .2s) var(--kendo-motion-ease-out, ease-out) + var(--kendo-motion-short-4, 0.2s) var(--kendo-motion-ease-out, ease-out)
Description
The transition of the Floating Label.
@@ -12474,9 +12504,9 @@ The following table lists the available variables for customizing the Bootstrap $kendo-scrollview-transition-duration - Number - .3s - 0.3s + String + var(--kendo-motion-medium-2, .3s) + var(--kendo-motion-medium-2, 0.3s)
Description
The duration of the ScrollView transition.
@@ -12485,8 +12515,8 @@ The following table lists the available variables for customizing the Bootstrap $kendo-scrollview-transition-timing-function String - ease-in-out - ease-in-out + var(--kendo-motion-ease-in-out, ease-in-out) + var(--kendo-motion-ease-in-out, ease-in-out)
Description
The timing function of the ScrollView transition.
diff --git a/packages/classic/docs/customization-button.md b/packages/classic/docs/customization-button.md index 768d4ea578d..467f3755b55 100644 --- a/packages/classic/docs/customization-button.md +++ b/packages/classic/docs/customization-button.md @@ -632,8 +632,8 @@ The following table lists the available variables for customization. $kendo-button-transition List - color .2s ease-in-out - color 0.2s ease-in-out + k-motion(short-4, ease-in-out, color) + null, color var(--kendo-global-duration, 0.2s) cubic-bezier(0.42, 0, 0.58, 1)
Description
The color transition of the flat Button.
diff --git a/packages/classic/docs/customization-common.md b/packages/classic/docs/customization-common.md index c23218fcad4..676431d1608 100644 --- a/packages/classic/docs/customization-common.md +++ b/packages/classic/docs/customization-common.md @@ -157,6 +157,36 @@ The following table lists the available variables for customization.
Description
The gradient background of selected items.
+ + $kendo-transition-duration + String + var(--kendo-global-duration, var(--kendo-motion-short-4, .2s)) + var(--kendo-global-duration, var(--kendo-motion-short-4, 0.2s)) + + +
Description
Transition duration used across all components.
+ + + + $kendo-transition-easing + String + var(--kendo-motion-ease-in-out, ease-in-out) + var(--kendo-motion-ease-in-out, ease-in-out) + + +
Description
Transition timing function used across all components.
+ + + + $kendo-transition + List + color $kendo-transition-duration $kendo-transition-easing, background-color $kendo-transition-duration $kendo-transition-easing, border-color $kendo-transition-duration $kendo-transition-easing, box-shadow $kendo-transition-duration $kendo-transition-easing + color var(--kendo-global-duration, var(--kendo-motion-short-4, 0.2s)) var(--kendo-motion-ease-in-out, ease-in-out), background-color var(--kendo-global-duration, var(--kendo-motion-short-4, 0.2s)) var(--kendo-motion-ease-in-out, ease-in-out), border-color var(--kendo-global-duration, var(--kendo-motion-short-4, 0.2s)) var(--kendo-motion-ease-in-out, ease-in-out), box-shadow var(--kendo-global-duration, var(--kendo-motion-short-4, 0.2s)) var(--kendo-motion-ease-in-out, ease-in-out) + + +
Description
Transition used across all components.
+ + diff --git a/packages/classic/docs/customization-floating-label.md b/packages/classic/docs/customization-floating-label.md index cea568e185a..70ca7946279 100644 --- a/packages/classic/docs/customization-floating-label.md +++ b/packages/classic/docs/customization-floating-label.md @@ -130,8 +130,8 @@ The following table lists the available variables for customization. $kendo-floating-label-transition List - .2s ease-out - 0.2s ease-out + var(--kendo-motion-short-4, .2s) var(--kendo-motion-ease-out, ease-out) + var(--kendo-motion-short-4, 0.2s) var(--kendo-motion-ease-out, ease-out)
Description
The transition of the Floating Label.
diff --git a/packages/classic/docs/customization-scrollview.md b/packages/classic/docs/customization-scrollview.md index 610dffac68f..837c1d29594 100644 --- a/packages/classic/docs/customization-scrollview.md +++ b/packages/classic/docs/customization-scrollview.md @@ -289,9 +289,9 @@ The following table lists the available variables for customization. $kendo-scrollview-transition-duration - Number - .3s - 0.3s + String + var(--kendo-motion-medium-2, .3s) + var(--kendo-motion-medium-2, 0.3s)
Description
The duration of the ScrollView transition.
@@ -300,8 +300,8 @@ The following table lists the available variables for customization. $kendo-scrollview-transition-timing-function String - ease-in-out - ease-in-out + var(--kendo-motion-ease-in-out, ease-in-out) + var(--kendo-motion-ease-in-out, ease-in-out)
Description
The timing function of the ScrollView transition.
diff --git a/packages/classic/docs/customization.md b/packages/classic/docs/customization.md index 8dc31964f2c..1bb11110e4e 100644 --- a/packages/classic/docs/customization.md +++ b/packages/classic/docs/customization.md @@ -161,6 +161,36 @@ The following table lists the available variables for customizing the Classic th
Description
The gradient background of selected items.
+ + $kendo-transition-duration + String + var(--kendo-global-duration, var(--kendo-motion-short-4, .2s)) + var(--kendo-global-duration, var(--kendo-motion-short-4, 0.2s)) + + +
Description
Transition duration used across all components.
+ + + + $kendo-transition-easing + String + var(--kendo-motion-ease-in-out, ease-in-out) + var(--kendo-motion-ease-in-out, ease-in-out) + + +
Description
Transition timing function used across all components.
+ + + + $kendo-transition + List + color $kendo-transition-duration $kendo-transition-easing, background-color $kendo-transition-duration $kendo-transition-easing, border-color $kendo-transition-duration $kendo-transition-easing, box-shadow $kendo-transition-duration $kendo-transition-easing + color var(--kendo-global-duration, var(--kendo-motion-short-4, 0.2s)) var(--kendo-motion-ease-in-out, ease-in-out), background-color var(--kendo-global-duration, var(--kendo-motion-short-4, 0.2s)) var(--kendo-motion-ease-in-out, ease-in-out), border-color var(--kendo-global-duration, var(--kendo-motion-short-4, 0.2s)) var(--kendo-motion-ease-in-out, ease-in-out), box-shadow var(--kendo-global-duration, var(--kendo-motion-short-4, 0.2s)) var(--kendo-motion-ease-in-out, ease-in-out) + + +
Description
Transition used across all components.
+ + @@ -2187,8 +2217,8 @@ The following table lists the available variables for customizing the Classic th $kendo-button-transition List - color .2s ease-in-out - color 0.2s ease-in-out + k-motion(short-4, ease-in-out, color) + null, color var(--kendo-global-duration, 0.2s) cubic-bezier(0.42, 0, 0.58, 1)
Description
The color transition of the flat Button.
@@ -6523,8 +6553,8 @@ The following table lists the available variables for customizing the Classic th $kendo-floating-label-transition List - .2s ease-out - 0.2s ease-out + var(--kendo-motion-short-4, .2s) var(--kendo-motion-ease-out, ease-out) + var(--kendo-motion-short-4, 0.2s) var(--kendo-motion-ease-out, ease-out)
Description
The transition of the Floating Label.
@@ -12454,9 +12484,9 @@ The following table lists the available variables for customizing the Classic th $kendo-scrollview-transition-duration - Number - .3s - 0.3s + String + var(--kendo-motion-medium-2, .3s) + var(--kendo-motion-medium-2, 0.3s)
Description
The duration of the ScrollView transition.
@@ -12465,8 +12495,8 @@ The following table lists the available variables for customizing the Classic th $kendo-scrollview-transition-timing-function String - ease-in-out - ease-in-out + var(--kendo-motion-ease-in-out, ease-in-out) + var(--kendo-motion-ease-in-out, ease-in-out)
Description
The timing function of the ScrollView transition.
diff --git a/packages/default/docs/customization-button.md b/packages/default/docs/customization-button.md index 3e0359d436c..02351a13cd7 100644 --- a/packages/default/docs/customization-button.md +++ b/packages/default/docs/customization-button.md @@ -632,8 +632,8 @@ The following table lists the available variables for customization. $kendo-button-transition List - color .2s ease-in-out - color 0.2s ease-in-out + k-motion(short-4, ease-in-out, color) + null, color var(--kendo-global-duration, 0.2s) cubic-bezier(0.42, 0, 0.58, 1)
Description
The color transition of the flat Button.
diff --git a/packages/default/docs/customization-common.md b/packages/default/docs/customization-common.md index 8920cff732d..f7647c6febd 100644 --- a/packages/default/docs/customization-common.md +++ b/packages/default/docs/customization-common.md @@ -447,16 +447,6 @@ The following table lists the available variables for customization.
Description
Box shadow of focused items.
- - $kendo-transition - List - color .2s ease-in-out, background-color .2s ease-in-out, border-color .2s ease-in-out, box-shadow .2s ease-in-out - color 0.2s ease-in-out, background-color 0.2s ease-in-out, border-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out - - -
Description
Transition used across all components.
- - $kendo-disabled-text Color @@ -487,6 +477,36 @@ The following table lists the available variables for customization.
Description
Opacity used for disabled items.
+ + $kendo-transition-duration + String + var(--kendo-global-duration, var(--kendo-motion-short-4, .2s)) + var(--kendo-global-duration, var(--kendo-motion-short-4, 0.2s)) + + +
Description
Transition duration used across all components.
+ + + + $kendo-transition-easing + String + var(--kendo-motion-ease-in-out, ease-in-out) + var(--kendo-motion-ease-in-out, ease-in-out) + + +
Description
Transition timing function used across all components.
+ + + + $kendo-transition + List + color $kendo-transition-duration $kendo-transition-easing, background-color $kendo-transition-duration $kendo-transition-easing, border-color $kendo-transition-duration $kendo-transition-easing, box-shadow $kendo-transition-duration $kendo-transition-easing + color var(--kendo-global-duration, var(--kendo-motion-short-4, 0.2s)) var(--kendo-motion-ease-in-out, ease-in-out), background-color var(--kendo-global-duration, var(--kendo-motion-short-4, 0.2s)) var(--kendo-motion-ease-in-out, ease-in-out), border-color var(--kendo-global-duration, var(--kendo-motion-short-4, 0.2s)) var(--kendo-motion-ease-in-out, ease-in-out), box-shadow var(--kendo-global-duration, var(--kendo-motion-short-4, 0.2s)) var(--kendo-motion-ease-in-out, ease-in-out) + + +
Description
Transition used across all components.
+ + diff --git a/packages/default/docs/customization-floating-label.md b/packages/default/docs/customization-floating-label.md index 16248b52181..fe0fbea18ee 100644 --- a/packages/default/docs/customization-floating-label.md +++ b/packages/default/docs/customization-floating-label.md @@ -130,8 +130,8 @@ The following table lists the available variables for customization. $kendo-floating-label-transition List - .2s ease-out - 0.2s ease-out + var(--kendo-motion-short-4, .2s) var(--kendo-motion-ease-out, ease-out) + var(--kendo-motion-short-4, 0.2s) var(--kendo-motion-ease-out, ease-out)
Description
The transition of the Floating Label.
diff --git a/packages/default/docs/customization-scrollview.md b/packages/default/docs/customization-scrollview.md index aecfeb5eb31..aac1f79e641 100644 --- a/packages/default/docs/customization-scrollview.md +++ b/packages/default/docs/customization-scrollview.md @@ -289,9 +289,9 @@ The following table lists the available variables for customization. $kendo-scrollview-transition-duration - Number - .3s - 0.3s + String + var(--kendo-motion-medium-2, .3s) + var(--kendo-motion-medium-2, 0.3s)
Description
The duration of the ScrollView transition.
@@ -300,8 +300,8 @@ The following table lists the available variables for customization. $kendo-scrollview-transition-timing-function String - ease-in-out - ease-in-out + var(--kendo-motion-ease-in-out, ease-in-out) + var(--kendo-motion-ease-in-out, ease-in-out)
Description
The timing function of the ScrollView transition.
diff --git a/packages/default/docs/customization.md b/packages/default/docs/customization.md index 0fd8f1cd6c7..38b49e14bb8 100644 --- a/packages/default/docs/customization.md +++ b/packages/default/docs/customization.md @@ -451,16 +451,6 @@ The following table lists the available variables for customizing the Default th
Description
Box shadow of focused items.
- - $kendo-transition - List - color .2s ease-in-out, background-color .2s ease-in-out, border-color .2s ease-in-out, box-shadow .2s ease-in-out - color 0.2s ease-in-out, background-color 0.2s ease-in-out, border-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out - - -
Description
Transition used across all components.
- - $kendo-disabled-text Color @@ -491,6 +481,36 @@ The following table lists the available variables for customizing the Default th
Description
Opacity used for disabled items.
+ + $kendo-transition-duration + String + var(--kendo-global-duration, var(--kendo-motion-short-4, .2s)) + var(--kendo-global-duration, var(--kendo-motion-short-4, 0.2s)) + + +
Description
Transition duration used across all components.
+ + + + $kendo-transition-easing + String + var(--kendo-motion-ease-in-out, ease-in-out) + var(--kendo-motion-ease-in-out, ease-in-out) + + +
Description
Transition timing function used across all components.
+ + + + $kendo-transition + List + color $kendo-transition-duration $kendo-transition-easing, background-color $kendo-transition-duration $kendo-transition-easing, border-color $kendo-transition-duration $kendo-transition-easing, box-shadow $kendo-transition-duration $kendo-transition-easing + color var(--kendo-global-duration, var(--kendo-motion-short-4, 0.2s)) var(--kendo-motion-ease-in-out, ease-in-out), background-color var(--kendo-global-duration, var(--kendo-motion-short-4, 0.2s)) var(--kendo-motion-ease-in-out, ease-in-out), border-color var(--kendo-global-duration, var(--kendo-motion-short-4, 0.2s)) var(--kendo-motion-ease-in-out, ease-in-out), box-shadow var(--kendo-global-duration, var(--kendo-motion-short-4, 0.2s)) var(--kendo-motion-ease-in-out, ease-in-out) + + +
Description
Transition used across all components.
+ + @@ -2517,8 +2537,8 @@ The following table lists the available variables for customizing the Default th $kendo-button-transition List - color .2s ease-in-out - color 0.2s ease-in-out + k-motion(short-4, ease-in-out, color) + null, color var(--kendo-global-duration, 0.2s) cubic-bezier(0.42, 0, 0.58, 1)
Description
The color transition of the flat Button.
@@ -6913,8 +6933,8 @@ The following table lists the available variables for customizing the Default th $kendo-floating-label-transition List - .2s ease-out - 0.2s ease-out + var(--kendo-motion-short-4, .2s) var(--kendo-motion-ease-out, ease-out) + var(--kendo-motion-short-4, 0.2s) var(--kendo-motion-ease-out, ease-out)
Description
The transition of the Floating Label.
@@ -12824,9 +12844,9 @@ The following table lists the available variables for customizing the Default th $kendo-scrollview-transition-duration - Number - .3s - 0.3s + String + var(--kendo-motion-medium-2, .3s) + var(--kendo-motion-medium-2, 0.3s)
Description
The duration of the ScrollView transition.
@@ -12835,8 +12855,8 @@ The following table lists the available variables for customizing the Default th $kendo-scrollview-transition-timing-function String - ease-in-out - ease-in-out + var(--kendo-motion-ease-in-out, ease-in-out) + var(--kendo-motion-ease-in-out, ease-in-out)
Description
The timing function of the ScrollView transition.
diff --git a/packages/fluent/docs/customization-floating-label.md b/packages/fluent/docs/customization-floating-label.md index e351856e5ef..fbcbb49941a 100644 --- a/packages/fluent/docs/customization-floating-label.md +++ b/packages/fluent/docs/customization-floating-label.md @@ -140,7 +140,7 @@ The following table lists the available variables for customization. $kendo-floating-label-transition - .2s ease-out + var(--kendo-motion-short-4, .2s) var(--kendo-motion-ease-out, ease-out ) diff --git a/packages/fluent/docs/customization-scrollview.md b/packages/fluent/docs/customization-scrollview.md index 77b86f75e2d..f8fe240f5ae 100644 --- a/packages/fluent/docs/customization-scrollview.md +++ b/packages/fluent/docs/customization-scrollview.md @@ -300,7 +300,7 @@ The following table lists the available variables for customization. $kendo-scrollview-transition-duration - .3s + var(--kendo-motion-medium-2, .3s) @@ -310,7 +310,7 @@ The following table lists the available variables for customization. $kendo-scrollview-transition-timing-function - ease-in-out + var(-kendo-motion-ease-in-out, ease-in-out) diff --git a/packages/fluent/docs/customization-slider.md b/packages/fluent/docs/customization-slider.md index 40a8302331b..f916bcdd640 100644 --- a/packages/fluent/docs/customization-slider.md +++ b/packages/fluent/docs/customization-slider.md @@ -440,7 +440,7 @@ The following table lists the available variables for customization. $kendo-slider-transition-speed - .3s + var(--kendo-motion-medium-2, .3s) @@ -450,7 +450,7 @@ The following table lists the available variables for customization. $kendo-slider-transition-function - ease-out + var(--kendo-motion-ease-out, ease-out) @@ -460,7 +460,7 @@ The following table lists the available variables for customization. $kendo-slider-thumb-transition-speed - .4s + var(--kendo-motion-medium-4, .4s) diff --git a/packages/fluent/docs/customization-stepper.md b/packages/fluent/docs/customization-stepper.md index 6f3db6e51b5..b0222a05d65 100644 --- a/packages/fluent/docs/customization-stepper.md +++ b/packages/fluent/docs/customization-stepper.md @@ -610,7 +610,7 @@ The following table lists the available variables for customization. $kendo-stepper-content-transition-duration - 300ms + var(--kendo-motion-medium-2, 300ms) diff --git a/packages/fluent/docs/customization.md b/packages/fluent/docs/customization.md index 168633e6f02..30967989898 100644 --- a/packages/fluent/docs/customization.md +++ b/packages/fluent/docs/customization.md @@ -11032,7 +11032,7 @@ The following table lists the available variables for customizing the Fluent the $kendo-floating-label-transition - .2s ease-out + var(--kendo-motion-short-4, .2s) var(--kendo-motion-ease-out, ease-out ) @@ -23782,7 +23782,7 @@ The following table lists the available variables for customizing the Fluent the $kendo-scrollview-transition-duration - .3s + var(--kendo-motion-medium-2, .3s) @@ -23792,7 +23792,7 @@ The following table lists the available variables for customizing the Fluent the $kendo-scrollview-transition-timing-function - ease-in-out + var(-kendo-motion-ease-in-out, ease-in-out) @@ -24548,7 +24548,7 @@ The following table lists the available variables for customizing the Fluent the $kendo-slider-transition-speed - .3s + var(--kendo-motion-medium-2, .3s) @@ -24558,7 +24558,7 @@ The following table lists the available variables for customizing the Fluent the $kendo-slider-transition-function - ease-out + var(--kendo-motion-ease-out, ease-out) @@ -24568,7 +24568,7 @@ The following table lists the available variables for customizing the Fluent the $kendo-slider-thumb-transition-speed - .4s + var(--kendo-motion-medium-4, .4s) @@ -26542,7 +26542,7 @@ The following table lists the available variables for customizing the Fluent the $kendo-stepper-content-transition-duration - 300ms + var(--kendo-motion-medium-2, 300ms) diff --git a/packages/material/docs/customization-button.md b/packages/material/docs/customization-button.md index 61c3241977b..6b4fbb2cf79 100644 --- a/packages/material/docs/customization-button.md +++ b/packages/material/docs/customization-button.md @@ -632,8 +632,8 @@ The following table lists the available variables for customization. $kendo-button-transition List - box-shadow 280ms cubic-bezier( .4, 0, .2, 1 ) - box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1) + box-shadow var(--kendo-motion-medium-3, 280ms) cubic-bezier( .4, 0, .2, 1 ) + box-shadow var(--kendo-motion-medium-3, 280ms) cubic-bezier(0.4, 0, 0.2, 1)
Description
The box-shadow transition of the Button.
diff --git a/packages/material/docs/customization-common.md b/packages/material/docs/customization-common.md index 19863cb36e8..7f1bea0f858 100644 --- a/packages/material/docs/customization-common.md +++ b/packages/material/docs/customization-common.md @@ -157,6 +157,36 @@ The following table lists the available variables for customization.
Description
The gradient background of selected items.
+ + $kendo-transition-duration + String + var(--kendo-global-duration, var(--kendo-motion-short-4, .2s)) + var(--kendo-global-duration, var(--kendo-motion-short-4, 0.2s)) + + +
Description
Transition duration used across all components.
+ + + + $kendo-transition-easing + String + var(--kendo-motion-ease-in-out, ease-in-out) + var(--kendo-motion-ease-in-out, ease-in-out) + + +
Description
Transition timing function used across all components.
+ + + + $kendo-transition + List + color $kendo-transition-duration $kendo-transition-easing, background-color $kendo-transition-duration $kendo-transition-easing, border-color $kendo-transition-duration $kendo-transition-easing, box-shadow $kendo-transition-duration $kendo-transition-easing + color var(--kendo-global-duration, var(--kendo-motion-short-4, 0.2s)) var(--kendo-motion-ease-in-out, ease-in-out), background-color var(--kendo-global-duration, var(--kendo-motion-short-4, 0.2s)) var(--kendo-motion-ease-in-out, ease-in-out), border-color var(--kendo-global-duration, var(--kendo-motion-short-4, 0.2s)) var(--kendo-motion-ease-in-out, ease-in-out), box-shadow var(--kendo-global-duration, var(--kendo-motion-short-4, 0.2s)) var(--kendo-motion-ease-in-out, ease-in-out) + + +
Description
Transition used across all components.
+ + $kendo-list-sizes Map diff --git a/packages/material/docs/customization-floating-label.md b/packages/material/docs/customization-floating-label.md index 2408f697b8c..4ad11d1990d 100644 --- a/packages/material/docs/customization-floating-label.md +++ b/packages/material/docs/customization-floating-label.md @@ -130,8 +130,8 @@ The following table lists the available variables for customization. $kendo-floating-label-transition List - .15s cubic-bezier( .4, 0, .2, 1 ) - 0.15s cubic-bezier(0.4, 0, 0.2, 1) + var(--kendo-motion-short-3, .15s) cubic-bezier( .4, 0, .2, 1 ) + var(--kendo-motion-short-3, 0.15s) cubic-bezier(0.4, 0, 0.2, 1)
Description
The transition of the Floating Label.
diff --git a/packages/material/docs/customization-scrollview.md b/packages/material/docs/customization-scrollview.md index 799931e7f64..19ddf943eff 100644 --- a/packages/material/docs/customization-scrollview.md +++ b/packages/material/docs/customization-scrollview.md @@ -289,9 +289,9 @@ The following table lists the available variables for customization. $kendo-scrollview-transition-duration - Number - .3s - 0.3s + String + var(--kendo-motion-medium-2, .3s) + var(--kendo-motion-medium-2, 0.3s)
Description
The duration of the ScrollView transition.
@@ -300,8 +300,8 @@ The following table lists the available variables for customization. $kendo-scrollview-transition-timing-function String - ease-in-out - ease-in-out + var(--kendo-motion-ease-in-out, ease-in-out) + var(--kendo-motion-ease-in-out, ease-in-out)
Description
The timing function of the ScrollView transition.
diff --git a/packages/material/docs/customization.md b/packages/material/docs/customization.md index 3734025e74a..235b7fe906d 100644 --- a/packages/material/docs/customization.md +++ b/packages/material/docs/customization.md @@ -161,6 +161,36 @@ The following table lists the available variables for customizing the Material t
Description
The gradient background of selected items.
+ + $kendo-transition-duration + String + var(--kendo-global-duration, var(--kendo-motion-short-4, .2s)) + var(--kendo-global-duration, var(--kendo-motion-short-4, 0.2s)) + + +
Description
Transition duration used across all components.
+ + + + $kendo-transition-easing + String + var(--kendo-motion-ease-in-out, ease-in-out) + var(--kendo-motion-ease-in-out, ease-in-out) + + +
Description
Transition timing function used across all components.
+ + + + $kendo-transition + List + color $kendo-transition-duration $kendo-transition-easing, background-color $kendo-transition-duration $kendo-transition-easing, border-color $kendo-transition-duration $kendo-transition-easing, box-shadow $kendo-transition-duration $kendo-transition-easing + color var(--kendo-global-duration, var(--kendo-motion-short-4, 0.2s)) var(--kendo-motion-ease-in-out, ease-in-out), background-color var(--kendo-global-duration, var(--kendo-motion-short-4, 0.2s)) var(--kendo-motion-ease-in-out, ease-in-out), border-color var(--kendo-global-duration, var(--kendo-motion-short-4, 0.2s)) var(--kendo-motion-ease-in-out, ease-in-out), box-shadow var(--kendo-global-duration, var(--kendo-motion-short-4, 0.2s)) var(--kendo-motion-ease-in-out, ease-in-out) + + +
Description
Transition used across all components.
+ + $kendo-list-sizes Map @@ -2246,8 +2276,8 @@ The following table lists the available variables for customizing the Material t $kendo-button-transition List - box-shadow 280ms cubic-bezier( .4, 0, .2, 1 ) - box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1) + box-shadow var(--kendo-motion-medium-3, 280ms) cubic-bezier( .4, 0, .2, 1 ) + box-shadow var(--kendo-motion-medium-3, 280ms) cubic-bezier(0.4, 0, 0.2, 1)
Description
The box-shadow transition of the Button.
@@ -6582,8 +6612,8 @@ The following table lists the available variables for customizing the Material t $kendo-floating-label-transition List - .15s cubic-bezier( .4, 0, .2, 1 ) - 0.15s cubic-bezier(0.4, 0, 0.2, 1) + var(--kendo-motion-short-3, .15s) cubic-bezier( .4, 0, .2, 1 ) + var(--kendo-motion-short-3, 0.15s) cubic-bezier(0.4, 0, 0.2, 1)
Description
The transition of the Floating Label.
@@ -12464,9 +12494,9 @@ The following table lists the available variables for customizing the Material t $kendo-scrollview-transition-duration - Number - .3s - 0.3s + String + var(--kendo-motion-medium-2, .3s) + var(--kendo-motion-medium-2, 0.3s)
Description
The duration of the ScrollView transition.
@@ -12475,8 +12505,8 @@ The following table lists the available variables for customizing the Material t $kendo-scrollview-transition-timing-function String - ease-in-out - ease-in-out + var(--kendo-motion-ease-in-out, ease-in-out) + var(--kendo-motion-ease-in-out, ease-in-out)
Description
The timing function of the ScrollView transition.