From a00a5aed36f41f5e6b96e8cd8ee43587687023c4 Mon Sep 17 00:00:00 2001 From: Emil Petrov Date: Fri, 22 Nov 2024 18:04:25 +0200 Subject: [PATCH] chore: regen docs --- .../bootstrap/docs/customization-editor.md | 2 +- .../bootstrap/docs/customization-gantt.md | 8 +- .../bootstrap/docs/customization-stepper.md | 2 +- .../bootstrap/docs/customization-switch.md | 2 +- packages/bootstrap/docs/customization.md | 14 +-- packages/classic/docs/customization-editor.md | 2 +- .../classic/docs/customization-stepper.md | 2 +- packages/classic/docs/customization.md | 4 +- packages/core/docs/customization.md | 100 +++++++++--------- packages/default/docs/customization-editor.md | 2 +- .../default/docs/customization-stepper.md | 2 +- packages/default/docs/customization.md | 4 +- .../docs/customization-dock-manager.md | 2 +- .../material/docs/customization-editor.md | 2 +- packages/material/docs/customization-gantt.md | 10 +- packages/material/docs/customization-input.md | 2 +- packages/material/docs/customization-menu.md | 4 +- .../material/docs/customization-pivotgrid.md | 2 +- .../material/docs/customization-stepper.md | 2 +- packages/material/docs/customization.md | 24 ++--- 20 files changed, 96 insertions(+), 96 deletions(-) diff --git a/packages/bootstrap/docs/customization-editor.md b/packages/bootstrap/docs/customization-editor.md index 0eb4f1d9ea..965c138d42 100644 --- a/packages/bootstrap/docs/customization-editor.md +++ b/packages/bootstrap/docs/customization-editor.md @@ -110,7 +110,7 @@ The following table lists the available variables for customization. $kendo-editor-highlighted-bg String - if($kendo-enable-color-system, k-color( primary-subtle ), k-color-mix( $kendo-color-primary, #ffffff, 20% )) + if($kendo-enable-color-system, k-color( primary-subtle ), color.mix( $kendo-color-primary, #ffffff, 20% )) var(--kendo-color-primary-subtle, #cfe2ff) diff --git a/packages/bootstrap/docs/customization-gantt.md b/packages/bootstrap/docs/customization-gantt.md index e147a4ebdf..5bfb02e758 100644 --- a/packages/bootstrap/docs/customization-gantt.md +++ b/packages/bootstrap/docs/customization-gantt.md @@ -170,7 +170,7 @@ The following table lists the available variables for customization. $kendo-gantt-line-fill String - if($kendo-enable-color-system, k-color( on-base ), k-color-mix( $kendo-gantt-text, $kendo-gantt-bg )) + if($kendo-enable-color-system, k-color( on-base ), color.mix( $kendo-gantt-text, $kendo-gantt-bg )) var(--kendo-color-on-base, #212529) @@ -290,7 +290,7 @@ The following table lists the available variables for customization. $kendo-gantt-summary-bg String - if($kendo-enable-color-system, k-color( subtle ), k-color-mix( $kendo-gantt-text, $kendo-gantt-bg )) + if($kendo-enable-color-system, k-color( subtle ), color.mix( $kendo-gantt-text, $kendo-gantt-bg )) var(--kendo-color-subtle, #596169) @@ -310,7 +310,7 @@ The following table lists the available variables for customization. $kendo-gantt-summary-selected-bg String - if($kendo-enable-color-system, k-color( primary-subtle-active ), k-color-mix( $kendo-selected-bg, $kendo-gantt-bg )) + if($kendo-enable-color-system, k-color( primary-subtle-active ), color.mix( $kendo-selected-bg, $kendo-gantt-bg )) var(--kendo-color-primary-subtle-active, #9ec5fe) @@ -400,7 +400,7 @@ The following table lists the available variables for customization. $kendo-gantt-task-selected-bg String - if($kendo-enable-color-system, k-color( primary-subtle-active ), k-color-mix( $kendo-selected-bg, $kendo-gantt-bg )) + if($kendo-enable-color-system, k-color( primary-subtle-active ), color.mix( $kendo-selected-bg, $kendo-gantt-bg )) var(--kendo-color-primary-subtle-active, #9ec5fe) diff --git a/packages/bootstrap/docs/customization-stepper.md b/packages/bootstrap/docs/customization-stepper.md index 61c113c5d0..2326e04766 100644 --- a/packages/bootstrap/docs/customization-stepper.md +++ b/packages/bootstrap/docs/customization-stepper.md @@ -430,7 +430,7 @@ The following table lists the available variables for customization. $kendo-stepper-indicator-done-disabled-bg String - if($kendo-enable-color-system, color-mix(in srgb, k-color( primary ) 60%, transparent), k-color-mix( $kendo-stepper-indicator-done-bg, $kendo-component-bg, 60%)) + if($kendo-enable-color-system, color-mix(in srgb, k-color( primary ) 60%, transparent), color.mix( $kendo-stepper-indicator-done-bg, $kendo-component-bg, 60%)) color-mix(in srgb, var(--kendo-color-primary, #0d6efd) 60%, transparent) diff --git a/packages/bootstrap/docs/customization-switch.md b/packages/bootstrap/docs/customization-switch.md index d4e5420036..dc108f9f5d 100644 --- a/packages/bootstrap/docs/customization-switch.md +++ b/packages/bootstrap/docs/customization-switch.md @@ -194,7 +194,7 @@ The following table lists the available variables for customization. $kendo-switch-off-track-focus-border String - if($kendo-enable-color-system, k-color( primary-emphasis ), k-color-mix( $kendo-switch-off-track-bg, $kendo-color-primary )) + if($kendo-enable-color-system, k-color( primary-emphasis ), color.mix( $kendo-switch-off-track-bg, $kendo-color-primary )) var(--kendo-color-primary-emphasis, rgba(13, 110, 253, 0.4)) diff --git a/packages/bootstrap/docs/customization.md b/packages/bootstrap/docs/customization.md index 20cba8d3ff..dde80a33b8 100644 --- a/packages/bootstrap/docs/customization.md +++ b/packages/bootstrap/docs/customization.md @@ -9086,7 +9086,7 @@ The following table lists the available variables for customizing the Bootstrap $kendo-editor-highlighted-bg String - if($kendo-enable-color-system, k-color( primary-subtle ), k-color-mix( $kendo-color-primary, #ffffff, 20% )) + if($kendo-enable-color-system, k-color( primary-subtle ), color.mix( $kendo-color-primary, #ffffff, 20% )) var(--kendo-color-primary-subtle, #cfe2ff) @@ -11549,7 +11549,7 @@ The following table lists the available variables for customizing the Bootstrap $kendo-gantt-line-fill String - if($kendo-enable-color-system, k-color( on-base ), k-color-mix( $kendo-gantt-text, $kendo-gantt-bg )) + if($kendo-enable-color-system, k-color( on-base ), color.mix( $kendo-gantt-text, $kendo-gantt-bg )) var(--kendo-color-on-base, #212529) @@ -11669,7 +11669,7 @@ The following table lists the available variables for customizing the Bootstrap $kendo-gantt-summary-bg String - if($kendo-enable-color-system, k-color( subtle ), k-color-mix( $kendo-gantt-text, $kendo-gantt-bg )) + if($kendo-enable-color-system, k-color( subtle ), color.mix( $kendo-gantt-text, $kendo-gantt-bg )) var(--kendo-color-subtle, #596169) @@ -11689,7 +11689,7 @@ The following table lists the available variables for customizing the Bootstrap $kendo-gantt-summary-selected-bg String - if($kendo-enable-color-system, k-color( primary-subtle-active ), k-color-mix( $kendo-selected-bg, $kendo-gantt-bg )) + if($kendo-enable-color-system, k-color( primary-subtle-active ), color.mix( $kendo-selected-bg, $kendo-gantt-bg )) var(--kendo-color-primary-subtle-active, #9ec5fe) @@ -11779,7 +11779,7 @@ The following table lists the available variables for customizing the Bootstrap $kendo-gantt-task-selected-bg String - if($kendo-enable-color-system, k-color( primary-subtle-active ), k-color-mix( $kendo-selected-bg, $kendo-gantt-bg )) + if($kendo-enable-color-system, k-color( primary-subtle-active ), color.mix( $kendo-selected-bg, $kendo-gantt-bg )) var(--kendo-color-primary-subtle-active, #9ec5fe) @@ -24491,7 +24491,7 @@ The following table lists the available variables for customizing the Bootstrap $kendo-stepper-indicator-done-disabled-bg String - if($kendo-enable-color-system, color-mix(in srgb, k-color( primary ) 60%, transparent), k-color-mix( $kendo-stepper-indicator-done-bg, $kendo-component-bg, 60%)) + if($kendo-enable-color-system, color-mix(in srgb, k-color( primary ) 60%, transparent), color.mix( $kendo-stepper-indicator-done-bg, $kendo-component-bg, 60%)) color-mix(in srgb, var(--kendo-color-primary, #0d6efd) 60%, transparent) @@ -24965,7 +24965,7 @@ The following table lists the available variables for customizing the Bootstrap $kendo-switch-off-track-focus-border String - if($kendo-enable-color-system, k-color( primary-emphasis ), k-color-mix( $kendo-switch-off-track-bg, $kendo-color-primary )) + if($kendo-enable-color-system, k-color( primary-emphasis ), color.mix( $kendo-switch-off-track-bg, $kendo-color-primary )) var(--kendo-color-primary-emphasis, rgba(13, 110, 253, 0.4)) diff --git a/packages/classic/docs/customization-editor.md b/packages/classic/docs/customization-editor.md index 05dc9b5b9b..ac0238e344 100644 --- a/packages/classic/docs/customization-editor.md +++ b/packages/classic/docs/customization-editor.md @@ -110,7 +110,7 @@ The following table lists the available variables for customization. $kendo-editor-highlighted-bg String - if($kendo-enable-color-system, k-color( primary-subtle ), k-color-mix( $kendo-color-primary, #ffffff, 20% )) + if($kendo-enable-color-system, k-color( primary-subtle ), color.mix( $kendo-color-primary, #ffffff, 20% )) var(--kendo-color-primary-subtle, #fff2eb) diff --git a/packages/classic/docs/customization-stepper.md b/packages/classic/docs/customization-stepper.md index a486a9edd2..fd2347ede2 100644 --- a/packages/classic/docs/customization-stepper.md +++ b/packages/classic/docs/customization-stepper.md @@ -430,7 +430,7 @@ The following table lists the available variables for customization. $kendo-stepper-indicator-done-disabled-bg String - if($kendo-enable-color-system, color-mix(in srgb, k-color( primary ) 60%, transparent), k-color-mix( $kendo-stepper-indicator-done-bg, $kendo-component-bg, 60% )) + if($kendo-enable-color-system, color-mix(in srgb, k-color( primary ) 60%, transparent), color.mix( $kendo-stepper-indicator-done-bg, $kendo-component-bg, 60% )) color-mix(in srgb, var(--kendo-color-primary, #f35800) 60%, transparent) diff --git a/packages/classic/docs/customization.md b/packages/classic/docs/customization.md index 569c91f39c..38668e5553 100644 --- a/packages/classic/docs/customization.md +++ b/packages/classic/docs/customization.md @@ -9297,7 +9297,7 @@ The following table lists the available variables for customizing the Classic th $kendo-editor-highlighted-bg String - if($kendo-enable-color-system, k-color( primary-subtle ), k-color-mix( $kendo-color-primary, #ffffff, 20% )) + if($kendo-enable-color-system, k-color( primary-subtle ), color.mix( $kendo-color-primary, #ffffff, 20% )) var(--kendo-color-primary-subtle, #fff2eb) @@ -24872,7 +24872,7 @@ The following table lists the available variables for customizing the Classic th $kendo-stepper-indicator-done-disabled-bg String - if($kendo-enable-color-system, color-mix(in srgb, k-color( primary ) 60%, transparent), k-color-mix( $kendo-stepper-indicator-done-bg, $kendo-component-bg, 60% )) + if($kendo-enable-color-system, color-mix(in srgb, k-color( primary ) 60%, transparent), color.mix( $kendo-stepper-indicator-done-bg, $kendo-component-bg, 60% )) color-mix(in srgb, var(--kendo-color-primary, #f35800) 60%, transparent) diff --git a/packages/core/docs/customization.md b/packages/core/docs/customization.md index 736670473e..9b9aea8bd0 100644 --- a/packages/core/docs/customization.md +++ b/packages/core/docs/customization.md @@ -34,7 +34,7 @@ k-color-luminance($color) // => Number #### Source ```scss -// Location https://github.com/telerik/kendo-themes/blob/develop/packages/core/scss/functions/_color.import.scss#L602-L608 +// Location https://github.com/telerik/kendo-themes/blob/develop/packages/core/scss/functions/_color.import.scss#L603-L609 @function k-color-luminance($color) { $red: list.nth( $_linear-channel-values, k-color-red( $color ) + 1 ); $green: list.nth( $_linear-channel-values, k-color-green( $color ) + 1 ); @@ -70,7 +70,7 @@ k-color-contrast-ratio($background, $foreground) // => Number #### Source ```scss -// Location https://github.com/telerik/kendo-themes/blob/develop/packages/core/scss/functions/_color.import.scss#L619-L624 +// Location https://github.com/telerik/kendo-themes/blob/develop/packages/core/scss/functions/_color.import.scss#L620-L625 @function k-color-contrast-ratio($background, $foreground) { $backLum: k-color-luminance( $background ) + .05; $foreLum: k-color-luminance( $foreground ) + .05; @@ -102,7 +102,7 @@ k-is-dark($color) // => Boolean #### Source ```scss -// Location https://github.com/telerik/kendo-themes/blob/develop/packages/core/scss/functions/_color.import.scss#L631-L633 +// Location https://github.com/telerik/kendo-themes/blob/develop/packages/core/scss/functions/_color.import.scss#L632-L634 @function k-is-dark($color) { @return if( k-color-luminance( $color ) < .5, true, false ); } @@ -131,7 +131,7 @@ k-is-light($color) // => Boolean #### Source ```scss -// Location https://github.com/telerik/kendo-themes/blob/develop/packages/core/scss/functions/_color.import.scss#L640-L642 +// Location https://github.com/telerik/kendo-themes/blob/develop/packages/core/scss/functions/_color.import.scss#L641-L643 @function k-is-light($color) { @return if( k-color-luminance( $color ) < .5, false, true ); } @@ -170,7 +170,7 @@ k-contrast-color($background, $dark, $light, $min-ratio) // => Color #### Source ```scss -// Location https://github.com/telerik/kendo-themes/blob/develop/packages/core/scss/functions/_color.import.scss#L654-L673 +// Location https://github.com/telerik/kendo-themes/blob/develop/packages/core/scss/functions/_color.import.scss#L655-L674 @function k-contrast-color($background, $dark, $light, $min-ratio) { $foregrounds: $light, $dark, #ffffff, #000000; $max-ratio: 0; @@ -222,7 +222,7 @@ k-generate-color-variations($name, $color, $theme) // => Map #### Source ```scss -// Location https://github.com/telerik/kendo-themes/blob/develop/packages/core/scss/color-system/_functions.import.scss#L199-L313 +// Location https://github.com/telerik/kendo-themes/blob/develop/packages/core/scss/color-system/_functions.import.scss#L200-L314 @function k-generate-color-variations($name, $color, $theme) { $result: (); @@ -237,10 +237,10 @@ k-generate-color-variations($name, $color, $theme) // => Map ) { $_variations: ( #{$name}: $color, - #{$name}-bold: k-color-mix(black, $color, 25%), - #{$name}-bolder: k-color-mix(black, $color, 50%), - #{$name}-subtle: k-color-mix(white, $color, 25%), - #{$name}-subtler: k-color-mix(white, $color, 50%), + #{$name}-bold: color.mix(black, $color, 25%), + #{$name}-bolder: color.mix(black, $color, 50%), + #{$name}-subtle: color.mix(white, $color, 25%), + #{$name}-subtler: color.mix(white, $color, 50%), ); $result: map.merge($result, $_variations); @@ -364,7 +364,7 @@ k-color($key) // => String #### Source ```scss -// Location https://github.com/telerik/kendo-themes/blob/develop/packages/core/scss/color-system/_functions.import.scss#L321-L329 +// Location https://github.com/telerik/kendo-themes/blob/develop/packages/core/scss/color-system/_functions.import.scss#L322-L330 @function k-color($key) { $_color: map.get($kendo-colors, $key); @@ -408,7 +408,7 @@ k-color-tint($color, $level) // => Color #### Source ```scss -// Location https://github.com/telerik/kendo-themes/blob/develop/packages/core/scss/functions/_color.import.scss#L211-L213 +// Location https://github.com/telerik/kendo-themes/blob/develop/packages/core/scss/functions/_color.import.scss#L212-L214 @function k-color-tint($color, $level) { @return k-color-level( $color, -$level ); } @@ -446,7 +446,7 @@ k-color-shade($color, $level) // => Color #### Source ```scss -// Location https://github.com/telerik/kendo-themes/blob/develop/packages/core/scss/functions/_color.import.scss#L224-L226 +// Location https://github.com/telerik/kendo-themes/blob/develop/packages/core/scss/functions/_color.import.scss#L225-L227 @function k-color-shade($color, $level) { @return k-color-level( $color, $level ); } @@ -478,7 +478,7 @@ k-try-shade($color, $level) // => Color #### Source ```scss -// Location https://github.com/telerik/kendo-themes/blob/develop/packages/core/scss/functions/_color.import.scss#L234-L242 +// Location https://github.com/telerik/kendo-themes/blob/develop/packages/core/scss/functions/_color.import.scss#L235-L243 @function k-try-shade($color, $level) { $_dark-theme: if( meta.variable-exists( kendo-is-dark-theme ), $_is-dark-theme, false ); @@ -516,7 +516,7 @@ k-try-tint($color, $level) // => Color #### Source ```scss -// Location https://github.com/telerik/kendo-themes/blob/develop/packages/core/scss/functions/_color.import.scss#L250-L258 +// Location https://github.com/telerik/kendo-themes/blob/develop/packages/core/scss/functions/_color.import.scss#L251-L259 @function k-try-tint($color, $level) { $_dark-theme: if( meta.variable-exists( kendo-is-dark-theme ), $_is-dark-theme, false ); @@ -554,7 +554,7 @@ k-try-darken($color, $level) // => Color #### Source ```scss -// Location https://github.com/telerik/kendo-themes/blob/develop/packages/core/scss/functions/_color.import.scss#L266-L273 +// Location https://github.com/telerik/kendo-themes/blob/develop/packages/core/scss/functions/_color.import.scss#L267-L274 @function k-try-darken($color, $level) { $_dark-theme: if( meta.variable-exists( kendo-is-dark-theme ), $_is-dark-theme, false ); @@ -591,7 +591,7 @@ k-try-lighten($color, $level) // => Color #### Source ```scss -// Location https://github.com/telerik/kendo-themes/blob/develop/packages/core/scss/functions/_color.import.scss#L281-L288 +// Location https://github.com/telerik/kendo-themes/blob/develop/packages/core/scss/functions/_color.import.scss#L282-L289 @function k-try-lighten($color, $level) { $_dark-theme: if( meta.variable-exists( kendo-is-dark-theme ), $_is-dark-theme, false ); @@ -634,7 +634,7 @@ k-rgba-to-mix($color, $bg) // => Color #### Source ```scss -// Location https://github.com/telerik/kendo-themes/blob/develop/packages/core/scss/functions/_color.import.scss#L299-L303 +// Location https://github.com/telerik/kendo-themes/blob/develop/packages/core/scss/functions/_color.import.scss#L300-L304 @function k-rgba-to-mix($color, $bg) { $percent: k-color-alpha( $color ) * 100%; @@ -672,9 +672,9 @@ k-color-alpha($color) // => Number #### Source ```scss -// Location https://github.com/telerik/kendo-themes/blob/develop/packages/core/scss/functions/_color.import.scss#L16-L18 +// Location https://github.com/telerik/kendo-themes/blob/develop/packages/core/scss/functions/_color.import.scss#L17-L19 @function k-color-alpha($color) { - @return alpha( $color ); + @return color.alpha( $color ); } ``` @@ -707,9 +707,9 @@ k-color-red($color) // => Number #### Source ```scss -// Location https://github.com/telerik/kendo-themes/blob/develop/packages/core/scss/functions/_color.import.scss#L26-L28 +// Location https://github.com/telerik/kendo-themes/blob/develop/packages/core/scss/functions/_color.import.scss#L27-L29 @function k-color-red($color) { - @return red( $color ); + @return math.round(color.channel( $color, "red" )); } ``` @@ -742,9 +742,9 @@ k-color-green($color) // => Number #### Source ```scss -// Location https://github.com/telerik/kendo-themes/blob/develop/packages/core/scss/functions/_color.import.scss#L36-L38 +// Location https://github.com/telerik/kendo-themes/blob/develop/packages/core/scss/functions/_color.import.scss#L37-L39 @function k-color-green($color) { - @return green( $color ); + @return math.round(color.channel( $color, "green" )); } ``` @@ -777,9 +777,9 @@ k-color-blue($color) // => Number #### Source ```scss -// Location https://github.com/telerik/kendo-themes/blob/develop/packages/core/scss/functions/_color.import.scss#L46-L48 +// Location https://github.com/telerik/kendo-themes/blob/develop/packages/core/scss/functions/_color.import.scss#L47-L49 @function k-color-blue($color) { - @return blue( $color ); + @return math.round(color.channel( $color, "blue" )); } ``` @@ -812,9 +812,9 @@ k-color-hue($color) // => Number #### Source ```scss -// Location https://github.com/telerik/kendo-themes/blob/develop/packages/core/scss/functions/_color.import.scss#L56-L58 +// Location https://github.com/telerik/kendo-themes/blob/develop/packages/core/scss/functions/_color.import.scss#L57-L59 @function k-color-hue($color) { - @return hue( $color ); + @return color.channel( $color, "hue" ); } ``` @@ -847,9 +847,9 @@ k-color-saturation($color) // => Number #### Source ```scss -// Location https://github.com/telerik/kendo-themes/blob/develop/packages/core/scss/functions/_color.import.scss#L66-L68 +// Location https://github.com/telerik/kendo-themes/blob/develop/packages/core/scss/functions/_color.import.scss#L67-L69 @function k-color-saturation($color) { - @return saturation( $color ); + @return color.channel( $color, "saturation" ); } ``` @@ -882,9 +882,9 @@ k-color-lightness($color) // => Number #### Source ```scss -// Location https://github.com/telerik/kendo-themes/blob/develop/packages/core/scss/functions/_color.import.scss#L76-L78 +// Location https://github.com/telerik/kendo-themes/blob/develop/packages/core/scss/functions/_color.import.scss#L77-L79 @function k-color-lightness($color) { - @return lightness( $color ); + @return color.channel( $color, "lightness" ); } ``` @@ -923,9 +923,9 @@ k-color-mix($color1, $color2, $weight) // => Color #### Source ```scss -// Location https://github.com/telerik/kendo-themes/blob/develop/packages/core/scss/functions/_color.import.scss#L88-L90 +// Location https://github.com/telerik/kendo-themes/blob/develop/packages/core/scss/functions/_color.import.scss#L89-L91 @function k-color-mix($color1, $color2, $weight) { - @return mix( $color1, $color2, $weight ); + @return color.mix( $color1, $color2, $weight ); } ``` @@ -961,9 +961,9 @@ k-color-darken($color, $amount) // => Color #### Source ```scss -// Location https://github.com/telerik/kendo-themes/blob/develop/packages/core/scss/functions/_color.import.scss#L99-L101 +// Location https://github.com/telerik/kendo-themes/blob/develop/packages/core/scss/functions/_color.import.scss#L100-L102 @function k-color-darken($color, $amount) { - @return darken( $color, $amount ); + @return color.adjust( $color, $lightness: - $amount ); } ``` @@ -999,9 +999,9 @@ k-color-lighten($color, $amount) // => Color #### Source ```scss -// Location https://github.com/telerik/kendo-themes/blob/develop/packages/core/scss/functions/_color.import.scss#L110-L112 +// Location https://github.com/telerik/kendo-themes/blob/develop/packages/core/scss/functions/_color.import.scss#L111-L113 @function k-color-lighten($color, $amount) { - @return lighten( $color, $amount ); + @return color.adjust( $color, $lightness: $amount ); } ``` @@ -1037,9 +1037,9 @@ k-color-adjust-hue($color, $degrees) // => Color #### Source ```scss -// Location https://github.com/telerik/kendo-themes/blob/develop/packages/core/scss/functions/_color.import.scss#L121-L123 +// Location https://github.com/telerik/kendo-themes/blob/develop/packages/core/scss/functions/_color.import.scss#L122-L124 @function k-color-adjust-hue($color, $degrees) { - @return adjust-hue( $color, $degrees ); + @return color.adjust( $color, $hue: $degrees ); } ``` @@ -1075,9 +1075,9 @@ k-color-saturate($color, $amount) // => Color #### Source ```scss -// Location https://github.com/telerik/kendo-themes/blob/develop/packages/core/scss/functions/_color.import.scss#L132-L134 +// Location https://github.com/telerik/kendo-themes/blob/develop/packages/core/scss/functions/_color.import.scss#L133-L135 @function k-color-saturate($color, $amount) { - @return saturate( $color, $amount ); + @return color.adjust( $color, $saturation: $amount ); } ``` @@ -1113,9 +1113,9 @@ k-color-desaturate($color, $amount) // => Color #### Source ```scss -// Location https://github.com/telerik/kendo-themes/blob/develop/packages/core/scss/functions/_color.import.scss#L143-L145 +// Location https://github.com/telerik/kendo-themes/blob/develop/packages/core/scss/functions/_color.import.scss#L144-L146 @function k-color-desaturate($color, $amount) { - @return desaturate( $color, $amount ); + @return color.adjust( $color, $saturation: - $amount ); } ``` @@ -1148,9 +1148,9 @@ k-color-grayscale($color) // => Color #### Source ```scss -// Location https://github.com/telerik/kendo-themes/blob/develop/packages/core/scss/functions/_color.import.scss#L153-L155 +// Location https://github.com/telerik/kendo-themes/blob/develop/packages/core/scss/functions/_color.import.scss#L154-L156 @function k-color-grayscale($color) { - @return grayscale( $color ); + @return color.grayscale( $color ); } ``` @@ -1184,9 +1184,9 @@ k-color-complement($color) // => Color #### Source ```scss -// Location https://github.com/telerik/kendo-themes/blob/develop/packages/core/scss/functions/_color.import.scss#L164-L166 +// Location https://github.com/telerik/kendo-themes/blob/develop/packages/core/scss/functions/_color.import.scss#L165-L167 @function k-color-complement($color) { - @return complement( $color ); + @return color.complement( $color ); } ``` @@ -1219,9 +1219,9 @@ k-color-invert($color) // => Color #### Source ```scss -// Location https://github.com/telerik/kendo-themes/blob/develop/packages/core/scss/functions/_color.import.scss#L174-L176 +// Location https://github.com/telerik/kendo-themes/blob/develop/packages/core/scss/functions/_color.import.scss#L175-L177 @function k-color-invert($color) { - @return invert( $color ); + @return color.invert( $color ); } ``` diff --git a/packages/default/docs/customization-editor.md b/packages/default/docs/customization-editor.md index 8d57dfafbc..911c67a805 100644 --- a/packages/default/docs/customization-editor.md +++ b/packages/default/docs/customization-editor.md @@ -110,7 +110,7 @@ The following table lists the available variables for customization. $kendo-editor-highlighted-bg String - if($kendo-enable-color-system, k-color( primary-subtle ), k-color-mix($kendo-color-primary, #ffffff, 20%)) + if($kendo-enable-color-system, k-color( primary-subtle ), color.mix($kendo-color-primary, #ffffff, 20%)) var(--kendo-color-primary-subtle, #ffeceb) diff --git a/packages/default/docs/customization-stepper.md b/packages/default/docs/customization-stepper.md index 83bd186532..e70c5e62da 100644 --- a/packages/default/docs/customization-stepper.md +++ b/packages/default/docs/customization-stepper.md @@ -430,7 +430,7 @@ The following table lists the available variables for customization. $kendo-stepper-indicator-done-disabled-bg String - if($kendo-enable-color-system, color-mix(in srgb, k-color( primary ) 60%, transparent), k-color-mix( $kendo-stepper-indicator-done-bg, $kendo-component-bg, 60%)) + if($kendo-enable-color-system, color-mix(in srgb, k-color( primary ) 60%, transparent), color.mix( $kendo-stepper-indicator-done-bg, $kendo-component-bg, 60%)) color-mix(in srgb, var(--kendo-color-primary, #ff6358) 60%, transparent) diff --git a/packages/default/docs/customization.md b/packages/default/docs/customization.md index 20b48eeb92..2a6e4aa5f7 100644 --- a/packages/default/docs/customization.md +++ b/packages/default/docs/customization.md @@ -8846,7 +8846,7 @@ The following table lists the available variables for customizing the Default th $kendo-editor-highlighted-bg String - if($kendo-enable-color-system, k-color( primary-subtle ), k-color-mix($kendo-color-primary, #ffffff, 20%)) + if($kendo-enable-color-system, k-color( primary-subtle ), color.mix($kendo-color-primary, #ffffff, 20%)) var(--kendo-color-primary-subtle, #ffeceb) @@ -24311,7 +24311,7 @@ The following table lists the available variables for customizing the Default th $kendo-stepper-indicator-done-disabled-bg String - if($kendo-enable-color-system, color-mix(in srgb, k-color( primary ) 60%, transparent), k-color-mix( $kendo-stepper-indicator-done-bg, $kendo-component-bg, 60%)) + if($kendo-enable-color-system, color-mix(in srgb, k-color( primary ) 60%, transparent), color.mix( $kendo-stepper-indicator-done-bg, $kendo-component-bg, 60%)) color-mix(in srgb, var(--kendo-color-primary, #ff6358) 60%, transparent) diff --git a/packages/material/docs/customization-dock-manager.md b/packages/material/docs/customization-dock-manager.md index 8e8aed62db..6067c16f89 100644 --- a/packages/material/docs/customization-dock-manager.md +++ b/packages/material/docs/customization-dock-manager.md @@ -310,7 +310,7 @@ The following table lists the available variables for customization. $kendo-dock-indicator-hover-bg String - if($kendo-enable-color-system, k-color( primary-hover ), mix( $kendo-color-white, $kendo-color-primary, 8% )) + if($kendo-enable-color-system, k-color( primary-hover ), color.mix( $kendo-color-white, $kendo-color-primary, 8% )) var(--kendo-color-primary-hover, #3a4ba7) diff --git a/packages/material/docs/customization-editor.md b/packages/material/docs/customization-editor.md index fd7b7338ed..57a9371f16 100644 --- a/packages/material/docs/customization-editor.md +++ b/packages/material/docs/customization-editor.md @@ -110,7 +110,7 @@ The following table lists the available variables for customization. $kendo-editor-highlighted-bg String - if($kendo-enable-color-system, k-color( primary-subtle ), mix($kendo-color-primary, #ffffff, 20%)) + if($kendo-enable-color-system, k-color( primary-subtle ), color.mix($kendo-color-primary, #ffffff, 20%)) var(--kendo-color-primary-subtle, #d1d5ee) diff --git a/packages/material/docs/customization-gantt.md b/packages/material/docs/customization-gantt.md index 81d060f659..573dd13bfc 100644 --- a/packages/material/docs/customization-gantt.md +++ b/packages/material/docs/customization-gantt.md @@ -170,7 +170,7 @@ The following table lists the available variables for customization. $kendo-gantt-line-fill String - if($kendo-enable-color-system, k-color( subtle ), mix( $kendo-gantt-text, $kendo-gantt-bg )) + if($kendo-enable-color-system, k-color( subtle ), color.mix( $kendo-gantt-text, $kendo-gantt-bg )) var(--kendo-color-subtle, #757575) @@ -290,7 +290,7 @@ The following table lists the available variables for customization. $kendo-gantt-summary-bg String - if($kendo-enable-color-system, k-color( primary-emphasis ), mix( $kendo-color-primary, $kendo-gantt-bg )) + if($kendo-enable-color-system, k-color( primary-emphasis ), color.mix( $kendo-color-primary, $kendo-gantt-bg )) var(--kendo-color-primary-emphasis, #97a0d7) @@ -310,7 +310,7 @@ The following table lists the available variables for customization. $kendo-gantt-summary-selected-bg String - if($kendo-enable-color-system, k-color( secondary-subtle-active ), mix( $kendo-color-secondary, $kendo-gantt-bg )) + if($kendo-enable-color-system, k-color( secondary-subtle-active ), color.mix( $kendo-color-secondary, $kendo-gantt-bg )) var(--kendo-color-secondary-subtle-active, #f79bb3) @@ -360,7 +360,7 @@ The following table lists the available variables for customization. $kendo-gantt-task-bg String - if($kendo-enable-color-system, k-color( primary-emphasis ), mix( $kendo-color-primary, $kendo-gantt-bg )) + if($kendo-enable-color-system, k-color( primary-emphasis ), color.mix( $kendo-color-primary, $kendo-gantt-bg )) var(--kendo-color-primary-emphasis, #97a0d7) @@ -400,7 +400,7 @@ The following table lists the available variables for customization. $kendo-gantt-task-selected-bg String - if($kendo-enable-color-system, k-color( secondary-subtle-active ), mix( $kendo-color-secondary, $kendo-gantt-bg )) + if($kendo-enable-color-system, k-color( secondary-subtle-active ), color.mix( $kendo-color-secondary, $kendo-gantt-bg )) var(--kendo-color-secondary-subtle-active, #f79bb3) diff --git a/packages/material/docs/customization-input.md b/packages/material/docs/customization-input.md index 7966bea2ab..34dda3fb53 100644 --- a/packages/material/docs/customization-input.md +++ b/packages/material/docs/customization-input.md @@ -425,7 +425,7 @@ The following table lists the available variables for customization. $kendo-input-disabled-border String - if($kendo-enable-color-system, color-mix(in srgb, k-color( on-app-surface ) 3%, transparent), rgba( $kendo-component-border, math.div( alpha( $kendo-component-border ), 2 ) )) + if($kendo-enable-color-system, color-mix(in srgb, k-color( on-app-surface ) 3%, transparent), rgba( $kendo-component-border, math.div( color.alpha( $kendo-component-border ), 2 ) )) color-mix(in srgb, var(--kendo-color-on-app-surface, #212121) 3%, transparent) diff --git a/packages/material/docs/customization-menu.md b/packages/material/docs/customization-menu.md index 04a133334a..5f2820e021 100644 --- a/packages/material/docs/customization-menu.md +++ b/packages/material/docs/customization-menu.md @@ -200,7 +200,7 @@ The following table lists the available variables for customization. $kendo-menu-item-hover-bg String - if($kendo-enable-color-system, k-color( base-hover ), rgba( $kendo-menu-text, $kendo-flat-button-hover-opacity * alpha( $kendo-menu-text ) )) + if($kendo-enable-color-system, k-color( base-hover ), rgba( $kendo-menu-text, $kendo-flat-button-hover-opacity * color.alpha( $kendo-menu-text ) )) var(--kendo-color-base-hover, #ebebeb) @@ -240,7 +240,7 @@ The following table lists the available variables for customization. $kendo-menu-item-active-bg String - if($kendo-enable-color-system, k-color( base-active ), rgba( $kendo-menu-text, $kendo-flat-button-active-opacity * alpha( $kendo-menu-text ) )) + if($kendo-enable-color-system, k-color( base-active ), rgba( $kendo-menu-text, $kendo-flat-button-active-opacity * color.alpha( $kendo-menu-text ) )) var(--kendo-color-base-active, #d6d6d6) diff --git a/packages/material/docs/customization-pivotgrid.md b/packages/material/docs/customization-pivotgrid.md index 60d68d9529..e202422c81 100644 --- a/packages/material/docs/customization-pivotgrid.md +++ b/packages/material/docs/customization-pivotgrid.md @@ -260,7 +260,7 @@ The following table lists the available variables for customization. $kendo-pivotgrid-hover-bg String - if($kendo-enable-color-system, k-color( base-hover ), darken( $kendo-pivotgrid-bg, 7% )) + if($kendo-enable-color-system, k-color( base-hover ), color.adjust( $kendo-pivotgrid-bg, $lightness: - 7% )) var(--kendo-color-base-hover, #ebebeb) diff --git a/packages/material/docs/customization-stepper.md b/packages/material/docs/customization-stepper.md index c2fd955c5b..4d259faf73 100644 --- a/packages/material/docs/customization-stepper.md +++ b/packages/material/docs/customization-stepper.md @@ -430,7 +430,7 @@ The following table lists the available variables for customization. $kendo-stepper-indicator-done-disabled-bg String - if($kendo-enable-color-system, color-mix(in srgb, k-color( primary ) 60%, transparent), mix( $kendo-stepper-indicator-done-bg, $kendo-component-bg, 60%)) + if($kendo-enable-color-system, color-mix(in srgb, k-color( primary ) 60%, transparent), color.mix( $kendo-stepper-indicator-done-bg, $kendo-component-bg, 60%)) color-mix(in srgb, var(--kendo-color-primary, #3f51b5) 60%, transparent) diff --git a/packages/material/docs/customization.md b/packages/material/docs/customization.md index 3e0264a41a..8b2363885d 100644 --- a/packages/material/docs/customization.md +++ b/packages/material/docs/customization.md @@ -8116,7 +8116,7 @@ The following table lists the available variables for customizing the Material t $kendo-dock-indicator-hover-bg String - if($kendo-enable-color-system, k-color( primary-hover ), mix( $kendo-color-white, $kendo-color-primary, 8% )) + if($kendo-enable-color-system, k-color( primary-hover ), color.mix( $kendo-color-white, $kendo-color-primary, 8% )) var(--kendo-color-primary-hover, #3a4ba7) @@ -8866,7 +8866,7 @@ The following table lists the available variables for customizing the Material t $kendo-editor-highlighted-bg String - if($kendo-enable-color-system, k-color( primary-subtle ), mix($kendo-color-primary, #ffffff, 20%)) + if($kendo-enable-color-system, k-color( primary-subtle ), color.mix($kendo-color-primary, #ffffff, 20%)) var(--kendo-color-primary-subtle, #d1d5ee) @@ -11279,7 +11279,7 @@ The following table lists the available variables for customizing the Material t $kendo-gantt-line-fill String - if($kendo-enable-color-system, k-color( subtle ), mix( $kendo-gantt-text, $kendo-gantt-bg )) + if($kendo-enable-color-system, k-color( subtle ), color.mix( $kendo-gantt-text, $kendo-gantt-bg )) var(--kendo-color-subtle, #757575) @@ -11399,7 +11399,7 @@ The following table lists the available variables for customizing the Material t $kendo-gantt-summary-bg String - if($kendo-enable-color-system, k-color( primary-emphasis ), mix( $kendo-color-primary, $kendo-gantt-bg )) + if($kendo-enable-color-system, k-color( primary-emphasis ), color.mix( $kendo-color-primary, $kendo-gantt-bg )) var(--kendo-color-primary-emphasis, #97a0d7) @@ -11419,7 +11419,7 @@ The following table lists the available variables for customizing the Material t $kendo-gantt-summary-selected-bg String - if($kendo-enable-color-system, k-color( secondary-subtle-active ), mix( $kendo-color-secondary, $kendo-gantt-bg )) + if($kendo-enable-color-system, k-color( secondary-subtle-active ), color.mix( $kendo-color-secondary, $kendo-gantt-bg )) var(--kendo-color-secondary-subtle-active, #f79bb3) @@ -11469,7 +11469,7 @@ The following table lists the available variables for customizing the Material t $kendo-gantt-task-bg String - if($kendo-enable-color-system, k-color( primary-emphasis ), mix( $kendo-color-primary, $kendo-gantt-bg )) + if($kendo-enable-color-system, k-color( primary-emphasis ), color.mix( $kendo-color-primary, $kendo-gantt-bg )) var(--kendo-color-primary-emphasis, #97a0d7) @@ -11509,7 +11509,7 @@ The following table lists the available variables for customizing the Material t $kendo-gantt-task-selected-bg String - if($kendo-enable-color-system, k-color( secondary-subtle-active ), mix( $kendo-color-secondary, $kendo-gantt-bg )) + if($kendo-enable-color-system, k-color( secondary-subtle-active ), color.mix( $kendo-color-secondary, $kendo-gantt-bg )) var(--kendo-color-secondary-subtle-active, #f79bb3) @@ -12854,7 +12854,7 @@ The following table lists the available variables for customizing the Material t $kendo-input-disabled-border String - if($kendo-enable-color-system, color-mix(in srgb, k-color( on-app-surface ) 3%, transparent), rgba( $kendo-component-border, math.div( alpha( $kendo-component-border ), 2 ) )) + if($kendo-enable-color-system, color-mix(in srgb, k-color( on-app-surface ) 3%, transparent), rgba( $kendo-component-border, math.div( color.alpha( $kendo-component-border ), 2 ) )) color-mix(in srgb, var(--kendo-color-on-app-surface, #212121) 3%, transparent) @@ -15034,7 +15034,7 @@ The following table lists the available variables for customizing the Material t $kendo-menu-item-hover-bg String - if($kendo-enable-color-system, k-color( base-hover ), rgba( $kendo-menu-text, $kendo-flat-button-hover-opacity * alpha( $kendo-menu-text ) )) + if($kendo-enable-color-system, k-color( base-hover ), rgba( $kendo-menu-text, $kendo-flat-button-hover-opacity * color.alpha( $kendo-menu-text ) )) var(--kendo-color-base-hover, #ebebeb) @@ -15074,7 +15074,7 @@ The following table lists the available variables for customizing the Material t $kendo-menu-item-active-bg String - if($kendo-enable-color-system, k-color( base-active ), rgba( $kendo-menu-text, $kendo-flat-button-active-opacity * alpha( $kendo-menu-text ) )) + if($kendo-enable-color-system, k-color( base-active ), rgba( $kendo-menu-text, $kendo-flat-button-active-opacity * color.alpha( $kendo-menu-text ) )) var(--kendo-color-base-active, #d6d6d6) @@ -19116,7 +19116,7 @@ The following table lists the available variables for customizing the Material t $kendo-pivotgrid-hover-bg String - if($kendo-enable-color-system, k-color( base-hover ), darken( $kendo-pivotgrid-bg, 7% )) + if($kendo-enable-color-system, k-color( base-hover ), color.adjust( $kendo-pivotgrid-bg, $lightness: - 7% )) var(--kendo-color-base-hover, #ebebeb) @@ -24302,7 +24302,7 @@ The following table lists the available variables for customizing the Material t $kendo-stepper-indicator-done-disabled-bg String - if($kendo-enable-color-system, color-mix(in srgb, k-color( primary ) 60%, transparent), mix( $kendo-stepper-indicator-done-bg, $kendo-component-bg, 60%)) + if($kendo-enable-color-system, color-mix(in srgb, k-color( primary ) 60%, transparent), color.mix( $kendo-stepper-indicator-done-bg, $kendo-component-bg, 60%)) color-mix(in srgb, var(--kendo-color-primary, #3f51b5) 60%, transparent)