From 1e6963c5913469afaefcab805892a34593c1b56d Mon Sep 17 00:00:00 2001 From: Teya Veselinova Date: Mon, 23 Dec 2024 15:54:46 +0200 Subject: [PATCH] chore: update docs --- .../docs/customization-color-editor.md | 312 +++++++++ .../docs/customization-color-gradient.md | 215 ++++++ .../docs/customization-color-palette.md | 83 +++ packages/bootstrap/docs/customization.md | 610 +++++++++++++++++ .../docs/customization-color-editor.md | 318 ++++++++- .../docs/customization-color-gradient.md | 221 ++++++- .../docs/customization-color-palette.md | 83 +++ packages/classic/docs/customization.md | 622 +++++++++++++++++- .../docs/customization-color-editor.md | 318 ++++++++- .../docs/customization-color-gradient.md | 221 ++++++- .../docs/customization-color-palette.md | 83 +++ packages/default/docs/customization.md | 622 +++++++++++++++++- .../fluent/docs/customization-color-editor.md | 312 +++++++++ .../docs/customization-color-gradient.md | 221 ++++++- .../docs/customization-color-palette.md | 83 +++ packages/fluent/docs/customization.md | 616 ++++++++++++++++- .../docs/customization-color-editor.md | 312 +++++++++ .../docs/customization-color-gradient.md | 215 ++++++ .../docs/customization-color-palette.md | 83 +++ packages/material/docs/customization.md | 610 +++++++++++++++++ 20 files changed, 6130 insertions(+), 30 deletions(-) diff --git a/packages/bootstrap/docs/customization-color-editor.md b/packages/bootstrap/docs/customization-color-editor.md index c68f6404403..d499a1c2679 100644 --- a/packages/bootstrap/docs/customization-color-editor.md +++ b/packages/bootstrap/docs/customization-color-editor.md @@ -47,6 +47,36 @@ The following table lists the available variables for customization.
Description
The minimum width of the ColorEditor.
+ + $kendo-color-editor-sm-min-width + Number + 252px + 252px + + +
Description
The minimum width of the ColorEditor.
+ + + + $kendo-color-editor-md-min-width + Number + $kendo-color-editor-min-width + 328px + + +
Description
The minimum width of the ColorEditor.
+ + + + $kendo-color-editor-lg-min-width + Number + 362px + 362px + + +
Description
The minimum width of the ColorEditor.
+ + $kendo-color-editor-border-width Number @@ -177,6 +207,66 @@ The following table lists the available variables for customization.
Description
The spacing between the ColorEditor header actions.
+ + $kendo-color-editor-sm-header-padding-y + String + $kendo-color-editor-header-padding-y + var(--kendo-spacing-4, 1rem) + + +
Description
The vertical padding of the small ColorEditor header.
+ + + + $kendo-color-editor-sm-header-padding-x + String + $kendo-color-editor-header-padding-x + var(--kendo-spacing-4, 1rem) + + +
Description
The horizontal padding of the small ColorEditor header.
+ + + + $kendo-color-editor-md-header-padding-y + String + $kendo-color-editor-header-padding-y + var(--kendo-spacing-4, 1rem) + + +
Description
The vertical padding of the medium ColorEditor header.
+ + + + $kendo-color-editor-md-header-padding-x + String + $kendo-color-editor-header-padding-x + var(--kendo-spacing-4, 1rem) + + +
Description
The horizontal padding of the medium ColorEditor header.
+ + + + $kendo-color-editor-lg-header-padding-y + String + k-spacing(4.5) + var(--kendo-spacing-4\.5, 1.125rem) + + +
Description
The vertical padding of the large ColorEditor header.
+ + + + $kendo-color-editor-lg-header-padding-x + String + k-spacing(4.5) + var(--kendo-spacing-4\.5, 1.125rem) + + +
Description
The horizontal padding of the large ColorEditor header.
+ + $kendo-color-editor-color-preview-width Number @@ -207,6 +297,96 @@ The following table lists the available variables for customization.
Description
The spacing between the colors in the ColorEditor preview.
+ + $kendo-color-editor-sm-preview-gap + String + k-spacing(1) + var(--kendo-spacing-1, 0.25rem) + + +
Description
The spacing between the colors in the small ColorEditor preview.
+ + + + $kendo-color-editor-md-preview-gap + String + $kendo-color-editor-preview-gap + var(--kendo-spacing-1, 0.25rem) + + +
Description
The spacing between the colors in the medium ColorEditor preview.
+ + + + $kendo-color-editor-lg-preview-gap + String + k-spacing(1) + var(--kendo-spacing-1, 0.25rem) + + +
Description
The spacing between the colors in the large ColorEditor preview.
+ + + + $kendo-color-editor-sm-color-preview-width + Number + 32px + 32px + + +
Description
The width of the small ColorEditor preview.
+ + + + $kendo-color-editor-sm-color-preview-height + Number + 10px + 10px + + +
Description
The height of the small ColorEditor preview.
+ + + + $kendo-color-editor-md-color-preview-width + Number + $kendo-color-editor-color-preview-width + 32px + + +
Description
The width of the medium ColorEditor preview.
+ + + + $kendo-color-editor-md-color-preview-height + Number + $kendo-color-editor-color-preview-height + 12px + + +
Description
The height of the medium ColorEditor preview.
+ + + + $kendo-color-editor-lg-color-preview-width + Number + 32px + 32px + + +
Description
The width of the large ColorEditor preview.
+ + + + $kendo-color-editor-lg-color-preview-height + Number + 12px + 12px + + +
Description
The height of the large ColorEditor preview.
+ + $kendo-color-editor-views-padding-y String @@ -237,6 +417,96 @@ The following table lists the available variables for customization.
Description
The spacing of the ColorEditor views container.
+ + $kendo-color-editor-sm-views-padding-y + String + $kendo-color-editor-spacer + var(--kendo-spacing-4, 1rem) + + +
Description
The vertical padding of the small ColorEditor views container.
+ + + + $kendo-color-editor-sm-views-padding-x + String + $kendo-color-editor-views-padding-y + var(--kendo-spacing-4, 1rem) + + +
Description
The horizontal padding of the small ColorEditor views container.
+ + + + $kendo-color-editor-sm-views-gap + String + $kendo-color-editor-spacer + var(--kendo-spacing-4, 1rem) + + +
Description
The spacing of the small ColorEditor views container.
+ + + + $kendo-color-editor-md-views-padding-y + String + $kendo-color-editor-views-padding-y + var(--kendo-spacing-4, 1rem) + + +
Description
The vertical padding of the medium ColorEditor views container.
+ + + + $kendo-color-editor-md-views-padding-x + String + $kendo-color-editor-views-padding-x + var(--kendo-spacing-4, 1rem) + + +
Description
The horizontal padding of the medium ColorEditor views container.
+ + + + $kendo-color-editor-md-views-gap + String + $kendo-color-editor-views-gap + var(--kendo-spacing-4, 1rem) + + +
Description
The spacing of the medium ColorEditor views container.
+ + + + $kendo-color-editor-lg-views-padding-y + String + k-spacing(4.5) + var(--kendo-spacing-4\.5, 1.125rem) + + +
Description
The vertical padding of the large ColorEditor views container.
+ + + + $kendo-color-editor-lg-views-padding-x + String + k-spacing(4.5) + var(--kendo-spacing-4\.5, 1.125rem) + + +
Description
The horizontal padding of the large ColorEditor views container.
+ + + + $kendo-color-editor-lg-views-gap + String + k-spacing(4.5) + var(--kendo-spacing-4\.5, 1.125rem) + + +
Description
The spacing of the large ColorEditor views container.
+ + $kendo-color-editor-color-gradient-focus-outline-color Color @@ -267,6 +537,48 @@ The following table lists the available variables for customization.
Description
The outline offset of the focused ColorGradient.
+ + $kendo-color-editor-sizes + Map + ( + sm: ( + min-width: $kendo-color-editor-sm-min-width, + header-padding-x: $kendo-color-editor-sm-header-padding-x, + header-padding-y: $kendo-color-editor-sm-header-padding-y, + views-padding-x: $kendo-color-editor-sm-views-padding-x, + views-padding-y: $kendo-color-editor-sm-views-padding-y, + preview-gap: $kendo-color-editor-sm-preview-gap, + preview-width: $kendo-color-editor-sm-color-preview-width, + preview-height: $kendo-color-editor-sm-color-preview-height, + + ), + md: ( + min-width: $kendo-color-editor-md-min-width, + header-padding-x: $kendo-color-editor-md-header-padding-x, + header-padding-y: $kendo-color-editor-md-header-padding-y, + views-padding-x: $kendo-color-editor-md-views-padding-x, + views-padding-y: $kendo-color-editor-md-views-padding-y, + preview-gap: $kendo-color-editor-md-preview-gap, + preview-width: $kendo-color-editor-md-color-preview-width, + preview-height: $kendo-color-editor-md-color-preview-height, + ), + lg: ( + min-width: $kendo-color-editor-lg-min-width, + header-padding-x: $kendo-color-editor-lg-header-padding-x, + header-padding-y: $kendo-color-editor-lg-header-padding-y, + views-padding-x: $kendo-color-editor-lg-views-padding-x, + views-padding-y: $kendo-color-editor-lg-views-padding-y, + preview-gap: $kendo-color-editor-lg-preview-gap, + preview-width: $kendo-color-editor-lg-color-preview-width, + preview-height: $kendo-color-editor-lg-color-preview-height, + ) +) + + + +
Description
The size map of the ColorEditor.
+ + diff --git a/packages/bootstrap/docs/customization-color-gradient.md b/packages/bootstrap/docs/customization-color-gradient.md index ee749229647..fe0e30c1b74 100644 --- a/packages/bootstrap/docs/customization-color-gradient.md +++ b/packages/bootstrap/docs/customization-color-gradient.md @@ -157,6 +157,66 @@ The following table lists the available variables for customization.
Description
The border color of the ColorGradient.
+ + $kendo-color-gradient-sm-width + Number + 266px + 266px + + +
Description
The width of the small ColorGradient.
+ + + + $kendo-color-gradient-md-width + Number + $kendo-color-gradient-width + 328px + + +
Description
The width of the medium ColorGradient.
+ + + + $kendo-color-gradient-lg-width + Number + 362px + 362px + + +
Description
The width of the large ColorGradient.
+ + + + $kendo-color-gradient-sm-gap + String + $kendo-color-gradient-gap + var(--kendo-spacing-4, 1rem) + + +
Description
The spacing between the sections of the small ColorGradient.
+ + + + $kendo-color-gradient-md-gap + String + $kendo-color-gradient-gap + var(--kendo-spacing-4, 1rem) + + +
Description
The spacing between the sections of the medium ColorGradient.
+ + + + $kendo-color-gradient-lg-gap + String + k-spacing(4.5) + var(--kendo-spacing-4\.5, 1.125rem) + + +
Description
The spacing between the sections of the large ColorGradient.
+ + $kendo-color-gradient-focus-border String @@ -207,6 +267,66 @@ The following table lists the available variables for customization.
Description
The height the ColorGradient canvas hsv rectangle.
+ + $kendo-color-gradient-sm-canvas-rectangle-height + Number + 186px + 186px + + +
Description
The height the small ColorGradient canvas hsv rectangle.
+ + + + $kendo-color-gradient-md-canvas-rectangle-height + Number + $kendo-color-gradient-canvas-rectangle-height + 180px + + +
Description
The height the medium ColorGradient canvas hsv rectangle.
+ + + + $kendo-color-gradient-lg-canvas-rectangle-height + Number + 268px + 268px + + +
Description
The height the large ColorGradient canvas hsv rectangle.
+ + + + $kendo-color-gradient-sm-canvas-gap + String + k-spacing(3) + var(--kendo-spacing-3, 0.75rem) + + +
Description
The spacing between the items of the small ColorGradient canvas.
+ + + + $kendo-color-gradient-md-canvas-gap + String + $kendo-color-gradient-canvas-gap + var(--kendo-spacing-3, 0.75rem) + + +
Description
The spacing between the items of the medium ColorGradient canvas.
+ + + + $kendo-color-gradient-lg-canvas-gap + String + k-spacing(4.5) + var(--kendo-spacing-4\.5, 1.125rem) + + +
Description
The spacing between the items of the large ColorGradient canvas.
+ + $kendo-color-gradient-slider-track-size Number @@ -267,6 +387,36 @@ The following table lists the available variables for customization.
Description
The background image of the ColorGradient alpha slider.
+ + $kendo-color-gradient-sm-slider-vertical-size + Number + 186px + 186px + + +
Description
The height of the small ColorGradient vertical slider.
+ + + + $kendo-color-gradient-md-slider-vertical-size + Number + $kendo-color-gradient-slider-vertical-size + 180px + + +
Description
The height of the medium ColorGradient vertical slider.
+ + + + $kendo-color-gradient-lg-slider-vertical-size + Number + 268px + 268px + + +
Description
The height of the large ColorGradient vertical slider.
+ + $kendo-color-gradient-draghandle-width Number @@ -437,6 +587,36 @@ The following table lists the available variables for customization.
Description
The text color of the ColorGradient input labels.
+ + $kendo-color-gradient-sm-input-width + Number + 42px + 42px + + +
Description
The width of the small ColorGradient input.
+ + + + $kendo-color-gradient-md-input-width + Number + $kendo-color-gradient-input-width + 56px + + +
Description
The width of the medium ColorGradient input.
+ + + + $kendo-color-gradient-lg-input-width + Number + 62.5px + 62.5px + + +
Description
The width of the large ColorGradient input.
+ + $kendo-color-gradient-contrast-ratio-font-weight String @@ -457,6 +637,41 @@ The following table lists the available variables for customization.
Description
The spacing between the items in the ColorGradient contrast tool.
+ + $kendo-color-gradient-sizes + Map + ( + sm: ( + width: $kendo-color-gradient-sm-width, + vertical-slider-height: $kendo-color-gradient-sm-slider-vertical-size, + rectangle-height: $kendo-color-gradient-sm-canvas-rectangle-height, + input-width: $kendo-color-gradient-sm-input-width, + gap: $kendo-color-gradient-sm-gap, + canvas-gap: $kendo-color-gradient-sm-canvas-gap + ), + md: ( + width: $kendo-color-gradient-md-width, + vertical-slider-height: $kendo-color-gradient-md-slider-vertical-size, + rectangle-height: $kendo-color-gradient-md-canvas-rectangle-height, + input-width: $kendo-color-gradient-md-input-width, + gap: $kendo-color-gradient-md-gap, + canvas-gap: $kendo-color-gradient-md-canvas-gap + ), + lg: ( + width: $kendo-color-gradient-lg-width, + vertical-slider-height: $kendo-color-gradient-lg-slider-vertical-size, + rectangle-height: $kendo-color-gradient-lg-canvas-rectangle-height, + input-width: $kendo-color-gradient-lg-input-width, + gap: $kendo-color-gradient-lg-gap, + canvas-gap: $kendo-color-gradient-lg-canvas-gap + ) +) + + + +
Description
The size map of the ColorGradient.
+ + diff --git a/packages/bootstrap/docs/customization-color-palette.md b/packages/bootstrap/docs/customization-color-palette.md index a02df9dee08..5329e631586 100644 --- a/packages/bootstrap/docs/customization-color-palette.md +++ b/packages/bootstrap/docs/customization-color-palette.md @@ -77,6 +77,66 @@ The following table lists the available variables for customization.
Description
The height of the ColorPalette tile.
+ + $kendo-color-palette-tile-sm-width + String + k-spacing(5.5) + var(--kendo-spacing-5\.5, 1.375rem) + + + + + + + $kendo-color-palette-tile-sm-height + String + $kendo-color-palette-tile-sm-width + var(--kendo-spacing-5\.5, 1.375rem) + + +
Description
The height of the small ColorPalette tile.
+ + + + $kendo-color-palette-tile-md-width + String + $kendo-color-palette-tile-width + var(--kendo-spacing-6, 1.5rem) + + +
Description
The width of the medium ColorPalette tile.
+ + + + $kendo-color-palette-tile-md-height + String + $kendo-color-palette-tile-height + var(--kendo-spacing-6, 1.5rem) + + +
Description
The height of the medium ColorPalette tile.
+ + + + $kendo-color-palette-tile-lg-width + String + k-spacing(8) + var(--kendo-spacing-8, 2rem) + + +
Description
The width of the large ColorPalette tile.
+ + + + $kendo-color-palette-tile-lg-height + String + $kendo-color-palette-tile-lg-width + var(--kendo-spacing-8, 2rem) + + +
Description
The height of the large ColorPalette tile.
+ + $kendo-color-palette-tile-focus-shadow List @@ -107,6 +167,29 @@ The following table lists the available variables for customization.
Description
The shadow of the ColorPalette selected tile.
+ + $kendo-color-palette-sizes + Map + ( + sm: ( + width: $kendo-color-palette-tile-sm-width, + height: $kendo-color-palette-tile-sm-height + ), + md: ( + width: $kendo-color-palette-tile-md-width, + height: $kendo-color-palette-tile-md-height + ), + lg: ( + width: $kendo-color-palette-tile-lg-width, + height: $kendo-color-palette-tile-lg-height + ) +) + + + +
Description
The size map of the ColorPalette.
+ + diff --git a/packages/bootstrap/docs/customization.md b/packages/bootstrap/docs/customization.md index 291442d0bce..31fefdc4c3f 100644 --- a/packages/bootstrap/docs/customization.md +++ b/packages/bootstrap/docs/customization.md @@ -7109,6 +7109,36 @@ The following table lists the available variables for customizing the Bootstrap
Description
The minimum width of the ColorEditor.
+ + $kendo-color-editor-sm-min-width + Number + 252px + 252px + + +
Description
The minimum width of the ColorEditor.
+ + + + $kendo-color-editor-md-min-width + Number + $kendo-color-editor-min-width + 328px + + +
Description
The minimum width of the ColorEditor.
+ + + + $kendo-color-editor-lg-min-width + Number + 362px + 362px + + +
Description
The minimum width of the ColorEditor.
+ + $kendo-color-editor-border-width Number @@ -7239,6 +7269,66 @@ The following table lists the available variables for customizing the Bootstrap
Description
The spacing between the ColorEditor header actions.
+ + $kendo-color-editor-sm-header-padding-y + String + $kendo-color-editor-header-padding-y + var(--kendo-spacing-4, 1rem) + + +
Description
The vertical padding of the small ColorEditor header.
+ + + + $kendo-color-editor-sm-header-padding-x + String + $kendo-color-editor-header-padding-x + var(--kendo-spacing-4, 1rem) + + +
Description
The horizontal padding of the small ColorEditor header.
+ + + + $kendo-color-editor-md-header-padding-y + String + $kendo-color-editor-header-padding-y + var(--kendo-spacing-4, 1rem) + + +
Description
The vertical padding of the medium ColorEditor header.
+ + + + $kendo-color-editor-md-header-padding-x + String + $kendo-color-editor-header-padding-x + var(--kendo-spacing-4, 1rem) + + +
Description
The horizontal padding of the medium ColorEditor header.
+ + + + $kendo-color-editor-lg-header-padding-y + String + k-spacing(4.5) + var(--kendo-spacing-4\.5, 1.125rem) + + +
Description
The vertical padding of the large ColorEditor header.
+ + + + $kendo-color-editor-lg-header-padding-x + String + k-spacing(4.5) + var(--kendo-spacing-4\.5, 1.125rem) + + +
Description
The horizontal padding of the large ColorEditor header.
+ + $kendo-color-editor-color-preview-width Number @@ -7269,6 +7359,96 @@ The following table lists the available variables for customizing the Bootstrap
Description
The spacing between the colors in the ColorEditor preview.
+ + $kendo-color-editor-sm-preview-gap + String + k-spacing(1) + var(--kendo-spacing-1, 0.25rem) + + +
Description
The spacing between the colors in the small ColorEditor preview.
+ + + + $kendo-color-editor-md-preview-gap + String + $kendo-color-editor-preview-gap + var(--kendo-spacing-1, 0.25rem) + + +
Description
The spacing between the colors in the medium ColorEditor preview.
+ + + + $kendo-color-editor-lg-preview-gap + String + k-spacing(1) + var(--kendo-spacing-1, 0.25rem) + + +
Description
The spacing between the colors in the large ColorEditor preview.
+ + + + $kendo-color-editor-sm-color-preview-width + Number + 32px + 32px + + +
Description
The width of the small ColorEditor preview.
+ + + + $kendo-color-editor-sm-color-preview-height + Number + 10px + 10px + + +
Description
The height of the small ColorEditor preview.
+ + + + $kendo-color-editor-md-color-preview-width + Number + $kendo-color-editor-color-preview-width + 32px + + +
Description
The width of the medium ColorEditor preview.
+ + + + $kendo-color-editor-md-color-preview-height + Number + $kendo-color-editor-color-preview-height + 12px + + +
Description
The height of the medium ColorEditor preview.
+ + + + $kendo-color-editor-lg-color-preview-width + Number + 32px + 32px + + +
Description
The width of the large ColorEditor preview.
+ + + + $kendo-color-editor-lg-color-preview-height + Number + 12px + 12px + + +
Description
The height of the large ColorEditor preview.
+ + $kendo-color-editor-views-padding-y String @@ -7299,6 +7479,96 @@ The following table lists the available variables for customizing the Bootstrap
Description
The spacing of the ColorEditor views container.
+ + $kendo-color-editor-sm-views-padding-y + String + $kendo-color-editor-spacer + var(--kendo-spacing-4, 1rem) + + +
Description
The vertical padding of the small ColorEditor views container.
+ + + + $kendo-color-editor-sm-views-padding-x + String + $kendo-color-editor-views-padding-y + var(--kendo-spacing-4, 1rem) + + +
Description
The horizontal padding of the small ColorEditor views container.
+ + + + $kendo-color-editor-sm-views-gap + String + $kendo-color-editor-spacer + var(--kendo-spacing-4, 1rem) + + +
Description
The spacing of the small ColorEditor views container.
+ + + + $kendo-color-editor-md-views-padding-y + String + $kendo-color-editor-views-padding-y + var(--kendo-spacing-4, 1rem) + + +
Description
The vertical padding of the medium ColorEditor views container.
+ + + + $kendo-color-editor-md-views-padding-x + String + $kendo-color-editor-views-padding-x + var(--kendo-spacing-4, 1rem) + + +
Description
The horizontal padding of the medium ColorEditor views container.
+ + + + $kendo-color-editor-md-views-gap + String + $kendo-color-editor-views-gap + var(--kendo-spacing-4, 1rem) + + +
Description
The spacing of the medium ColorEditor views container.
+ + + + $kendo-color-editor-lg-views-padding-y + String + k-spacing(4.5) + var(--kendo-spacing-4\.5, 1.125rem) + + +
Description
The vertical padding of the large ColorEditor views container.
+ + + + $kendo-color-editor-lg-views-padding-x + String + k-spacing(4.5) + var(--kendo-spacing-4\.5, 1.125rem) + + +
Description
The horizontal padding of the large ColorEditor views container.
+ + + + $kendo-color-editor-lg-views-gap + String + k-spacing(4.5) + var(--kendo-spacing-4\.5, 1.125rem) + + +
Description
The spacing of the large ColorEditor views container.
+ + $kendo-color-editor-color-gradient-focus-outline-color Color @@ -7329,6 +7599,48 @@ The following table lists the available variables for customizing the Bootstrap
Description
The outline offset of the focused ColorGradient.
+ + $kendo-color-editor-sizes + Map + ( + sm: ( + min-width: $kendo-color-editor-sm-min-width, + header-padding-x: $kendo-color-editor-sm-header-padding-x, + header-padding-y: $kendo-color-editor-sm-header-padding-y, + views-padding-x: $kendo-color-editor-sm-views-padding-x, + views-padding-y: $kendo-color-editor-sm-views-padding-y, + preview-gap: $kendo-color-editor-sm-preview-gap, + preview-width: $kendo-color-editor-sm-color-preview-width, + preview-height: $kendo-color-editor-sm-color-preview-height, + + ), + md: ( + min-width: $kendo-color-editor-md-min-width, + header-padding-x: $kendo-color-editor-md-header-padding-x, + header-padding-y: $kendo-color-editor-md-header-padding-y, + views-padding-x: $kendo-color-editor-md-views-padding-x, + views-padding-y: $kendo-color-editor-md-views-padding-y, + preview-gap: $kendo-color-editor-md-preview-gap, + preview-width: $kendo-color-editor-md-color-preview-width, + preview-height: $kendo-color-editor-md-color-preview-height, + ), + lg: ( + min-width: $kendo-color-editor-lg-min-width, + header-padding-x: $kendo-color-editor-lg-header-padding-x, + header-padding-y: $kendo-color-editor-lg-header-padding-y, + views-padding-x: $kendo-color-editor-lg-views-padding-x, + views-padding-y: $kendo-color-editor-lg-views-padding-y, + preview-gap: $kendo-color-editor-lg-preview-gap, + preview-width: $kendo-color-editor-lg-color-preview-width, + preview-height: $kendo-color-editor-lg-color-preview-height, + ) +) + + + +
Description
The size map of the ColorEditor.
+ + @@ -7479,6 +7791,66 @@ The following table lists the available variables for customizing the Bootstrap
Description
The border color of the ColorGradient.
+ + $kendo-color-gradient-sm-width + Number + 266px + 266px + + +
Description
The width of the small ColorGradient.
+ + + + $kendo-color-gradient-md-width + Number + $kendo-color-gradient-width + 328px + + +
Description
The width of the medium ColorGradient.
+ + + + $kendo-color-gradient-lg-width + Number + 362px + 362px + + +
Description
The width of the large ColorGradient.
+ + + + $kendo-color-gradient-sm-gap + String + $kendo-color-gradient-gap + var(--kendo-spacing-4, 1rem) + + +
Description
The spacing between the sections of the small ColorGradient.
+ + + + $kendo-color-gradient-md-gap + String + $kendo-color-gradient-gap + var(--kendo-spacing-4, 1rem) + + +
Description
The spacing between the sections of the medium ColorGradient.
+ + + + $kendo-color-gradient-lg-gap + String + k-spacing(4.5) + var(--kendo-spacing-4\.5, 1.125rem) + + +
Description
The spacing between the sections of the large ColorGradient.
+ + $kendo-color-gradient-focus-border String @@ -7529,6 +7901,66 @@ The following table lists the available variables for customizing the Bootstrap
Description
The height the ColorGradient canvas hsv rectangle.
+ + $kendo-color-gradient-sm-canvas-rectangle-height + Number + 186px + 186px + + +
Description
The height the small ColorGradient canvas hsv rectangle.
+ + + + $kendo-color-gradient-md-canvas-rectangle-height + Number + $kendo-color-gradient-canvas-rectangle-height + 180px + + +
Description
The height the medium ColorGradient canvas hsv rectangle.
+ + + + $kendo-color-gradient-lg-canvas-rectangle-height + Number + 268px + 268px + + +
Description
The height the large ColorGradient canvas hsv rectangle.
+ + + + $kendo-color-gradient-sm-canvas-gap + String + k-spacing(3) + var(--kendo-spacing-3, 0.75rem) + + +
Description
The spacing between the items of the small ColorGradient canvas.
+ + + + $kendo-color-gradient-md-canvas-gap + String + $kendo-color-gradient-canvas-gap + var(--kendo-spacing-3, 0.75rem) + + +
Description
The spacing between the items of the medium ColorGradient canvas.
+ + + + $kendo-color-gradient-lg-canvas-gap + String + k-spacing(4.5) + var(--kendo-spacing-4\.5, 1.125rem) + + +
Description
The spacing between the items of the large ColorGradient canvas.
+ + $kendo-color-gradient-slider-track-size Number @@ -7589,6 +8021,36 @@ The following table lists the available variables for customizing the Bootstrap
Description
The background image of the ColorGradient alpha slider.
+ + $kendo-color-gradient-sm-slider-vertical-size + Number + 186px + 186px + + +
Description
The height of the small ColorGradient vertical slider.
+ + + + $kendo-color-gradient-md-slider-vertical-size + Number + $kendo-color-gradient-slider-vertical-size + 180px + + +
Description
The height of the medium ColorGradient vertical slider.
+ + + + $kendo-color-gradient-lg-slider-vertical-size + Number + 268px + 268px + + +
Description
The height of the large ColorGradient vertical slider.
+ + $kendo-color-gradient-draghandle-width Number @@ -7759,6 +8221,36 @@ The following table lists the available variables for customizing the Bootstrap
Description
The text color of the ColorGradient input labels.
+ + $kendo-color-gradient-sm-input-width + Number + 42px + 42px + + +
Description
The width of the small ColorGradient input.
+ + + + $kendo-color-gradient-md-input-width + Number + $kendo-color-gradient-input-width + 56px + + +
Description
The width of the medium ColorGradient input.
+ + + + $kendo-color-gradient-lg-input-width + Number + 62.5px + 62.5px + + +
Description
The width of the large ColorGradient input.
+ + $kendo-color-gradient-contrast-ratio-font-weight String @@ -7779,6 +8271,41 @@ The following table lists the available variables for customizing the Bootstrap
Description
The spacing between the items in the ColorGradient contrast tool.
+ + $kendo-color-gradient-sizes + Map + ( + sm: ( + width: $kendo-color-gradient-sm-width, + vertical-slider-height: $kendo-color-gradient-sm-slider-vertical-size, + rectangle-height: $kendo-color-gradient-sm-canvas-rectangle-height, + input-width: $kendo-color-gradient-sm-input-width, + gap: $kendo-color-gradient-sm-gap, + canvas-gap: $kendo-color-gradient-sm-canvas-gap + ), + md: ( + width: $kendo-color-gradient-md-width, + vertical-slider-height: $kendo-color-gradient-md-slider-vertical-size, + rectangle-height: $kendo-color-gradient-md-canvas-rectangle-height, + input-width: $kendo-color-gradient-md-input-width, + gap: $kendo-color-gradient-md-gap, + canvas-gap: $kendo-color-gradient-md-canvas-gap + ), + lg: ( + width: $kendo-color-gradient-lg-width, + vertical-slider-height: $kendo-color-gradient-lg-slider-vertical-size, + rectangle-height: $kendo-color-gradient-lg-canvas-rectangle-height, + input-width: $kendo-color-gradient-lg-input-width, + gap: $kendo-color-gradient-lg-gap, + canvas-gap: $kendo-color-gradient-lg-canvas-gap + ) +) + + + +
Description
The size map of the ColorGradient.
+ + @@ -7849,6 +8376,66 @@ The following table lists the available variables for customizing the Bootstrap
Description
The height of the ColorPalette tile.
+ + $kendo-color-palette-tile-sm-width + String + k-spacing(5.5) + var(--kendo-spacing-5\.5, 1.375rem) + + + + + + + $kendo-color-palette-tile-sm-height + String + $kendo-color-palette-tile-sm-width + var(--kendo-spacing-5\.5, 1.375rem) + + +
Description
The height of the small ColorPalette tile.
+ + + + $kendo-color-palette-tile-md-width + String + $kendo-color-palette-tile-width + var(--kendo-spacing-6, 1.5rem) + + +
Description
The width of the medium ColorPalette tile.
+ + + + $kendo-color-palette-tile-md-height + String + $kendo-color-palette-tile-height + var(--kendo-spacing-6, 1.5rem) + + +
Description
The height of the medium ColorPalette tile.
+ + + + $kendo-color-palette-tile-lg-width + String + k-spacing(8) + var(--kendo-spacing-8, 2rem) + + +
Description
The width of the large ColorPalette tile.
+ + + + $kendo-color-palette-tile-lg-height + String + $kendo-color-palette-tile-lg-width + var(--kendo-spacing-8, 2rem) + + +
Description
The height of the large ColorPalette tile.
+ + $kendo-color-palette-tile-focus-shadow List @@ -7879,6 +8466,29 @@ The following table lists the available variables for customizing the Bootstrap
Description
The shadow of the ColorPalette selected tile.
+ + $kendo-color-palette-sizes + Map + ( + sm: ( + width: $kendo-color-palette-tile-sm-width, + height: $kendo-color-palette-tile-sm-height + ), + md: ( + width: $kendo-color-palette-tile-md-width, + height: $kendo-color-palette-tile-md-height + ), + lg: ( + width: $kendo-color-palette-tile-lg-width, + height: $kendo-color-palette-tile-lg-height + ) +) + + + +
Description
The size map of the ColorPalette.
+ + diff --git a/packages/classic/docs/customization-color-editor.md b/packages/classic/docs/customization-color-editor.md index 17e4fcb69a5..443452b3812 100644 --- a/packages/classic/docs/customization-color-editor.md +++ b/packages/classic/docs/customization-color-editor.md @@ -47,6 +47,36 @@ The following table lists the available variables for customization.
Description
The minimum width of the ColorEditor.
+ + $kendo-color-editor-sm-min-width + Number + 252px + 252px + + +
Description
The minimum width of the ColorEditor.
+ + + + $kendo-color-editor-md-min-width + Number + $kendo-color-editor-min-width + 272px + + +
Description
The minimum width of the ColorEditor.
+ + + + $kendo-color-editor-lg-min-width + Number + 362px + 362px + + +
Description
The minimum width of the ColorEditor.
+ + $kendo-color-editor-border-width Number @@ -169,14 +199,74 @@ The following table lists the available variables for customization. $kendo-color-editor-header-actions-gap - Calculation - calc( #{$kendo-color-editor-spacer} / 1.5 ) - calc(var(--kendo-spacing-3, 0.75rem) / 1.5) + String + k-spacing(2) + var(--kendo-spacing-2, 0.5rem)
Description
The spacing between the ColorEditor header actions.
+ + $kendo-color-editor-sm-header-padding-y + String + $kendo-color-editor-header-padding-y + var(--kendo-spacing-3, 0.75rem) + + +
Description
The vertical padding of the small ColorEditor header.
+ + + + $kendo-color-editor-sm-header-padding-x + String + $kendo-color-editor-header-padding-x + var(--kendo-spacing-3, 0.75rem) + + +
Description
The horizontal padding of the small ColorEditor header.
+ + + + $kendo-color-editor-md-header-padding-y + String + $kendo-color-editor-header-padding-y + var(--kendo-spacing-3, 0.75rem) + + +
Description
The vertical padding of the medium ColorEditor header.
+ + + + $kendo-color-editor-md-header-padding-x + String + $kendo-color-editor-header-padding-x + var(--kendo-spacing-3, 0.75rem) + + +
Description
The horizontal padding of the medium ColorEditor header.
+ + + + $kendo-color-editor-lg-header-padding-y + String + k-spacing(4.5) + var(--kendo-spacing-4\.5, 1.125rem) + + +
Description
The vertical padding of the large ColorEditor header.
+ + + + $kendo-color-editor-lg-header-padding-x + String + k-spacing(4.5) + var(--kendo-spacing-4\.5, 1.125rem) + + +
Description
The horizontal padding of the large ColorEditor header.
+ + $kendo-color-editor-color-preview-width Number @@ -207,6 +297,96 @@ The following table lists the available variables for customization.
Description
The spacing between the colors in the ColorEditor preview.
+ + $kendo-color-editor-sm-preview-gap + String + k-spacing(0.5) + var(--kendo-spacing-0\.5, 0.125rem) + + +
Description
The spacing between the colors in the small ColorEditor preview.
+ + + + $kendo-color-editor-md-preview-gap + String + $kendo-color-editor-preview-gap + var(--kendo-spacing-1, 0.25rem) + + +
Description
The spacing between the colors in the medium ColorEditor preview.
+ + + + $kendo-color-editor-lg-preview-gap + String + k-spacing(1) + var(--kendo-spacing-1, 0.25rem) + + +
Description
The spacing between the colors in the large ColorEditor preview.
+ + + + $kendo-color-editor-sm-color-preview-width + Number + 34px + 34px + + +
Description
The width of the small ColorEditor preview.
+ + + + $kendo-color-editor-sm-color-preview-height + Number + 12px + 12px + + +
Description
The height of the small ColorEditor preview.
+ + + + $kendo-color-editor-md-color-preview-width + Number + $kendo-color-editor-color-preview-width + 32px + + +
Description
The width of the medium ColorEditor preview.
+ + + + $kendo-color-editor-md-color-preview-height + Number + $kendo-color-editor-color-preview-height + 12px + + +
Description
The height of the medium ColorEditor preview.
+ + + + $kendo-color-editor-lg-color-preview-width + Number + 44px + 44px + + +
Description
The width of the large ColorEditor preview.
+ + + + $kendo-color-editor-lg-color-preview-height + Number + 16px + 16px + + +
Description
The height of the large ColorEditor preview.
+ + $kendo-color-editor-views-padding-y String @@ -237,6 +417,96 @@ The following table lists the available variables for customization.
Description
The spacing of the ColorEditor views container.
+ + $kendo-color-editor-sm-views-padding-y + String + $kendo-color-editor-spacer + var(--kendo-spacing-3, 0.75rem) + + +
Description
The vertical padding of the small ColorEditor views container.
+ + + + $kendo-color-editor-sm-views-padding-x + String + $kendo-color-editor-views-padding-y + var(--kendo-spacing-3, 0.75rem) + + +
Description
The horizontal padding of the small ColorEditor views container.
+ + + + $kendo-color-editor-sm-views-gap + String + $kendo-color-editor-spacer + var(--kendo-spacing-3, 0.75rem) + + +
Description
The spacing of the small ColorEditor views container.
+ + + + $kendo-color-editor-md-views-padding-y + String + $kendo-color-editor-views-padding-y + var(--kendo-spacing-3, 0.75rem) + + +
Description
The vertical padding of the medium ColorEditor views container.
+ + + + $kendo-color-editor-md-views-padding-x + String + $kendo-color-editor-views-padding-x + var(--kendo-spacing-3, 0.75rem) + + +
Description
The horizontal padding of the medium ColorEditor views container.
+ + + + $kendo-color-editor-md-views-gap + String + $kendo-color-editor-views-gap + var(--kendo-spacing-3, 0.75rem) + + +
Description
The spacing of the medium ColorEditor views container.
+ + + + $kendo-color-editor-lg-views-padding-y + String + k-spacing(4.5) + var(--kendo-spacing-4\.5, 1.125rem) + + +
Description
The vertical padding of the large ColorEditor views container.
+ + + + $kendo-color-editor-lg-views-padding-x + String + k-spacing(4.5) + var(--kendo-spacing-4\.5, 1.125rem) + + +
Description
The horizontal padding of the large ColorEditor views container.
+ + + + $kendo-color-editor-lg-views-gap + String + k-spacing(4.5) + var(--kendo-spacing-4\.5, 1.125rem) + + +
Description
The spacing of the large ColorEditor views container.
+ + $kendo-color-editor-color-gradient-focus-outline-color Color @@ -267,6 +537,48 @@ The following table lists the available variables for customization.
Description
The outline offset of the focused ColorGradient.
+ + $kendo-color-editor-sizes + Map + ( + sm: ( + min-width: $kendo-color-editor-sm-min-width, + header-padding-x: $kendo-color-editor-sm-header-padding-x, + header-padding-y: $kendo-color-editor-sm-header-padding-y, + views-padding-x: $kendo-color-editor-sm-views-padding-x, + views-padding-y: $kendo-color-editor-sm-views-padding-y, + preview-gap: $kendo-color-editor-sm-preview-gap, + preview-width: $kendo-color-editor-sm-color-preview-width, + preview-height: $kendo-color-editor-sm-color-preview-height, + + ), + md: ( + min-width: $kendo-color-editor-md-min-width, + header-padding-x: $kendo-color-editor-md-header-padding-x, + header-padding-y: $kendo-color-editor-md-header-padding-y, + views-padding-x: $kendo-color-editor-md-views-padding-x, + views-padding-y: $kendo-color-editor-md-views-padding-y, + preview-gap: $kendo-color-editor-md-preview-gap, + preview-width: $kendo-color-editor-md-color-preview-width, + preview-height: $kendo-color-editor-md-color-preview-height, + ), + lg: ( + min-width: $kendo-color-editor-lg-min-width, + header-padding-x: $kendo-color-editor-lg-header-padding-x, + header-padding-y: $kendo-color-editor-lg-header-padding-y, + views-padding-x: $kendo-color-editor-lg-views-padding-x, + views-padding-y: $kendo-color-editor-lg-views-padding-y, + preview-gap: $kendo-color-editor-lg-preview-gap, + preview-width: $kendo-color-editor-lg-color-preview-width, + preview-height: $kendo-color-editor-lg-color-preview-height, + ) +) + + + +
Description
The size map of the ColorEditor.
+ + diff --git a/packages/classic/docs/customization-color-gradient.md b/packages/classic/docs/customization-color-gradient.md index d24e288f1d6..181d659befd 100644 --- a/packages/classic/docs/customization-color-gradient.md +++ b/packages/classic/docs/customization-color-gradient.md @@ -157,6 +157,66 @@ The following table lists the available variables for customization.
Description
The border color of the ColorGradient.
+ + $kendo-color-gradient-sm-width + Number + 226px + 226px + + +
Description
The width of the small ColorGradient.
+ + + + $kendo-color-gradient-md-width + Number + $kendo-color-gradient-width + 272px + + +
Description
The width of the medium ColorGradient.
+ + + + $kendo-color-gradient-lg-width + Number + 324px + 324px + + +
Description
The width of the large ColorGradient.
+ + + + $kendo-color-gradient-sm-gap + String + $kendo-color-gradient-gap + var(--kendo-spacing-3, 0.75rem) + + +
Description
The spacing between the sections of the small ColorGradient.
+ + + + $kendo-color-gradient-md-gap + String + $kendo-color-gradient-gap + var(--kendo-spacing-3, 0.75rem) + + +
Description
The spacing between the sections of the medium ColorGradient.
+ + + + $kendo-color-gradient-lg-gap + String + k-spacing(4.5) + var(--kendo-spacing-4\.5, 1.125rem) + + +
Description
The spacing between the sections of the large ColorGradient.
+ + $kendo-color-gradient-focus-border Null @@ -207,6 +267,66 @@ The following table lists the available variables for customization.
Description
The height the ColorGradient canvas hsv rectangle.
+ + $kendo-color-gradient-sm-canvas-rectangle-height + Number + 182px + 182px + + +
Description
The height the small ColorGradient canvas hsv rectangle.
+ + + + $kendo-color-gradient-md-canvas-rectangle-height + Number + $kendo-color-gradient-canvas-rectangle-height + 180px + + +
Description
The height the medium ColorGradient canvas hsv rectangle.
+ + + + $kendo-color-gradient-lg-canvas-rectangle-height + Number + 268px + 268px + + +
Description
The height the large ColorGradient canvas hsv rectangle.
+ + + + $kendo-color-gradient-sm-canvas-gap + String + $kendo-color-gradient-canvas-gap + var(--kendo-spacing-3, 0.75rem) + + +
Description
The spacing between the items of the small ColorGradient canvas.
+ + + + $kendo-color-gradient-md-canvas-gap + String + $kendo-color-gradient-canvas-gap + var(--kendo-spacing-3, 0.75rem) + + +
Description
The spacing between the items of the medium ColorGradient canvas.
+ + + + $kendo-color-gradient-lg-canvas-gap + String + k-spacing(4.5) + var(--kendo-spacing-4\.5, 1.125rem) + + +
Description
The spacing between the items of the large ColorGradient canvas.
+ + $kendo-color-gradient-slider-track-size Number @@ -267,6 +387,36 @@ The following table lists the available variables for customization.
Description
The background image of the ColorGradient alpha slider.
+ + $kendo-color-gradient-sm-slider-vertical-size + Number + 182px + 182px + + +
Description
The height of the small ColorGradient vertical slider.
+ + + + $kendo-color-gradient-md-slider-vertical-size + Number + $kendo-color-gradient-slider-vertical-size + 180px + + +
Description
The height of the medium ColorGradient vertical slider.
+ + + + $kendo-color-gradient-lg-slider-vertical-size + Number + 268px + 268px + + +
Description
The height of the large ColorGradient vertical slider.
+ + $kendo-color-gradient-draghandle-width Number @@ -409,9 +559,9 @@ The following table lists the available variables for customization. $kendo-color-gradient-input-gap - Calculation - calc( #{$kendo-color-gradient-spacer} / 1.5 ) - calc(var(--kendo-spacing-3, 0.75rem) / 1.5) + String + k-spacing(2) + var(--kendo-spacing-2, 0.5rem)
Description
The spacing between the ColorGradient inputs.
@@ -437,6 +587,36 @@ The following table lists the available variables for customization.
Description
The text color of the ColorGradient input labels.
+ + $kendo-color-gradient-sm-input-width + Number + 42px + 42px + + +
Description
The width of the small ColorGradient input.
+ + + + $kendo-color-gradient-md-input-width + Number + $kendo-color-gradient-input-width + 46px + + +
Description
The width of the medium ColorGradient input.
+ + + + $kendo-color-gradient-lg-input-width + Number + 62.5px + 62.5px + + +
Description
The width of the large ColorGradient input.
+ + $kendo-color-gradient-contrast-ratio-font-weight String @@ -457,6 +637,41 @@ The following table lists the available variables for customization.
Description
The spacing between the items in the ColorGradient contrast tool.
+ + $kendo-color-gradient-sizes + Map + ( + sm: ( + width: $kendo-color-gradient-sm-width, + vertical-slider-height: $kendo-color-gradient-sm-slider-vertical-size, + rectangle-height: $kendo-color-gradient-sm-canvas-rectangle-height, + input-width: $kendo-color-gradient-sm-input-width, + gap: $kendo-color-gradient-sm-gap, + canvas-gap: $kendo-color-gradient-sm-canvas-gap + ), + md: ( + width: $kendo-color-gradient-md-width, + vertical-slider-height: $kendo-color-gradient-md-slider-vertical-size, + rectangle-height: $kendo-color-gradient-md-canvas-rectangle-height, + input-width: $kendo-color-gradient-md-input-width, + gap: $kendo-color-gradient-md-gap, + canvas-gap: $kendo-color-gradient-md-canvas-gap + ), + lg: ( + width: $kendo-color-gradient-lg-width, + vertical-slider-height: $kendo-color-gradient-lg-slider-vertical-size, + rectangle-height: $kendo-color-gradient-lg-canvas-rectangle-height, + input-width: $kendo-color-gradient-lg-input-width, + gap: $kendo-color-gradient-lg-gap, + canvas-gap: $kendo-color-gradient-lg-canvas-gap + ) +) + + + +
Description
The size map of the ColorGradient.
+ + diff --git a/packages/classic/docs/customization-color-palette.md b/packages/classic/docs/customization-color-palette.md index 75093867af5..9625d37865c 100644 --- a/packages/classic/docs/customization-color-palette.md +++ b/packages/classic/docs/customization-color-palette.md @@ -77,6 +77,66 @@ The following table lists the available variables for customization.
Description
The height of the ColorPalette tile.
+ + $kendo-color-palette-tile-sm-width + String + k-spacing(5.5) + var(--kendo-spacing-5\.5, 1.375rem) + + +
Description
The width of the small ColorPalette tile.
+ + + + $kendo-color-palette-tile-sm-height + String + $kendo-color-palette-tile-sm-width + var(--kendo-spacing-5\.5, 1.375rem) + + +
Description
The height of the small ColorPalette tile.
+ + + + $kendo-color-palette-tile-md-width + String + $kendo-color-palette-tile-width + var(--kendo-spacing-6, 1.5rem) + + +
Description
The width of the medium ColorPalette tile.
+ + + + $kendo-color-palette-tile-md-height + String + $kendo-color-palette-tile-height + var(--kendo-spacing-6, 1.5rem) + + +
Description
The height of the medium ColorPalette tile.
+ + + + $kendo-color-palette-tile-lg-width + String + k-spacing(8) + var(--kendo-spacing-8, 2rem) + + +
Description
The width of the large ColorPalette tile.
+ + + + $kendo-color-palette-tile-lg-height + String + $kendo-color-palette-tile-lg-width + var(--kendo-spacing-8, 2rem) + + +
Description
The height of the large ColorPalette tile.
+ + $kendo-color-palette-tile-focus-shadow List @@ -107,6 +167,29 @@ The following table lists the available variables for customization.
Description
The shadow of the ColorPalette selected tile.
+ + $kendo-color-palette-sizes + Map + ( + sm: ( + width: $kendo-color-palette-tile-sm-width, + height: $kendo-color-palette-tile-sm-height + ), + md: ( + width: $kendo-color-palette-tile-md-width, + height: $kendo-color-palette-tile-md-height + ), + lg: ( + width: $kendo-color-palette-tile-lg-width, + height: $kendo-color-palette-tile-lg-height + ) +) + + + +
Description
The size map of the ColorPalette.
+ + diff --git a/packages/classic/docs/customization.md b/packages/classic/docs/customization.md index 847f89641ac..8ff31a88f0a 100644 --- a/packages/classic/docs/customization.md +++ b/packages/classic/docs/customization.md @@ -7150,6 +7150,36 @@ The following table lists the available variables for customizing the Classic th
Description
The minimum width of the ColorEditor.
+ + $kendo-color-editor-sm-min-width + Number + 252px + 252px + + +
Description
The minimum width of the ColorEditor.
+ + + + $kendo-color-editor-md-min-width + Number + $kendo-color-editor-min-width + 272px + + +
Description
The minimum width of the ColorEditor.
+ + + + $kendo-color-editor-lg-min-width + Number + 362px + 362px + + +
Description
The minimum width of the ColorEditor.
+ + $kendo-color-editor-border-width Number @@ -7272,14 +7302,74 @@ The following table lists the available variables for customizing the Classic th $kendo-color-editor-header-actions-gap - Calculation - calc( #{$kendo-color-editor-spacer} / 1.5 ) - calc(var(--kendo-spacing-3, 0.75rem) / 1.5) + String + k-spacing(2) + var(--kendo-spacing-2, 0.5rem)
Description
The spacing between the ColorEditor header actions.
+ + $kendo-color-editor-sm-header-padding-y + String + $kendo-color-editor-header-padding-y + var(--kendo-spacing-3, 0.75rem) + + +
Description
The vertical padding of the small ColorEditor header.
+ + + + $kendo-color-editor-sm-header-padding-x + String + $kendo-color-editor-header-padding-x + var(--kendo-spacing-3, 0.75rem) + + +
Description
The horizontal padding of the small ColorEditor header.
+ + + + $kendo-color-editor-md-header-padding-y + String + $kendo-color-editor-header-padding-y + var(--kendo-spacing-3, 0.75rem) + + +
Description
The vertical padding of the medium ColorEditor header.
+ + + + $kendo-color-editor-md-header-padding-x + String + $kendo-color-editor-header-padding-x + var(--kendo-spacing-3, 0.75rem) + + +
Description
The horizontal padding of the medium ColorEditor header.
+ + + + $kendo-color-editor-lg-header-padding-y + String + k-spacing(4.5) + var(--kendo-spacing-4\.5, 1.125rem) + + +
Description
The vertical padding of the large ColorEditor header.
+ + + + $kendo-color-editor-lg-header-padding-x + String + k-spacing(4.5) + var(--kendo-spacing-4\.5, 1.125rem) + + +
Description
The horizontal padding of the large ColorEditor header.
+ + $kendo-color-editor-color-preview-width Number @@ -7310,6 +7400,96 @@ The following table lists the available variables for customizing the Classic th
Description
The spacing between the colors in the ColorEditor preview.
+ + $kendo-color-editor-sm-preview-gap + String + k-spacing(0.5) + var(--kendo-spacing-0\.5, 0.125rem) + + +
Description
The spacing between the colors in the small ColorEditor preview.
+ + + + $kendo-color-editor-md-preview-gap + String + $kendo-color-editor-preview-gap + var(--kendo-spacing-1, 0.25rem) + + +
Description
The spacing between the colors in the medium ColorEditor preview.
+ + + + $kendo-color-editor-lg-preview-gap + String + k-spacing(1) + var(--kendo-spacing-1, 0.25rem) + + +
Description
The spacing between the colors in the large ColorEditor preview.
+ + + + $kendo-color-editor-sm-color-preview-width + Number + 34px + 34px + + +
Description
The width of the small ColorEditor preview.
+ + + + $kendo-color-editor-sm-color-preview-height + Number + 12px + 12px + + +
Description
The height of the small ColorEditor preview.
+ + + + $kendo-color-editor-md-color-preview-width + Number + $kendo-color-editor-color-preview-width + 32px + + +
Description
The width of the medium ColorEditor preview.
+ + + + $kendo-color-editor-md-color-preview-height + Number + $kendo-color-editor-color-preview-height + 12px + + +
Description
The height of the medium ColorEditor preview.
+ + + + $kendo-color-editor-lg-color-preview-width + Number + 44px + 44px + + +
Description
The width of the large ColorEditor preview.
+ + + + $kendo-color-editor-lg-color-preview-height + Number + 16px + 16px + + +
Description
The height of the large ColorEditor preview.
+ + $kendo-color-editor-views-padding-y String @@ -7340,6 +7520,96 @@ The following table lists the available variables for customizing the Classic th
Description
The spacing of the ColorEditor views container.
+ + $kendo-color-editor-sm-views-padding-y + String + $kendo-color-editor-spacer + var(--kendo-spacing-3, 0.75rem) + + +
Description
The vertical padding of the small ColorEditor views container.
+ + + + $kendo-color-editor-sm-views-padding-x + String + $kendo-color-editor-views-padding-y + var(--kendo-spacing-3, 0.75rem) + + +
Description
The horizontal padding of the small ColorEditor views container.
+ + + + $kendo-color-editor-sm-views-gap + String + $kendo-color-editor-spacer + var(--kendo-spacing-3, 0.75rem) + + +
Description
The spacing of the small ColorEditor views container.
+ + + + $kendo-color-editor-md-views-padding-y + String + $kendo-color-editor-views-padding-y + var(--kendo-spacing-3, 0.75rem) + + +
Description
The vertical padding of the medium ColorEditor views container.
+ + + + $kendo-color-editor-md-views-padding-x + String + $kendo-color-editor-views-padding-x + var(--kendo-spacing-3, 0.75rem) + + +
Description
The horizontal padding of the medium ColorEditor views container.
+ + + + $kendo-color-editor-md-views-gap + String + $kendo-color-editor-views-gap + var(--kendo-spacing-3, 0.75rem) + + +
Description
The spacing of the medium ColorEditor views container.
+ + + + $kendo-color-editor-lg-views-padding-y + String + k-spacing(4.5) + var(--kendo-spacing-4\.5, 1.125rem) + + +
Description
The vertical padding of the large ColorEditor views container.
+ + + + $kendo-color-editor-lg-views-padding-x + String + k-spacing(4.5) + var(--kendo-spacing-4\.5, 1.125rem) + + +
Description
The horizontal padding of the large ColorEditor views container.
+ + + + $kendo-color-editor-lg-views-gap + String + k-spacing(4.5) + var(--kendo-spacing-4\.5, 1.125rem) + + +
Description
The spacing of the large ColorEditor views container.
+ + $kendo-color-editor-color-gradient-focus-outline-color Color @@ -7370,6 +7640,48 @@ The following table lists the available variables for customizing the Classic th
Description
The outline offset of the focused ColorGradient.
+ + $kendo-color-editor-sizes + Map + ( + sm: ( + min-width: $kendo-color-editor-sm-min-width, + header-padding-x: $kendo-color-editor-sm-header-padding-x, + header-padding-y: $kendo-color-editor-sm-header-padding-y, + views-padding-x: $kendo-color-editor-sm-views-padding-x, + views-padding-y: $kendo-color-editor-sm-views-padding-y, + preview-gap: $kendo-color-editor-sm-preview-gap, + preview-width: $kendo-color-editor-sm-color-preview-width, + preview-height: $kendo-color-editor-sm-color-preview-height, + + ), + md: ( + min-width: $kendo-color-editor-md-min-width, + header-padding-x: $kendo-color-editor-md-header-padding-x, + header-padding-y: $kendo-color-editor-md-header-padding-y, + views-padding-x: $kendo-color-editor-md-views-padding-x, + views-padding-y: $kendo-color-editor-md-views-padding-y, + preview-gap: $kendo-color-editor-md-preview-gap, + preview-width: $kendo-color-editor-md-color-preview-width, + preview-height: $kendo-color-editor-md-color-preview-height, + ), + lg: ( + min-width: $kendo-color-editor-lg-min-width, + header-padding-x: $kendo-color-editor-lg-header-padding-x, + header-padding-y: $kendo-color-editor-lg-header-padding-y, + views-padding-x: $kendo-color-editor-lg-views-padding-x, + views-padding-y: $kendo-color-editor-lg-views-padding-y, + preview-gap: $kendo-color-editor-lg-preview-gap, + preview-width: $kendo-color-editor-lg-color-preview-width, + preview-height: $kendo-color-editor-lg-color-preview-height, + ) +) + + + +
Description
The size map of the ColorEditor.
+ + @@ -7520,6 +7832,66 @@ The following table lists the available variables for customizing the Classic th
Description
The border color of the ColorGradient.
+ + $kendo-color-gradient-sm-width + Number + 226px + 226px + + +
Description
The width of the small ColorGradient.
+ + + + $kendo-color-gradient-md-width + Number + $kendo-color-gradient-width + 272px + + +
Description
The width of the medium ColorGradient.
+ + + + $kendo-color-gradient-lg-width + Number + 324px + 324px + + +
Description
The width of the large ColorGradient.
+ + + + $kendo-color-gradient-sm-gap + String + $kendo-color-gradient-gap + var(--kendo-spacing-3, 0.75rem) + + +
Description
The spacing between the sections of the small ColorGradient.
+ + + + $kendo-color-gradient-md-gap + String + $kendo-color-gradient-gap + var(--kendo-spacing-3, 0.75rem) + + +
Description
The spacing between the sections of the medium ColorGradient.
+ + + + $kendo-color-gradient-lg-gap + String + k-spacing(4.5) + var(--kendo-spacing-4\.5, 1.125rem) + + +
Description
The spacing between the sections of the large ColorGradient.
+ + $kendo-color-gradient-focus-border Null @@ -7570,6 +7942,66 @@ The following table lists the available variables for customizing the Classic th
Description
The height the ColorGradient canvas hsv rectangle.
+ + $kendo-color-gradient-sm-canvas-rectangle-height + Number + 182px + 182px + + +
Description
The height the small ColorGradient canvas hsv rectangle.
+ + + + $kendo-color-gradient-md-canvas-rectangle-height + Number + $kendo-color-gradient-canvas-rectangle-height + 180px + + +
Description
The height the medium ColorGradient canvas hsv rectangle.
+ + + + $kendo-color-gradient-lg-canvas-rectangle-height + Number + 268px + 268px + + +
Description
The height the large ColorGradient canvas hsv rectangle.
+ + + + $kendo-color-gradient-sm-canvas-gap + String + $kendo-color-gradient-canvas-gap + var(--kendo-spacing-3, 0.75rem) + + +
Description
The spacing between the items of the small ColorGradient canvas.
+ + + + $kendo-color-gradient-md-canvas-gap + String + $kendo-color-gradient-canvas-gap + var(--kendo-spacing-3, 0.75rem) + + +
Description
The spacing between the items of the medium ColorGradient canvas.
+ + + + $kendo-color-gradient-lg-canvas-gap + String + k-spacing(4.5) + var(--kendo-spacing-4\.5, 1.125rem) + + +
Description
The spacing between the items of the large ColorGradient canvas.
+ + $kendo-color-gradient-slider-track-size Number @@ -7630,6 +8062,36 @@ The following table lists the available variables for customizing the Classic th
Description
The background image of the ColorGradient alpha slider.
+ + $kendo-color-gradient-sm-slider-vertical-size + Number + 182px + 182px + + +
Description
The height of the small ColorGradient vertical slider.
+ + + + $kendo-color-gradient-md-slider-vertical-size + Number + $kendo-color-gradient-slider-vertical-size + 180px + + +
Description
The height of the medium ColorGradient vertical slider.
+ + + + $kendo-color-gradient-lg-slider-vertical-size + Number + 268px + 268px + + +
Description
The height of the large ColorGradient vertical slider.
+ + $kendo-color-gradient-draghandle-width Number @@ -7772,9 +8234,9 @@ The following table lists the available variables for customizing the Classic th $kendo-color-gradient-input-gap - Calculation - calc( #{$kendo-color-gradient-spacer} / 1.5 ) - calc(var(--kendo-spacing-3, 0.75rem) / 1.5) + String + k-spacing(2) + var(--kendo-spacing-2, 0.5rem)
Description
The spacing between the ColorGradient inputs.
@@ -7800,6 +8262,36 @@ The following table lists the available variables for customizing the Classic th
Description
The text color of the ColorGradient input labels.
+ + $kendo-color-gradient-sm-input-width + Number + 42px + 42px + + +
Description
The width of the small ColorGradient input.
+ + + + $kendo-color-gradient-md-input-width + Number + $kendo-color-gradient-input-width + 46px + + +
Description
The width of the medium ColorGradient input.
+ + + + $kendo-color-gradient-lg-input-width + Number + 62.5px + 62.5px + + +
Description
The width of the large ColorGradient input.
+ + $kendo-color-gradient-contrast-ratio-font-weight String @@ -7820,6 +8312,41 @@ The following table lists the available variables for customizing the Classic th
Description
The spacing between the items in the ColorGradient contrast tool.
+ + $kendo-color-gradient-sizes + Map + ( + sm: ( + width: $kendo-color-gradient-sm-width, + vertical-slider-height: $kendo-color-gradient-sm-slider-vertical-size, + rectangle-height: $kendo-color-gradient-sm-canvas-rectangle-height, + input-width: $kendo-color-gradient-sm-input-width, + gap: $kendo-color-gradient-sm-gap, + canvas-gap: $kendo-color-gradient-sm-canvas-gap + ), + md: ( + width: $kendo-color-gradient-md-width, + vertical-slider-height: $kendo-color-gradient-md-slider-vertical-size, + rectangle-height: $kendo-color-gradient-md-canvas-rectangle-height, + input-width: $kendo-color-gradient-md-input-width, + gap: $kendo-color-gradient-md-gap, + canvas-gap: $kendo-color-gradient-md-canvas-gap + ), + lg: ( + width: $kendo-color-gradient-lg-width, + vertical-slider-height: $kendo-color-gradient-lg-slider-vertical-size, + rectangle-height: $kendo-color-gradient-lg-canvas-rectangle-height, + input-width: $kendo-color-gradient-lg-input-width, + gap: $kendo-color-gradient-lg-gap, + canvas-gap: $kendo-color-gradient-lg-canvas-gap + ) +) + + + +
Description
The size map of the ColorGradient.
+ + @@ -7890,6 +8417,66 @@ The following table lists the available variables for customizing the Classic th
Description
The height of the ColorPalette tile.
+ + $kendo-color-palette-tile-sm-width + String + k-spacing(5.5) + var(--kendo-spacing-5\.5, 1.375rem) + + +
Description
The width of the small ColorPalette tile.
+ + + + $kendo-color-palette-tile-sm-height + String + $kendo-color-palette-tile-sm-width + var(--kendo-spacing-5\.5, 1.375rem) + + +
Description
The height of the small ColorPalette tile.
+ + + + $kendo-color-palette-tile-md-width + String + $kendo-color-palette-tile-width + var(--kendo-spacing-6, 1.5rem) + + +
Description
The width of the medium ColorPalette tile.
+ + + + $kendo-color-palette-tile-md-height + String + $kendo-color-palette-tile-height + var(--kendo-spacing-6, 1.5rem) + + +
Description
The height of the medium ColorPalette tile.
+ + + + $kendo-color-palette-tile-lg-width + String + k-spacing(8) + var(--kendo-spacing-8, 2rem) + + +
Description
The width of the large ColorPalette tile.
+ + + + $kendo-color-palette-tile-lg-height + String + $kendo-color-palette-tile-lg-width + var(--kendo-spacing-8, 2rem) + + +
Description
The height of the large ColorPalette tile.
+ + $kendo-color-palette-tile-focus-shadow List @@ -7920,6 +8507,29 @@ The following table lists the available variables for customizing the Classic th
Description
The shadow of the ColorPalette selected tile.
+ + $kendo-color-palette-sizes + Map + ( + sm: ( + width: $kendo-color-palette-tile-sm-width, + height: $kendo-color-palette-tile-sm-height + ), + md: ( + width: $kendo-color-palette-tile-md-width, + height: $kendo-color-palette-tile-md-height + ), + lg: ( + width: $kendo-color-palette-tile-lg-width, + height: $kendo-color-palette-tile-lg-height + ) +) + + + +
Description
The size map of the ColorPalette.
+ + diff --git a/packages/default/docs/customization-color-editor.md b/packages/default/docs/customization-color-editor.md index 061a9e08400..2dd309c3b62 100644 --- a/packages/default/docs/customization-color-editor.md +++ b/packages/default/docs/customization-color-editor.md @@ -47,6 +47,36 @@ The following table lists the available variables for customization.
Description
The minimum width of the ColorEditor.
+ + $kendo-color-editor-sm-min-width + Number + 252px + 252px + + +
Description
The minimum width of the ColorEditor.
+ + + + $kendo-color-editor-md-min-width + Number + $kendo-color-editor-min-width + 272px + + +
Description
The minimum width of the ColorEditor.
+ + + + $kendo-color-editor-lg-min-width + Number + 362px + 362px + + +
Description
The minimum width of the ColorEditor.
+ + $kendo-color-editor-border-width Number @@ -169,14 +199,74 @@ The following table lists the available variables for customization. $kendo-color-editor-header-actions-gap - Calculation - calc( #{$kendo-color-editor-spacer} / 1.5 ) - calc(var(--kendo-spacing-3, 0.75rem) / 1.5) + String + k-spacing(2) + var(--kendo-spacing-2, 0.5rem)
Description
The spacing between the ColorEditor header actions.
+ + $kendo-color-editor-sm-header-padding-y + String + $kendo-color-editor-header-padding-y + var(--kendo-spacing-3, 0.75rem) + + +
Description
The vertical padding of the small ColorEditor header.
+ + + + $kendo-color-editor-sm-header-padding-x + String + $kendo-color-editor-header-padding-x + var(--kendo-spacing-3, 0.75rem) + + +
Description
The horizontal padding of the small ColorEditor header.
+ + + + $kendo-color-editor-md-header-padding-y + String + $kendo-color-editor-header-padding-y + var(--kendo-spacing-3, 0.75rem) + + +
Description
The vertical padding of the medium ColorEditor header.
+ + + + $kendo-color-editor-md-header-padding-x + String + $kendo-color-editor-header-padding-x + var(--kendo-spacing-3, 0.75rem) + + +
Description
The horizontal padding of the medium ColorEditor header.
+ + + + $kendo-color-editor-lg-header-padding-y + String + k-spacing(4.5) + var(--kendo-spacing-4\.5, 1.125rem) + + +
Description
The vertical padding of the large ColorEditor header.
+ + + + $kendo-color-editor-lg-header-padding-x + String + k-spacing(4.5) + var(--kendo-spacing-4\.5, 1.125rem) + + +
Description
The horizontal padding of the large ColorEditor header.
+ + $kendo-color-editor-color-preview-width Number @@ -207,6 +297,96 @@ The following table lists the available variables for customization.
Description
The spacing between the colors in the ColorEditor preview.
+ + $kendo-color-editor-sm-preview-gap + String + k-spacing(0.5) + var(--kendo-spacing-0\.5, 0.125rem) + + +
Description
The spacing between the colors in the small ColorEditor preview.
+ + + + $kendo-color-editor-md-preview-gap + String + $kendo-color-editor-preview-gap + var(--kendo-spacing-1, 0.25rem) + + +
Description
The spacing between the colors in the medium ColorEditor preview.
+ + + + $kendo-color-editor-lg-preview-gap + String + k-spacing(1) + var(--kendo-spacing-1, 0.25rem) + + +
Description
The spacing between the colors in the large ColorEditor preview.
+ + + + $kendo-color-editor-sm-color-preview-width + Number + 34px + 34px + + +
Description
The width of the small ColorEditor preview.
+ + + + $kendo-color-editor-sm-color-preview-height + Number + 12px + 12px + + +
Description
The height of the small ColorEditor preview.
+ + + + $kendo-color-editor-md-color-preview-width + Number + $kendo-color-editor-color-preview-width + 32px + + +
Description
The width of the medium ColorEditor preview.
+ + + + $kendo-color-editor-md-color-preview-height + Number + $kendo-color-editor-color-preview-height + 12px + + +
Description
The height of the medium ColorEditor preview.
+ + + + $kendo-color-editor-lg-color-preview-width + Number + 44px + 44px + + +
Description
The width of the large ColorEditor preview.
+ + + + $kendo-color-editor-lg-color-preview-height + Number + 16px + 16px + + +
Description
The height of the large ColorEditor preview.
+ + $kendo-color-editor-views-padding-y String @@ -237,6 +417,96 @@ The following table lists the available variables for customization.
Description
The spacing of the ColorEditor views container.
+ + $kendo-color-editor-sm-views-padding-y + String + $kendo-color-editor-spacer + var(--kendo-spacing-3, 0.75rem) + + +
Description
The vertical padding of the small ColorEditor views container.
+ + + + $kendo-color-editor-sm-views-padding-x + String + $kendo-color-editor-views-padding-y + var(--kendo-spacing-3, 0.75rem) + + +
Description
The horizontal padding of the small ColorEditor views container.
+ + + + $kendo-color-editor-sm-views-gap + String + $kendo-color-editor-spacer + var(--kendo-spacing-3, 0.75rem) + + +
Description
The spacing of the small ColorEditor views container.
+ + + + $kendo-color-editor-md-views-padding-y + String + $kendo-color-editor-views-padding-y + var(--kendo-spacing-3, 0.75rem) + + +
Description
The vertical padding of the medium ColorEditor views container.
+ + + + $kendo-color-editor-md-views-padding-x + String + $kendo-color-editor-views-padding-x + var(--kendo-spacing-3, 0.75rem) + + +
Description
The horizontal padding of the medium ColorEditor views container.
+ + + + $kendo-color-editor-md-views-gap + String + $kendo-color-editor-views-gap + var(--kendo-spacing-3, 0.75rem) + + +
Description
The spacing of the medium ColorEditor views container.
+ + + + $kendo-color-editor-lg-views-padding-y + String + k-spacing(4.5) + var(--kendo-spacing-4\.5, 1.125rem) + + +
Description
The vertical padding of the large ColorEditor views container.
+ + + + $kendo-color-editor-lg-views-padding-x + String + k-spacing(4.5) + var(--kendo-spacing-4\.5, 1.125rem) + + +
Description
The horizontal padding of the large ColorEditor views container.
+ + + + $kendo-color-editor-lg-views-gap + String + k-spacing(4.5) + var(--kendo-spacing-4\.5, 1.125rem) + + +
Description
The spacing of the large ColorEditor views container.
+ + $kendo-color-editor-color-gradient-focus-outline-color Color @@ -267,6 +537,48 @@ The following table lists the available variables for customization.
Description
The outline offset of the focused ColorGradient.
+ + $kendo-color-editor-sizes + Map + ( + sm: ( + min-width: $kendo-color-editor-sm-min-width, + header-padding-x: $kendo-color-editor-sm-header-padding-x, + header-padding-y: $kendo-color-editor-sm-header-padding-y, + views-padding-x: $kendo-color-editor-sm-views-padding-x, + views-padding-y: $kendo-color-editor-sm-views-padding-y, + preview-gap: $kendo-color-editor-sm-preview-gap, + preview-width: $kendo-color-editor-sm-color-preview-width, + preview-height: $kendo-color-editor-sm-color-preview-height, + + ), + md: ( + min-width: $kendo-color-editor-md-min-width, + header-padding-x: $kendo-color-editor-md-header-padding-x, + header-padding-y: $kendo-color-editor-md-header-padding-y, + views-padding-x: $kendo-color-editor-md-views-padding-x, + views-padding-y: $kendo-color-editor-md-views-padding-y, + preview-gap: $kendo-color-editor-md-preview-gap, + preview-width: $kendo-color-editor-md-color-preview-width, + preview-height: $kendo-color-editor-md-color-preview-height, + ), + lg: ( + min-width: $kendo-color-editor-lg-min-width, + header-padding-x: $kendo-color-editor-lg-header-padding-x, + header-padding-y: $kendo-color-editor-lg-header-padding-y, + views-padding-x: $kendo-color-editor-lg-views-padding-x, + views-padding-y: $kendo-color-editor-lg-views-padding-y, + preview-gap: $kendo-color-editor-lg-preview-gap, + preview-width: $kendo-color-editor-lg-color-preview-width, + preview-height: $kendo-color-editor-lg-color-preview-height, + ) +) + + + +
Description
The size map of the ColorEditor.
+ + diff --git a/packages/default/docs/customization-color-gradient.md b/packages/default/docs/customization-color-gradient.md index 3ffd1e811a3..343dabfe912 100644 --- a/packages/default/docs/customization-color-gradient.md +++ b/packages/default/docs/customization-color-gradient.md @@ -157,6 +157,66 @@ The following table lists the available variables for customization.
Description
The border color of the ColorGradient.
+ + $kendo-color-gradient-sm-width + Number + 226px + 226px + + +
Description
The width of the small ColorGradient.
+ + + + $kendo-color-gradient-md-width + Number + $kendo-color-gradient-width + 272px + + +
Description
The width of the medium ColorGradient.
+ + + + $kendo-color-gradient-lg-width + Number + 324px + 324px + + +
Description
The width of the large ColorGradient.
+ + + + $kendo-color-gradient-sm-gap + String + $kendo-color-gradient-gap + var(--kendo-spacing-3, 0.75rem) + + +
Description
The spacing between the sections of the small ColorGradient.
+ + + + $kendo-color-gradient-md-gap + String + $kendo-color-gradient-gap + var(--kendo-spacing-3, 0.75rem) + + +
Description
The spacing between the sections of the medium ColorGradient.
+ + + + $kendo-color-gradient-lg-gap + String + k-spacing(4.5) + var(--kendo-spacing-4\.5, 1.125rem) + + +
Description
The spacing between the sections of the large ColorGradient.
+ + $kendo-color-gradient-focus-border Null @@ -207,6 +267,66 @@ The following table lists the available variables for customization.
Description
The height the ColorGradient canvas hsv rectangle.
+ + $kendo-color-gradient-sm-canvas-rectangle-height + Number + 182px + 182px + + +
Description
The height the small ColorGradient canvas hsv rectangle.
+ + + + $kendo-color-gradient-md-canvas-rectangle-height + Number + $kendo-color-gradient-canvas-rectangle-height + 180px + + +
Description
The height the medium ColorGradient canvas hsv rectangle.
+ + + + $kendo-color-gradient-lg-canvas-rectangle-height + Number + 268px + 268px + + +
Description
The height the large ColorGradient canvas hsv rectangle.
+ + + + $kendo-color-gradient-sm-canvas-gap + String + $kendo-color-gradient-canvas-gap + var(--kendo-spacing-3, 0.75rem) + + +
Description
The spacing between the items of the small ColorGradient canvas.
+ + + + $kendo-color-gradient-md-canvas-gap + String + $kendo-color-gradient-canvas-gap + var(--kendo-spacing-3, 0.75rem) + + +
Description
The spacing between the items of the medium ColorGradient canvas.
+ + + + $kendo-color-gradient-lg-canvas-gap + String + k-spacing(4.5) + var(--kendo-spacing-4\.5, 1.125rem) + + +
Description
The spacing between the items of the large ColorGradient canvas.
+ + $kendo-color-gradient-slider-track-size Number @@ -267,6 +387,36 @@ The following table lists the available variables for customization.
Description
The background image of the ColorGradient alpha slider.
+ + $kendo-color-gradient-sm-slider-vertical-size + Number + 182px + 182px + + +
Description
The height of the small ColorGradient vertical slider.
+ + + + $kendo-color-gradient-md-slider-vertical-size + Number + $kendo-color-gradient-slider-vertical-size + 180px + + +
Description
The height of the medium ColorGradient vertical slider.
+ + + + $kendo-color-gradient-lg-slider-vertical-size + Number + 268px + 268px + + +
Description
The height of the large ColorGradient vertical slider.
+ + $kendo-color-gradient-draghandle-width Number @@ -409,9 +559,9 @@ The following table lists the available variables for customization. $kendo-color-gradient-input-gap - Calculation - calc( #{$kendo-color-gradient-spacer} / 1.5 ) - calc(var(--kendo-spacing-3, 0.75rem) / 1.5) + String + k-spacing(2) + var(--kendo-spacing-2, 0.5rem)
Description
The spacing between the ColorGradient inputs.
@@ -437,6 +587,36 @@ The following table lists the available variables for customization.
Description
The text color of the ColorGradient input labels.
+ + $kendo-color-gradient-sm-input-width + Number + 42px + 42px + + +
Description
The width of the small ColorGradient input.
+ + + + $kendo-color-gradient-md-input-width + Number + $kendo-color-gradient-input-width + 46px + + +
Description
The width of the medium ColorGradient input.
+ + + + $kendo-color-gradient-lg-input-width + Number + 62.5px + 62.5px + + +
Description
The width of the large ColorGradient input.
+ + $kendo-color-gradient-contrast-ratio-font-weight String @@ -457,6 +637,41 @@ The following table lists the available variables for customization.
Description
The spacing between the items in the ColorGradient contrast tool.
+ + $kendo-color-gradient-sizes + Map + ( + sm: ( + width: $kendo-color-gradient-sm-width, + vertical-slider-height: $kendo-color-gradient-sm-slider-vertical-size, + rectangle-height: $kendo-color-gradient-sm-canvas-rectangle-height, + input-width: $kendo-color-gradient-sm-input-width, + gap: $kendo-color-gradient-sm-gap, + canvas-gap: $kendo-color-gradient-sm-canvas-gap + ), + md: ( + width: $kendo-color-gradient-md-width, + vertical-slider-height: $kendo-color-gradient-md-slider-vertical-size, + rectangle-height: $kendo-color-gradient-md-canvas-rectangle-height, + input-width: $kendo-color-gradient-md-input-width, + gap: $kendo-color-gradient-md-gap, + canvas-gap: $kendo-color-gradient-md-canvas-gap + ), + lg: ( + width: $kendo-color-gradient-lg-width, + vertical-slider-height: $kendo-color-gradient-lg-slider-vertical-size, + rectangle-height: $kendo-color-gradient-lg-canvas-rectangle-height, + input-width: $kendo-color-gradient-lg-input-width, + gap: $kendo-color-gradient-lg-gap, + canvas-gap: $kendo-color-gradient-lg-canvas-gap + ) +) + + + +
Description
The size map of the ColorGradient.
+ + diff --git a/packages/default/docs/customization-color-palette.md b/packages/default/docs/customization-color-palette.md index c9c6766049d..d8e935f2234 100644 --- a/packages/default/docs/customization-color-palette.md +++ b/packages/default/docs/customization-color-palette.md @@ -77,6 +77,66 @@ The following table lists the available variables for customization.
Description
The height of the ColorPalette tile.
+ + $kendo-color-palette-tile-sm-width + String + k-spacing(5.5) + var(--kendo-spacing-5\.5, 1.375rem) + + +
Description
The width of the small ColorPalette tile.
+ + + + $kendo-color-palette-tile-sm-height + String + $kendo-color-palette-tile-sm-width + var(--kendo-spacing-5\.5, 1.375rem) + + +
Description
The height of the small ColorPalette tile.
+ + + + $kendo-color-palette-tile-md-width + String + $kendo-color-palette-tile-width + var(--kendo-spacing-6, 1.5rem) + + +
Description
The width of the medium ColorPalette tile.
+ + + + $kendo-color-palette-tile-md-height + String + $kendo-color-palette-tile-height + var(--kendo-spacing-6, 1.5rem) + + +
Description
The height of the medium ColorPalette tile.
+ + + + $kendo-color-palette-tile-lg-width + String + k-spacing(8) + var(--kendo-spacing-8, 2rem) + + +
Description
The width of the large ColorPalette tile.
+ + + + $kendo-color-palette-tile-lg-height + String + $kendo-color-palette-tile-lg-width + var(--kendo-spacing-8, 2rem) + + +
Description
The height of the large ColorPalette tile.
+ + $kendo-color-palette-tile-focus-shadow List @@ -107,6 +167,29 @@ The following table lists the available variables for customization.
Description
The shadow of the ColorPalette selected tile.
+ + $kendo-color-palette-sizes + Map + ( + sm: ( + width: $kendo-color-palette-tile-sm-width, + height: $kendo-color-palette-tile-sm-height + ), + md: ( + width: $kendo-color-palette-tile-md-width, + height: $kendo-color-palette-tile-md-height + ), + lg: ( + width: $kendo-color-palette-tile-lg-width, + height: $kendo-color-palette-tile-lg-height + ) +) + + + +
Description
The size map of the ColorPalette.
+ + diff --git a/packages/default/docs/customization.md b/packages/default/docs/customization.md index 08b01d37d73..d5400b4d763 100644 --- a/packages/default/docs/customization.md +++ b/packages/default/docs/customization.md @@ -6919,6 +6919,36 @@ The following table lists the available variables for customizing the Default th
Description
The minimum width of the ColorEditor.
+ + $kendo-color-editor-sm-min-width + Number + 252px + 252px + + +
Description
The minimum width of the ColorEditor.
+ + + + $kendo-color-editor-md-min-width + Number + $kendo-color-editor-min-width + 272px + + +
Description
The minimum width of the ColorEditor.
+ + + + $kendo-color-editor-lg-min-width + Number + 362px + 362px + + +
Description
The minimum width of the ColorEditor.
+ + $kendo-color-editor-border-width Number @@ -7041,14 +7071,74 @@ The following table lists the available variables for customizing the Default th $kendo-color-editor-header-actions-gap - Calculation - calc( #{$kendo-color-editor-spacer} / 1.5 ) - calc(var(--kendo-spacing-3, 0.75rem) / 1.5) + String + k-spacing(2) + var(--kendo-spacing-2, 0.5rem)
Description
The spacing between the ColorEditor header actions.
+ + $kendo-color-editor-sm-header-padding-y + String + $kendo-color-editor-header-padding-y + var(--kendo-spacing-3, 0.75rem) + + +
Description
The vertical padding of the small ColorEditor header.
+ + + + $kendo-color-editor-sm-header-padding-x + String + $kendo-color-editor-header-padding-x + var(--kendo-spacing-3, 0.75rem) + + +
Description
The horizontal padding of the small ColorEditor header.
+ + + + $kendo-color-editor-md-header-padding-y + String + $kendo-color-editor-header-padding-y + var(--kendo-spacing-3, 0.75rem) + + +
Description
The vertical padding of the medium ColorEditor header.
+ + + + $kendo-color-editor-md-header-padding-x + String + $kendo-color-editor-header-padding-x + var(--kendo-spacing-3, 0.75rem) + + +
Description
The horizontal padding of the medium ColorEditor header.
+ + + + $kendo-color-editor-lg-header-padding-y + String + k-spacing(4.5) + var(--kendo-spacing-4\.5, 1.125rem) + + +
Description
The vertical padding of the large ColorEditor header.
+ + + + $kendo-color-editor-lg-header-padding-x + String + k-spacing(4.5) + var(--kendo-spacing-4\.5, 1.125rem) + + +
Description
The horizontal padding of the large ColorEditor header.
+ + $kendo-color-editor-color-preview-width Number @@ -7079,6 +7169,96 @@ The following table lists the available variables for customizing the Default th
Description
The spacing between the colors in the ColorEditor preview.
+ + $kendo-color-editor-sm-preview-gap + String + k-spacing(0.5) + var(--kendo-spacing-0\.5, 0.125rem) + + +
Description
The spacing between the colors in the small ColorEditor preview.
+ + + + $kendo-color-editor-md-preview-gap + String + $kendo-color-editor-preview-gap + var(--kendo-spacing-1, 0.25rem) + + +
Description
The spacing between the colors in the medium ColorEditor preview.
+ + + + $kendo-color-editor-lg-preview-gap + String + k-spacing(1) + var(--kendo-spacing-1, 0.25rem) + + +
Description
The spacing between the colors in the large ColorEditor preview.
+ + + + $kendo-color-editor-sm-color-preview-width + Number + 34px + 34px + + +
Description
The width of the small ColorEditor preview.
+ + + + $kendo-color-editor-sm-color-preview-height + Number + 12px + 12px + + +
Description
The height of the small ColorEditor preview.
+ + + + $kendo-color-editor-md-color-preview-width + Number + $kendo-color-editor-color-preview-width + 32px + + +
Description
The width of the medium ColorEditor preview.
+ + + + $kendo-color-editor-md-color-preview-height + Number + $kendo-color-editor-color-preview-height + 12px + + +
Description
The height of the medium ColorEditor preview.
+ + + + $kendo-color-editor-lg-color-preview-width + Number + 44px + 44px + + +
Description
The width of the large ColorEditor preview.
+ + + + $kendo-color-editor-lg-color-preview-height + Number + 16px + 16px + + +
Description
The height of the large ColorEditor preview.
+ + $kendo-color-editor-views-padding-y String @@ -7109,6 +7289,96 @@ The following table lists the available variables for customizing the Default th
Description
The spacing of the ColorEditor views container.
+ + $kendo-color-editor-sm-views-padding-y + String + $kendo-color-editor-spacer + var(--kendo-spacing-3, 0.75rem) + + +
Description
The vertical padding of the small ColorEditor views container.
+ + + + $kendo-color-editor-sm-views-padding-x + String + $kendo-color-editor-views-padding-y + var(--kendo-spacing-3, 0.75rem) + + +
Description
The horizontal padding of the small ColorEditor views container.
+ + + + $kendo-color-editor-sm-views-gap + String + $kendo-color-editor-spacer + var(--kendo-spacing-3, 0.75rem) + + +
Description
The spacing of the small ColorEditor views container.
+ + + + $kendo-color-editor-md-views-padding-y + String + $kendo-color-editor-views-padding-y + var(--kendo-spacing-3, 0.75rem) + + +
Description
The vertical padding of the medium ColorEditor views container.
+ + + + $kendo-color-editor-md-views-padding-x + String + $kendo-color-editor-views-padding-x + var(--kendo-spacing-3, 0.75rem) + + +
Description
The horizontal padding of the medium ColorEditor views container.
+ + + + $kendo-color-editor-md-views-gap + String + $kendo-color-editor-views-gap + var(--kendo-spacing-3, 0.75rem) + + +
Description
The spacing of the medium ColorEditor views container.
+ + + + $kendo-color-editor-lg-views-padding-y + String + k-spacing(4.5) + var(--kendo-spacing-4\.5, 1.125rem) + + +
Description
The vertical padding of the large ColorEditor views container.
+ + + + $kendo-color-editor-lg-views-padding-x + String + k-spacing(4.5) + var(--kendo-spacing-4\.5, 1.125rem) + + +
Description
The horizontal padding of the large ColorEditor views container.
+ + + + $kendo-color-editor-lg-views-gap + String + k-spacing(4.5) + var(--kendo-spacing-4\.5, 1.125rem) + + +
Description
The spacing of the large ColorEditor views container.
+ + $kendo-color-editor-color-gradient-focus-outline-color Color @@ -7139,6 +7409,48 @@ The following table lists the available variables for customizing the Default th
Description
The outline offset of the focused ColorGradient.
+ + $kendo-color-editor-sizes + Map + ( + sm: ( + min-width: $kendo-color-editor-sm-min-width, + header-padding-x: $kendo-color-editor-sm-header-padding-x, + header-padding-y: $kendo-color-editor-sm-header-padding-y, + views-padding-x: $kendo-color-editor-sm-views-padding-x, + views-padding-y: $kendo-color-editor-sm-views-padding-y, + preview-gap: $kendo-color-editor-sm-preview-gap, + preview-width: $kendo-color-editor-sm-color-preview-width, + preview-height: $kendo-color-editor-sm-color-preview-height, + + ), + md: ( + min-width: $kendo-color-editor-md-min-width, + header-padding-x: $kendo-color-editor-md-header-padding-x, + header-padding-y: $kendo-color-editor-md-header-padding-y, + views-padding-x: $kendo-color-editor-md-views-padding-x, + views-padding-y: $kendo-color-editor-md-views-padding-y, + preview-gap: $kendo-color-editor-md-preview-gap, + preview-width: $kendo-color-editor-md-color-preview-width, + preview-height: $kendo-color-editor-md-color-preview-height, + ), + lg: ( + min-width: $kendo-color-editor-lg-min-width, + header-padding-x: $kendo-color-editor-lg-header-padding-x, + header-padding-y: $kendo-color-editor-lg-header-padding-y, + views-padding-x: $kendo-color-editor-lg-views-padding-x, + views-padding-y: $kendo-color-editor-lg-views-padding-y, + preview-gap: $kendo-color-editor-lg-preview-gap, + preview-width: $kendo-color-editor-lg-color-preview-width, + preview-height: $kendo-color-editor-lg-color-preview-height, + ) +) + + + +
Description
The size map of the ColorEditor.
+ + @@ -7289,6 +7601,66 @@ The following table lists the available variables for customizing the Default th
Description
The border color of the ColorGradient.
+ + $kendo-color-gradient-sm-width + Number + 226px + 226px + + +
Description
The width of the small ColorGradient.
+ + + + $kendo-color-gradient-md-width + Number + $kendo-color-gradient-width + 272px + + +
Description
The width of the medium ColorGradient.
+ + + + $kendo-color-gradient-lg-width + Number + 324px + 324px + + +
Description
The width of the large ColorGradient.
+ + + + $kendo-color-gradient-sm-gap + String + $kendo-color-gradient-gap + var(--kendo-spacing-3, 0.75rem) + + +
Description
The spacing between the sections of the small ColorGradient.
+ + + + $kendo-color-gradient-md-gap + String + $kendo-color-gradient-gap + var(--kendo-spacing-3, 0.75rem) + + +
Description
The spacing between the sections of the medium ColorGradient.
+ + + + $kendo-color-gradient-lg-gap + String + k-spacing(4.5) + var(--kendo-spacing-4\.5, 1.125rem) + + +
Description
The spacing between the sections of the large ColorGradient.
+ + $kendo-color-gradient-focus-border Null @@ -7339,6 +7711,66 @@ The following table lists the available variables for customizing the Default th
Description
The height the ColorGradient canvas hsv rectangle.
+ + $kendo-color-gradient-sm-canvas-rectangle-height + Number + 182px + 182px + + +
Description
The height the small ColorGradient canvas hsv rectangle.
+ + + + $kendo-color-gradient-md-canvas-rectangle-height + Number + $kendo-color-gradient-canvas-rectangle-height + 180px + + +
Description
The height the medium ColorGradient canvas hsv rectangle.
+ + + + $kendo-color-gradient-lg-canvas-rectangle-height + Number + 268px + 268px + + +
Description
The height the large ColorGradient canvas hsv rectangle.
+ + + + $kendo-color-gradient-sm-canvas-gap + String + $kendo-color-gradient-canvas-gap + var(--kendo-spacing-3, 0.75rem) + + +
Description
The spacing between the items of the small ColorGradient canvas.
+ + + + $kendo-color-gradient-md-canvas-gap + String + $kendo-color-gradient-canvas-gap + var(--kendo-spacing-3, 0.75rem) + + +
Description
The spacing between the items of the medium ColorGradient canvas.
+ + + + $kendo-color-gradient-lg-canvas-gap + String + k-spacing(4.5) + var(--kendo-spacing-4\.5, 1.125rem) + + +
Description
The spacing between the items of the large ColorGradient canvas.
+ + $kendo-color-gradient-slider-track-size Number @@ -7399,6 +7831,36 @@ The following table lists the available variables for customizing the Default th
Description
The background image of the ColorGradient alpha slider.
+ + $kendo-color-gradient-sm-slider-vertical-size + Number + 182px + 182px + + +
Description
The height of the small ColorGradient vertical slider.
+ + + + $kendo-color-gradient-md-slider-vertical-size + Number + $kendo-color-gradient-slider-vertical-size + 180px + + +
Description
The height of the medium ColorGradient vertical slider.
+ + + + $kendo-color-gradient-lg-slider-vertical-size + Number + 268px + 268px + + +
Description
The height of the large ColorGradient vertical slider.
+ + $kendo-color-gradient-draghandle-width Number @@ -7541,9 +8003,9 @@ The following table lists the available variables for customizing the Default th $kendo-color-gradient-input-gap - Calculation - calc( #{$kendo-color-gradient-spacer} / 1.5 ) - calc(var(--kendo-spacing-3, 0.75rem) / 1.5) + String + k-spacing(2) + var(--kendo-spacing-2, 0.5rem)
Description
The spacing between the ColorGradient inputs.
@@ -7569,6 +8031,36 @@ The following table lists the available variables for customizing the Default th
Description
The text color of the ColorGradient input labels.
+ + $kendo-color-gradient-sm-input-width + Number + 42px + 42px + + +
Description
The width of the small ColorGradient input.
+ + + + $kendo-color-gradient-md-input-width + Number + $kendo-color-gradient-input-width + 46px + + +
Description
The width of the medium ColorGradient input.
+ + + + $kendo-color-gradient-lg-input-width + Number + 62.5px + 62.5px + + +
Description
The width of the large ColorGradient input.
+ + $kendo-color-gradient-contrast-ratio-font-weight String @@ -7589,6 +8081,41 @@ The following table lists the available variables for customizing the Default th
Description
The spacing between the items in the ColorGradient contrast tool.
+ + $kendo-color-gradient-sizes + Map + ( + sm: ( + width: $kendo-color-gradient-sm-width, + vertical-slider-height: $kendo-color-gradient-sm-slider-vertical-size, + rectangle-height: $kendo-color-gradient-sm-canvas-rectangle-height, + input-width: $kendo-color-gradient-sm-input-width, + gap: $kendo-color-gradient-sm-gap, + canvas-gap: $kendo-color-gradient-sm-canvas-gap + ), + md: ( + width: $kendo-color-gradient-md-width, + vertical-slider-height: $kendo-color-gradient-md-slider-vertical-size, + rectangle-height: $kendo-color-gradient-md-canvas-rectangle-height, + input-width: $kendo-color-gradient-md-input-width, + gap: $kendo-color-gradient-md-gap, + canvas-gap: $kendo-color-gradient-md-canvas-gap + ), + lg: ( + width: $kendo-color-gradient-lg-width, + vertical-slider-height: $kendo-color-gradient-lg-slider-vertical-size, + rectangle-height: $kendo-color-gradient-lg-canvas-rectangle-height, + input-width: $kendo-color-gradient-lg-input-width, + gap: $kendo-color-gradient-lg-gap, + canvas-gap: $kendo-color-gradient-lg-canvas-gap + ) +) + + + +
Description
The size map of the ColorGradient.
+ + @@ -7659,6 +8186,66 @@ The following table lists the available variables for customizing the Default th
Description
The height of the ColorPalette tile.
+ + $kendo-color-palette-tile-sm-width + String + k-spacing(5.5) + var(--kendo-spacing-5\.5, 1.375rem) + + +
Description
The width of the small ColorPalette tile.
+ + + + $kendo-color-palette-tile-sm-height + String + $kendo-color-palette-tile-sm-width + var(--kendo-spacing-5\.5, 1.375rem) + + +
Description
The height of the small ColorPalette tile.
+ + + + $kendo-color-palette-tile-md-width + String + $kendo-color-palette-tile-width + var(--kendo-spacing-6, 1.5rem) + + +
Description
The width of the medium ColorPalette tile.
+ + + + $kendo-color-palette-tile-md-height + String + $kendo-color-palette-tile-height + var(--kendo-spacing-6, 1.5rem) + + +
Description
The height of the medium ColorPalette tile.
+ + + + $kendo-color-palette-tile-lg-width + String + k-spacing(8) + var(--kendo-spacing-8, 2rem) + + +
Description
The width of the large ColorPalette tile.
+ + + + $kendo-color-palette-tile-lg-height + String + $kendo-color-palette-tile-lg-width + var(--kendo-spacing-8, 2rem) + + +
Description
The height of the large ColorPalette tile.
+ + $kendo-color-palette-tile-focus-shadow List @@ -7689,6 +8276,29 @@ The following table lists the available variables for customizing the Default th
Description
The shadow of the ColorPalette selected tile.
+ + $kendo-color-palette-sizes + Map + ( + sm: ( + width: $kendo-color-palette-tile-sm-width, + height: $kendo-color-palette-tile-sm-height + ), + md: ( + width: $kendo-color-palette-tile-md-width, + height: $kendo-color-palette-tile-md-height + ), + lg: ( + width: $kendo-color-palette-tile-lg-width, + height: $kendo-color-palette-tile-lg-height + ) +) + + + +
Description
The size map of the ColorPalette.
+ + diff --git a/packages/fluent/docs/customization-color-editor.md b/packages/fluent/docs/customization-color-editor.md index 07ab5cda5b7..cbc056e0016 100644 --- a/packages/fluent/docs/customization-color-editor.md +++ b/packages/fluent/docs/customization-color-editor.md @@ -47,6 +47,36 @@ The following table lists the available variables for customization.
Description
The minimum width of the ColorEditor.
+ + $kendo-color-editor-sm-min-width + Number + 236px + 236px + + +
Description
The minimum width of the ColorEditor.
+ + + + $kendo-color-editor-md-min-width + Number + $kendo-color-editor-min-width + 260px + + +
Description
The minimum width of the ColorEditor.
+ + + + $kendo-color-editor-lg-min-width + Number + 360px + 360px + + +
Description
The minimum width of the ColorEditor.
+ + $kendo-color-editor-border-width Number @@ -187,6 +217,66 @@ The following table lists the available variables for customization.
Description
The spacing between the ColorEditor header actions.
+ + $kendo-color-editor-sm-header-padding-y + String + $kendo-color-editor-header-padding-y + var(--kendo-spacing-2, 0.5rem) + + +
Description
The vertical padding of the small ColorEditor header.
+ + + + $kendo-color-editor-sm-header-padding-x + String + $kendo-color-editor-header-padding-x + var(--kendo-spacing-2, 0.5rem) + + +
Description
The horizontal padding of the small ColorEditor header.
+ + + + $kendo-color-editor-md-header-padding-y + String + $kendo-color-editor-header-padding-y + var(--kendo-spacing-2, 0.5rem) + + +
Description
The vertical padding of the medium ColorEditor header.
+ + + + $kendo-color-editor-md-header-padding-x + String + $kendo-color-editor-header-padding-x + var(--kendo-spacing-2, 0.5rem) + + +
Description
The horizontal padding of the medium ColorEditor header.
+ + + + $kendo-color-editor-lg-header-padding-y + String + k-spacing(4) + var(--kendo-spacing-4, 1rem) + + +
Description
The vertical padding of the large ColorEditor header.
+ + + + $kendo-color-editor-lg-header-padding-x + String + k-spacing(4) + var(--kendo-spacing-4, 1rem) + + +
Description
The horizontal padding of the large ColorEditor header.
+ + $kendo-color-editor-color-preview-width Number @@ -217,6 +307,96 @@ The following table lists the available variables for customization.
Description
The spacing between the colors in the ColorEditor preview.
+ + $kendo-color-editor-sm-preview-spacing + String + k-spacing(1) + var(--kendo-spacing-1, 0.25rem) + + +
Description
The spacing between the colors in the small ColorEditor preview.
+ + + + $kendo-color-editor-md-preview-spacing + String + $kendo-color-editor-preview-spacing + var(--kendo-spacing-1, 0.25rem) + + +
Description
The spacing between the colors in the medium ColorEditor preview.
+ + + + $kendo-color-editor-lg-preview-spacing + String + k-spacing(1) + var(--kendo-spacing-1, 0.25rem) + + +
Description
The spacing between the colors in the large ColorEditor preview.
+ + + + $kendo-color-editor-sm-color-preview-width + Number + 34px + 34px + + +
Description
The width of the small ColorEditor preview.
+ + + + $kendo-color-editor-sm-color-preview-height + Number + 12px + 12px + + +
Description
The height of the small ColorEditor preview.
+ + + + $kendo-color-editor-md-color-preview-width + Number + $kendo-color-editor-color-preview-width + 34px + + +
Description
The width of the medium ColorEditor preview.
+ + + + $kendo-color-editor-md-color-preview-height + Number + $kendo-color-editor-color-preview-height + 14px + + +
Description
The height of the medium ColorEditor preview.
+ + + + $kendo-color-editor-lg-color-preview-width + Number + 34px + 34px + + +
Description
The width of the large ColorEditor preview.
+ + + + $kendo-color-editor-lg-color-preview-height + Number + 16px + 16px + + +
Description
The height of the large ColorEditor preview.
+ + $kendo-color-editor-views-padding-y String @@ -247,6 +427,96 @@ The following table lists the available variables for customization.
Description
The spacing of the ColorEditor views container.
+ + $kendo-color-editor-sm-views-padding-y + String + k-spacing(4) + var(--kendo-spacing-4, 1rem) + + +
Description
The vertical padding of the small ColorEditor views container.
+ + + + $kendo-color-editor-sm-views-padding-x + String + $kendo-color-editor-views-padding-y + var(--kendo-spacing-2, 0.5rem) + + +
Description
The horizontal padding of the small ColorEditor views container.
+ + + + $kendo-color-editor-sm-views-spacing + String + k-spacing(4) + var(--kendo-spacing-4, 1rem) + + +
Description
The spacing of the small ColorEditor views container.
+ + + + $kendo-color-editor-md-views-padding-y + String + $kendo-color-editor-views-padding-y + var(--kendo-spacing-2, 0.5rem) + + +
Description
The vertical padding of the medium ColorEditor views container.
+ + + + $kendo-color-editor-md-views-padding-x + String + $kendo-color-editor-views-padding-x + var(--kendo-spacing-2, 0.5rem) + + +
Description
The horizontal padding of the medium ColorEditor views container.
+ + + + $kendo-color-editor-md-views-spacing + String + $kendo-color-editor-views-spacing + var(--kendo-spacing-2, 0.5rem) + + +
Description
The spacing of the medium ColorEditor views container.
+ + + + $kendo-color-editor-lg-views-padding-y + String + k-spacing(4) + var(--kendo-spacing-4, 1rem) + + +
Description
The vertical padding of the large ColorEditor views container.
+ + + + $kendo-color-editor-lg-views-padding-x + String + k-spacing(4) + var(--kendo-spacing-4, 1rem) + + +
Description
The horizontal padding of the large ColorEditor views container.
+ + + + $kendo-color-editor-lg-views-spacing + String + k-spacing(4.5) + var(--kendo-spacing-4\.5, 1.125rem) + + +
Description
The spacing of the large ColorEditor views container.
+ + $kendo-color-editor-footer-padding-y String @@ -297,6 +567,48 @@ The following table lists the available variables for customization.
Description
The outline offset of the focused ColorGradient.
+ + $kendo-color-editor-sizes + Map + ( + sm: ( + min-width: $kendo-color-editor-sm-min-width, + header-padding-x: $kendo-color-editor-sm-header-padding-x, + header-padding-y: $kendo-color-editor-sm-header-padding-y, + views-padding-x: $kendo-color-editor-sm-views-padding-x, + views-padding-y: $kendo-color-editor-sm-views-padding-y, + preview-spacing: $kendo-color-editor-sm-preview-spacing, + preview-width: $kendo-color-editor-sm-color-preview-width, + preview-height: $kendo-color-editor-sm-color-preview-height, + + ), + md: ( + min-width: $kendo-color-editor-md-min-width, + header-padding-x: $kendo-color-editor-md-header-padding-x, + header-padding-y: $kendo-color-editor-md-header-padding-y, + views-padding-x: $kendo-color-editor-md-views-padding-x, + views-padding-y: $kendo-color-editor-md-views-padding-y, + preview-spacing: $kendo-color-editor-md-preview-spacing, + preview-width: $kendo-color-editor-md-color-preview-width, + preview-height: $kendo-color-editor-md-color-preview-height, + ), + lg: ( + min-width: $kendo-color-editor-lg-min-width, + header-padding-x: $kendo-color-editor-lg-header-padding-x, + header-padding-y: $kendo-color-editor-lg-header-padding-y, + views-padding-x: $kendo-color-editor-lg-views-padding-x, + views-padding-y: $kendo-color-editor-lg-views-padding-y, + preview-spacing: $kendo-color-editor-lg-preview-spacing, + preview-width: $kendo-color-editor-lg-color-preview-width, + preview-height: $kendo-color-editor-lg-color-preview-height, + ) +) + + + +
Description
The size map of the ColorEditor preview.
+ + diff --git a/packages/fluent/docs/customization-color-gradient.md b/packages/fluent/docs/customization-color-gradient.md index 973d6bd1fd6..116d0dcca7a 100644 --- a/packages/fluent/docs/customization-color-gradient.md +++ b/packages/fluent/docs/customization-color-gradient.md @@ -167,6 +167,66 @@ The following table lists the available variables for customization.
Description
The box shadow of the ColorGradient.
+ + $kendo-color-gradient-sm-width + Number + 226px + 226px + + +
Description
The width of the small ColorGradient.
+ + + + $kendo-color-gradient-md-width + Number + $kendo-color-gradient-width + 260px + + +
Description
The width of the medium ColorGradient.
+ + + + $kendo-color-gradient-lg-width + Number + 360px + 360px + + +
Description
The width of the large ColorGradient.
+ + + + $kendo-color-gradient-sm-spacing + String + $kendo-color-gradient-spacing + var(--kendo-spacing-4, 1rem) + + +
Description
The spacing between the sections of the small ColorGradient.
+ + + + $kendo-color-gradient-md-spacing + String + $kendo-color-gradient-spacing + var(--kendo-spacing-4, 1rem) + + +
Description
The spacing between the sections of the medium ColorGradient.
+ + + + $kendo-color-gradient-lg-spacing + String + k-spacing(4.5) + var(--kendo-spacing-4\.5, 1.125rem) + + +
Description
The spacing between the sections of the large ColorGradient.
+ + $kendo-color-gradient-focus-border String @@ -209,9 +269,9 @@ The following table lists the available variables for customization. $kendo-color-gradient-canvas-spacing - Calculation - calc( #{$kendo-color-gradient-spacer} / 2 ) - calc(var(--kendo-spacing-4, 1rem) / 2) + String + k-spacing(2) + var(--kendo-spacing-2, 0.5rem)
Description
The spacing between the items of the ColorGradient canvas.
@@ -227,6 +287,66 @@ The following table lists the available variables for customization.
Description
The height the ColorGradient canvas hsv rectangle.
+ + $kendo-color-gradient-sm-canvas-rectangle-height + Number + 164px + 164px + + +
Description
The height the small ColorGradient canvas hsv rectangle.
+ + + + $kendo-color-gradient-md-canvas-rectangle-height + Number + $kendo-color-gradient-canvas-rectangle-height + 180px + + +
Description
The height the medium ColorGradient canvas hsv rectangle.
+ + + + $kendo-color-gradient-lg-canvas-rectangle-height + Number + 256px + 256px + + +
Description
The height the large ColorGradient canvas hsv rectangle.
+ + + + $kendo-color-gradient-sm-canvas-spacing + String + $kendo-color-gradient-canvas-spacing + var(--kendo-spacing-2, 0.5rem) + + +
Description
The spacing between the items of the small ColorGradient canvas.
+ + + + $kendo-color-gradient-md-canvas-spacing + String + $kendo-color-gradient-canvas-spacing + var(--kendo-spacing-2, 0.5rem) + + +
Description
The spacing between the items of the medium ColorGradient canvas.
+ + + + $kendo-color-gradient-lg-canvas-spacing + String + k-spacing(4) + var(--kendo-spacing-4, 1rem) + + +
Description
The spacing between the items of the large ColorGradient canvas.
+ + $kendo-color-gradient-canvas-rectangle-border String @@ -317,6 +437,36 @@ The following table lists the available variables for customization.
Description
The background image of the ColorGradient alpha slider.
+ + $kendo-color-gradient-sm-slider-vertical-size + Number + 164px + 164px + + +
Description
The height of the small ColorGradient vertical slider.
+ + + + $kendo-color-gradient-md-slider-vertical-size + Number + $kendo-color-gradient-slider-vertical-size + 180px + + +
Description
The height of the medium ColorGradient vertical slider.
+ + + + $kendo-color-gradient-lg-slider-vertical-size + Number + 256px + 256px + + +
Description
The height of the large ColorGradient vertical slider.
+ + $kendo-color-gradient-draghandle-width Number @@ -477,6 +627,36 @@ The following table lists the available variables for customization.
Description
The text color of the ColorGradient input labels.
+ + $kendo-color-gradient-sm-input-width + Number + 43.5px + 43.5px + + +
Description
The width of the small ColorGradient input.
+ + + + $kendo-color-gradient-md-input-width + Number + $kendo-color-gradient-input-width + 48px + + +
Description
The width of the medium ColorGradient input.
+ + + + $kendo-color-gradient-lg-input-width + Number + 50.5px + 50.5px + + +
Description
The width of the large ColorGradient input.
+ + $kendo-color-gradient-contrast-ratio-font-weight String @@ -497,6 +677,41 @@ The following table lists the available variables for customization.
Description
The spacing between the items in the ColorGradient contrast tool.
+ + $kendo-color-gradient-sizes + Map + ( + sm: ( + width: $kendo-color-gradient-sm-width, + vertical-slider-height: $kendo-color-gradient-sm-slider-vertical-size, + rectangle-height: $kendo-color-gradient-sm-canvas-rectangle-height, + input-width: $kendo-color-gradient-sm-input-width, + spacing: $kendo-color-gradient-sm-spacing, + canvas-spacing: $kendo-color-gradient-sm-canvas-spacing + ), + md: ( + width: $kendo-color-gradient-md-width, + vertical-slider-height: $kendo-color-gradient-md-slider-vertical-size, + rectangle-height: $kendo-color-gradient-md-canvas-rectangle-height, + input-width: $kendo-color-gradient-md-input-width, + spacing: $kendo-color-gradient-md-spacing, + canvas-spacing: $kendo-color-gradient-md-canvas-spacing + ), + lg: ( + width: $kendo-color-gradient-lg-width, + vertical-slider-height: $kendo-color-gradient-lg-slider-vertical-size, + rectangle-height: $kendo-color-gradient-lg-canvas-rectangle-height, + input-width: $kendo-color-gradient-lg-input-width, + spacing: $kendo-color-gradient-lg-spacing, + canvas-spacing: $kendo-color-gradient-lg-canvas-spacing + ) +) + + + +
Description
The size map of the ColorGradient.
+ + diff --git a/packages/fluent/docs/customization-color-palette.md b/packages/fluent/docs/customization-color-palette.md index 1546d9deeb1..f4122d7976c 100644 --- a/packages/fluent/docs/customization-color-palette.md +++ b/packages/fluent/docs/customization-color-palette.md @@ -107,6 +107,66 @@ The following table lists the available variables for customization.
Description
The height of the ColorPalette tile.
+ + $kendo-color-palette-tile-sm-width + String + k-spacing(5.5) + var(--kendo-spacing-5\.5, 1.375rem) + + +
Description
The width of the small ColorPalette tile.
+ + + + $kendo-color-palette-tile-sm-height + String + $kendo-color-palette-tile-sm-width + var(--kendo-spacing-5\.5, 1.375rem) + + +
Description
The height of the small ColorPalette tile.
+ + + + $kendo-color-palette-tile-md-width + String + $kendo-color-palette-tile-width + var(--kendo-spacing-6, 1.5rem) + + +
Description
The width of the medium ColorPalette tile.
+ + + + $kendo-color-palette-tile-md-height + String + $kendo-color-palette-tile-height + var(--kendo-spacing-6, 1.5rem) + + +
Description
The height of the medium ColorPalette tile.
+ + + + $kendo-color-palette-tile-lg-width + String + k-spacing(8) + var(--kendo-spacing-8, 2rem) + + +
Description
The width of the large ColorPalette tile.
+ + + + $kendo-color-palette-tile-lg-height + String + $kendo-color-palette-tile-lg-width + var(--kendo-spacing-8, 2rem) + + +
Description
The height of the large ColorPalette tile.
+ + $kendo-color-palette-tile-focus-outline String @@ -177,6 +237,29 @@ The following table lists the available variables for customization.
Description
The outline color of the ColorPalette selected hover tile.
+ + $kendo-color-palette-sizes + Map + ( + sm: ( + width: $kendo-color-palette-tile-sm-width, + height: $kendo-color-palette-tile-sm-height + ), + md: ( + width: $kendo-color-palette-tile-md-width, + height: $kendo-color-palette-tile-md-height + ), + lg: ( + width: $kendo-color-palette-tile-lg-width, + height: $kendo-color-palette-tile-lg-height + ) +) + + + +
Description
The size map of the ColorPalette.
+ + diff --git a/packages/fluent/docs/customization.md b/packages/fluent/docs/customization.md index bf752e3bd69..d6e9241d160 100644 --- a/packages/fluent/docs/customization.md +++ b/packages/fluent/docs/customization.md @@ -8101,6 +8101,36 @@ The following table lists the available variables for customizing the Fluent the
Description
The minimum width of the ColorEditor.
+ + $kendo-color-editor-sm-min-width + Number + 236px + 236px + + +
Description
The minimum width of the ColorEditor.
+ + + + $kendo-color-editor-md-min-width + Number + $kendo-color-editor-min-width + 260px + + +
Description
The minimum width of the ColorEditor.
+ + + + $kendo-color-editor-lg-min-width + Number + 360px + 360px + + +
Description
The minimum width of the ColorEditor.
+ + $kendo-color-editor-border-width Number @@ -8241,6 +8271,66 @@ The following table lists the available variables for customizing the Fluent the
Description
The spacing between the ColorEditor header actions.
+ + $kendo-color-editor-sm-header-padding-y + String + $kendo-color-editor-header-padding-y + var(--kendo-spacing-2, 0.5rem) + + +
Description
The vertical padding of the small ColorEditor header.
+ + + + $kendo-color-editor-sm-header-padding-x + String + $kendo-color-editor-header-padding-x + var(--kendo-spacing-2, 0.5rem) + + +
Description
The horizontal padding of the small ColorEditor header.
+ + + + $kendo-color-editor-md-header-padding-y + String + $kendo-color-editor-header-padding-y + var(--kendo-spacing-2, 0.5rem) + + +
Description
The vertical padding of the medium ColorEditor header.
+ + + + $kendo-color-editor-md-header-padding-x + String + $kendo-color-editor-header-padding-x + var(--kendo-spacing-2, 0.5rem) + + +
Description
The horizontal padding of the medium ColorEditor header.
+ + + + $kendo-color-editor-lg-header-padding-y + String + k-spacing(4) + var(--kendo-spacing-4, 1rem) + + +
Description
The vertical padding of the large ColorEditor header.
+ + + + $kendo-color-editor-lg-header-padding-x + String + k-spacing(4) + var(--kendo-spacing-4, 1rem) + + +
Description
The horizontal padding of the large ColorEditor header.
+ + $kendo-color-editor-color-preview-width Number @@ -8271,6 +8361,96 @@ The following table lists the available variables for customizing the Fluent the
Description
The spacing between the colors in the ColorEditor preview.
+ + $kendo-color-editor-sm-preview-spacing + String + k-spacing(1) + var(--kendo-spacing-1, 0.25rem) + + +
Description
The spacing between the colors in the small ColorEditor preview.
+ + + + $kendo-color-editor-md-preview-spacing + String + $kendo-color-editor-preview-spacing + var(--kendo-spacing-1, 0.25rem) + + +
Description
The spacing between the colors in the medium ColorEditor preview.
+ + + + $kendo-color-editor-lg-preview-spacing + String + k-spacing(1) + var(--kendo-spacing-1, 0.25rem) + + +
Description
The spacing between the colors in the large ColorEditor preview.
+ + + + $kendo-color-editor-sm-color-preview-width + Number + 34px + 34px + + +
Description
The width of the small ColorEditor preview.
+ + + + $kendo-color-editor-sm-color-preview-height + Number + 12px + 12px + + +
Description
The height of the small ColorEditor preview.
+ + + + $kendo-color-editor-md-color-preview-width + Number + $kendo-color-editor-color-preview-width + 34px + + +
Description
The width of the medium ColorEditor preview.
+ + + + $kendo-color-editor-md-color-preview-height + Number + $kendo-color-editor-color-preview-height + 14px + + +
Description
The height of the medium ColorEditor preview.
+ + + + $kendo-color-editor-lg-color-preview-width + Number + 34px + 34px + + +
Description
The width of the large ColorEditor preview.
+ + + + $kendo-color-editor-lg-color-preview-height + Number + 16px + 16px + + +
Description
The height of the large ColorEditor preview.
+ + $kendo-color-editor-views-padding-y String @@ -8301,6 +8481,96 @@ The following table lists the available variables for customizing the Fluent the
Description
The spacing of the ColorEditor views container.
+ + $kendo-color-editor-sm-views-padding-y + String + k-spacing(4) + var(--kendo-spacing-4, 1rem) + + +
Description
The vertical padding of the small ColorEditor views container.
+ + + + $kendo-color-editor-sm-views-padding-x + String + $kendo-color-editor-views-padding-y + var(--kendo-spacing-2, 0.5rem) + + +
Description
The horizontal padding of the small ColorEditor views container.
+ + + + $kendo-color-editor-sm-views-spacing + String + k-spacing(4) + var(--kendo-spacing-4, 1rem) + + +
Description
The spacing of the small ColorEditor views container.
+ + + + $kendo-color-editor-md-views-padding-y + String + $kendo-color-editor-views-padding-y + var(--kendo-spacing-2, 0.5rem) + + +
Description
The vertical padding of the medium ColorEditor views container.
+ + + + $kendo-color-editor-md-views-padding-x + String + $kendo-color-editor-views-padding-x + var(--kendo-spacing-2, 0.5rem) + + +
Description
The horizontal padding of the medium ColorEditor views container.
+ + + + $kendo-color-editor-md-views-spacing + String + $kendo-color-editor-views-spacing + var(--kendo-spacing-2, 0.5rem) + + +
Description
The spacing of the medium ColorEditor views container.
+ + + + $kendo-color-editor-lg-views-padding-y + String + k-spacing(4) + var(--kendo-spacing-4, 1rem) + + +
Description
The vertical padding of the large ColorEditor views container.
+ + + + $kendo-color-editor-lg-views-padding-x + String + k-spacing(4) + var(--kendo-spacing-4, 1rem) + + +
Description
The horizontal padding of the large ColorEditor views container.
+ + + + $kendo-color-editor-lg-views-spacing + String + k-spacing(4.5) + var(--kendo-spacing-4\.5, 1.125rem) + + +
Description
The spacing of the large ColorEditor views container.
+ + $kendo-color-editor-footer-padding-y String @@ -8351,6 +8621,48 @@ The following table lists the available variables for customizing the Fluent the
Description
The outline offset of the focused ColorGradient.
+ + $kendo-color-editor-sizes + Map + ( + sm: ( + min-width: $kendo-color-editor-sm-min-width, + header-padding-x: $kendo-color-editor-sm-header-padding-x, + header-padding-y: $kendo-color-editor-sm-header-padding-y, + views-padding-x: $kendo-color-editor-sm-views-padding-x, + views-padding-y: $kendo-color-editor-sm-views-padding-y, + preview-spacing: $kendo-color-editor-sm-preview-spacing, + preview-width: $kendo-color-editor-sm-color-preview-width, + preview-height: $kendo-color-editor-sm-color-preview-height, + + ), + md: ( + min-width: $kendo-color-editor-md-min-width, + header-padding-x: $kendo-color-editor-md-header-padding-x, + header-padding-y: $kendo-color-editor-md-header-padding-y, + views-padding-x: $kendo-color-editor-md-views-padding-x, + views-padding-y: $kendo-color-editor-md-views-padding-y, + preview-spacing: $kendo-color-editor-md-preview-spacing, + preview-width: $kendo-color-editor-md-color-preview-width, + preview-height: $kendo-color-editor-md-color-preview-height, + ), + lg: ( + min-width: $kendo-color-editor-lg-min-width, + header-padding-x: $kendo-color-editor-lg-header-padding-x, + header-padding-y: $kendo-color-editor-lg-header-padding-y, + views-padding-x: $kendo-color-editor-lg-views-padding-x, + views-padding-y: $kendo-color-editor-lg-views-padding-y, + preview-spacing: $kendo-color-editor-lg-preview-spacing, + preview-width: $kendo-color-editor-lg-color-preview-width, + preview-height: $kendo-color-editor-lg-color-preview-height, + ) +) + + + +
Description
The size map of the ColorEditor preview.
+ + @@ -8511,6 +8823,66 @@ The following table lists the available variables for customizing the Fluent the
Description
The box shadow of the ColorGradient.
+ + $kendo-color-gradient-sm-width + Number + 226px + 226px + + +
Description
The width of the small ColorGradient.
+ + + + $kendo-color-gradient-md-width + Number + $kendo-color-gradient-width + 260px + + +
Description
The width of the medium ColorGradient.
+ + + + $kendo-color-gradient-lg-width + Number + 360px + 360px + + +
Description
The width of the large ColorGradient.
+ + + + $kendo-color-gradient-sm-spacing + String + $kendo-color-gradient-spacing + var(--kendo-spacing-4, 1rem) + + +
Description
The spacing between the sections of the small ColorGradient.
+ + + + $kendo-color-gradient-md-spacing + String + $kendo-color-gradient-spacing + var(--kendo-spacing-4, 1rem) + + +
Description
The spacing between the sections of the medium ColorGradient.
+ + + + $kendo-color-gradient-lg-spacing + String + k-spacing(4.5) + var(--kendo-spacing-4\.5, 1.125rem) + + +
Description
The spacing between the sections of the large ColorGradient.
+ + $kendo-color-gradient-focus-border String @@ -8553,9 +8925,9 @@ The following table lists the available variables for customizing the Fluent the $kendo-color-gradient-canvas-spacing - Calculation - calc( #{$kendo-color-gradient-spacer} / 2 ) - calc(var(--kendo-spacing-4, 1rem) / 2) + String + k-spacing(2) + var(--kendo-spacing-2, 0.5rem)
Description
The spacing between the items of the ColorGradient canvas.
@@ -8571,6 +8943,66 @@ The following table lists the available variables for customizing the Fluent the
Description
The height the ColorGradient canvas hsv rectangle.
+ + $kendo-color-gradient-sm-canvas-rectangle-height + Number + 164px + 164px + + +
Description
The height the small ColorGradient canvas hsv rectangle.
+ + + + $kendo-color-gradient-md-canvas-rectangle-height + Number + $kendo-color-gradient-canvas-rectangle-height + 180px + + +
Description
The height the medium ColorGradient canvas hsv rectangle.
+ + + + $kendo-color-gradient-lg-canvas-rectangle-height + Number + 256px + 256px + + +
Description
The height the large ColorGradient canvas hsv rectangle.
+ + + + $kendo-color-gradient-sm-canvas-spacing + String + $kendo-color-gradient-canvas-spacing + var(--kendo-spacing-2, 0.5rem) + + +
Description
The spacing between the items of the small ColorGradient canvas.
+ + + + $kendo-color-gradient-md-canvas-spacing + String + $kendo-color-gradient-canvas-spacing + var(--kendo-spacing-2, 0.5rem) + + +
Description
The spacing between the items of the medium ColorGradient canvas.
+ + + + $kendo-color-gradient-lg-canvas-spacing + String + k-spacing(4) + var(--kendo-spacing-4, 1rem) + + +
Description
The spacing between the items of the large ColorGradient canvas.
+ + $kendo-color-gradient-canvas-rectangle-border String @@ -8661,6 +9093,36 @@ The following table lists the available variables for customizing the Fluent the
Description
The background image of the ColorGradient alpha slider.
+ + $kendo-color-gradient-sm-slider-vertical-size + Number + 164px + 164px + + +
Description
The height of the small ColorGradient vertical slider.
+ + + + $kendo-color-gradient-md-slider-vertical-size + Number + $kendo-color-gradient-slider-vertical-size + 180px + + +
Description
The height of the medium ColorGradient vertical slider.
+ + + + $kendo-color-gradient-lg-slider-vertical-size + Number + 256px + 256px + + +
Description
The height of the large ColorGradient vertical slider.
+ + $kendo-color-gradient-draghandle-width Number @@ -8821,6 +9283,36 @@ The following table lists the available variables for customizing the Fluent the
Description
The text color of the ColorGradient input labels.
+ + $kendo-color-gradient-sm-input-width + Number + 43.5px + 43.5px + + +
Description
The width of the small ColorGradient input.
+ + + + $kendo-color-gradient-md-input-width + Number + $kendo-color-gradient-input-width + 48px + + +
Description
The width of the medium ColorGradient input.
+ + + + $kendo-color-gradient-lg-input-width + Number + 50.5px + 50.5px + + +
Description
The width of the large ColorGradient input.
+ + $kendo-color-gradient-contrast-ratio-font-weight String @@ -8841,6 +9333,41 @@ The following table lists the available variables for customizing the Fluent the
Description
The spacing between the items in the ColorGradient contrast tool.
+ + $kendo-color-gradient-sizes + Map + ( + sm: ( + width: $kendo-color-gradient-sm-width, + vertical-slider-height: $kendo-color-gradient-sm-slider-vertical-size, + rectangle-height: $kendo-color-gradient-sm-canvas-rectangle-height, + input-width: $kendo-color-gradient-sm-input-width, + spacing: $kendo-color-gradient-sm-spacing, + canvas-spacing: $kendo-color-gradient-sm-canvas-spacing + ), + md: ( + width: $kendo-color-gradient-md-width, + vertical-slider-height: $kendo-color-gradient-md-slider-vertical-size, + rectangle-height: $kendo-color-gradient-md-canvas-rectangle-height, + input-width: $kendo-color-gradient-md-input-width, + spacing: $kendo-color-gradient-md-spacing, + canvas-spacing: $kendo-color-gradient-md-canvas-spacing + ), + lg: ( + width: $kendo-color-gradient-lg-width, + vertical-slider-height: $kendo-color-gradient-lg-slider-vertical-size, + rectangle-height: $kendo-color-gradient-lg-canvas-rectangle-height, + input-width: $kendo-color-gradient-lg-input-width, + spacing: $kendo-color-gradient-lg-spacing, + canvas-spacing: $kendo-color-gradient-lg-canvas-spacing + ) +) + + + +
Description
The size map of the ColorGradient.
+ + @@ -8941,6 +9468,66 @@ The following table lists the available variables for customizing the Fluent the
Description
The height of the ColorPalette tile.
+ + $kendo-color-palette-tile-sm-width + String + k-spacing(5.5) + var(--kendo-spacing-5\.5, 1.375rem) + + +
Description
The width of the small ColorPalette tile.
+ + + + $kendo-color-palette-tile-sm-height + String + $kendo-color-palette-tile-sm-width + var(--kendo-spacing-5\.5, 1.375rem) + + +
Description
The height of the small ColorPalette tile.
+ + + + $kendo-color-palette-tile-md-width + String + $kendo-color-palette-tile-width + var(--kendo-spacing-6, 1.5rem) + + +
Description
The width of the medium ColorPalette tile.
+ + + + $kendo-color-palette-tile-md-height + String + $kendo-color-palette-tile-height + var(--kendo-spacing-6, 1.5rem) + + +
Description
The height of the medium ColorPalette tile.
+ + + + $kendo-color-palette-tile-lg-width + String + k-spacing(8) + var(--kendo-spacing-8, 2rem) + + +
Description
The width of the large ColorPalette tile.
+ + + + $kendo-color-palette-tile-lg-height + String + $kendo-color-palette-tile-lg-width + var(--kendo-spacing-8, 2rem) + + +
Description
The height of the large ColorPalette tile.
+ + $kendo-color-palette-tile-focus-outline String @@ -9011,6 +9598,29 @@ The following table lists the available variables for customizing the Fluent the
Description
The outline color of the ColorPalette selected hover tile.
+ + $kendo-color-palette-sizes + Map + ( + sm: ( + width: $kendo-color-palette-tile-sm-width, + height: $kendo-color-palette-tile-sm-height + ), + md: ( + width: $kendo-color-palette-tile-md-width, + height: $kendo-color-palette-tile-md-height + ), + lg: ( + width: $kendo-color-palette-tile-lg-width, + height: $kendo-color-palette-tile-lg-height + ) +) + + + +
Description
The size map of the ColorPalette.
+ + diff --git a/packages/material/docs/customization-color-editor.md b/packages/material/docs/customization-color-editor.md index 3fe17a2e5c7..7533fdf23c5 100644 --- a/packages/material/docs/customization-color-editor.md +++ b/packages/material/docs/customization-color-editor.md @@ -47,6 +47,36 @@ The following table lists the available variables for customization.
Description
The minimum width of the ColorEditor.
+ + $kendo-color-editor-sm-min-width + Number + 278px + 278px + + +
Description
The minimum width of the ColorEditor.
+ + + + $kendo-color-editor-md-min-width + Number + $kendo-color-editor-min-width + 294px + + +
Description
The minimum width of the ColorEditor.
+ + + + $kendo-color-editor-lg-min-width + Number + 364px + 364px + + +
Description
The minimum width of the ColorEditor.
+ + $kendo-color-editor-border-width Number @@ -177,6 +207,66 @@ The following table lists the available variables for customization.
Description
The spacing between the ColorEditor header actions.
+ + $kendo-color-editor-sm-header-padding-y + String + $kendo-color-editor-header-padding-y + var(--kendo-spacing-3, 0.75rem) + + +
Description
The vertical padding of the small ColorEditor header.
+ + + + $kendo-color-editor-sm-header-padding-x + String + $kendo-color-editor-header-padding-x + var(--kendo-spacing-3, 0.75rem) + + +
Description
The horizontal padding of the small ColorEditor header.
+ + + + $kendo-color-editor-md-header-padding-y + String + $kendo-color-editor-header-padding-y + var(--kendo-spacing-3, 0.75rem) + + +
Description
The vertical padding of the medium ColorEditor header.
+ + + + $kendo-color-editor-md-header-padding-x + String + $kendo-color-editor-header-padding-x + var(--kendo-spacing-3, 0.75rem) + + +
Description
The horizontal padding of the medium ColorEditor header.
+ + + + $kendo-color-editor-lg-header-padding-y + String + k-spacing(4.5) + var(--kendo-spacing-4\.5, 1.125rem) + + +
Description
The vertical padding of the large ColorEditor header.
+ + + + $kendo-color-editor-lg-header-padding-x + String + k-spacing(4.5) + var(--kendo-spacing-4\.5, 1.125rem) + + +
Description
The horizontal padding of the large ColorEditor header.
+ + $kendo-color-editor-color-preview-width Number @@ -207,6 +297,96 @@ The following table lists the available variables for customization.
Description
The spacing between the colors in the ColorEditor preview.
+ + $kendo-color-editor-sm-preview-gap + String + k-spacing(2) + var(--kendo-spacing-2, 0.5rem) + + +
Description
The spacing between the colors in the small ColorEditor preview.
+ + + + $kendo-color-editor-md-preview-gap + String + $kendo-color-editor-preview-gap + var(--kendo-spacing-1, 0.25rem) + + +
Description
The spacing between the colors in the medium ColorEditor preview.
+ + + + $kendo-color-editor-lg-preview-gap + String + k-spacing(2) + var(--kendo-spacing-2, 0.5rem) + + +
Description
The spacing between the colors in the large ColorEditor preview.
+ + + + $kendo-color-editor-sm-color-preview-width + Number + 34px + 34px + + +
Description
The width of the small ColorEditor preview.
+ + + + $kendo-color-editor-sm-color-preview-height + Number + 12px + 12px + + +
Description
The height of the small ColorEditor preview.
+ + + + $kendo-color-editor-md-color-preview-width + Number + $kendo-color-editor-color-preview-width + 32px + + +
Description
The width of the medium ColorEditor preview.
+ + + + $kendo-color-editor-md-color-preview-height + Number + $kendo-color-editor-color-preview-height + 12px + + +
Description
The height of the medium ColorEditor preview.
+ + + + $kendo-color-editor-lg-color-preview-width + Number + 42px + 42px + + +
Description
The width of the large ColorEditor preview.
+ + + + $kendo-color-editor-lg-color-preview-height + Number + 16px + 16px + + +
Description
The height of the large ColorEditor preview.
+ + $kendo-color-editor-views-padding-y String @@ -237,6 +417,96 @@ The following table lists the available variables for customization.
Description
The spacing of the ColorEditor views container.
+ + $kendo-color-editor-sm-views-padding-y + String + $kendo-color-editor-spacer + var(--kendo-spacing-3, 0.75rem) + + +
Description
The vertical padding of the small ColorEditor views container.
+ + + + $kendo-color-editor-sm-views-padding-x + String + $kendo-color-editor-views-padding-y + var(--kendo-spacing-3, 0.75rem) + + +
Description
The horizontal padding of the small ColorEditor views container.
+ + + + $kendo-color-editor-sm-views-gap + String + $kendo-color-editor-spacer + var(--kendo-spacing-3, 0.75rem) + + +
Description
The spacing of the small ColorEditor views container.
+ + + + $kendo-color-editor-md-views-padding-y + String + $kendo-color-editor-views-padding-y + var(--kendo-spacing-3, 0.75rem) + + +
Description
The vertical padding of the medium ColorEditor views container.
+ + + + $kendo-color-editor-md-views-padding-x + String + $kendo-color-editor-views-padding-x + var(--kendo-spacing-3, 0.75rem) + + +
Description
The horizontal padding of the medium ColorEditor views container.
+ + + + $kendo-color-editor-md-views-gap + String + $kendo-color-editor-views-gap + var(--kendo-spacing-3, 0.75rem) + + +
Description
The spacing of the medium ColorEditor views container.
+ + + + $kendo-color-editor-lg-views-padding-y + String + k-spacing(4.5) + var(--kendo-spacing-4\.5, 1.125rem) + + +
Description
The vertical padding of the large ColorEditor views container.
+ + + + $kendo-color-editor-lg-views-padding-x + String + k-spacing(4.5) + var(--kendo-spacing-4\.5, 1.125rem) + + +
Description
The horizontal padding of the large ColorEditor views container.
+ + + + $kendo-color-editor-lg-views-gap + String + k-spacing(4.5) + var(--kendo-spacing-4\.5, 1.125rem) + + +
Description
The spacing of the large ColorEditor views container.
+ + $kendo-color-editor-color-gradient-focus-outline-color Color @@ -267,6 +537,48 @@ The following table lists the available variables for customization.
Description
The outline offset of the focused ColorGradient.
+ + $kendo-color-editor-sizes + Map + ( + sm: ( + min-width: $kendo-color-editor-sm-min-width, + header-padding-x: $kendo-color-editor-sm-header-padding-x, + header-padding-y: $kendo-color-editor-sm-header-padding-y, + views-padding-x: $kendo-color-editor-sm-views-padding-x, + views-padding-y: $kendo-color-editor-sm-views-padding-y, + preview-gap: $kendo-color-editor-sm-preview-gap, + preview-width: $kendo-color-editor-sm-color-preview-width, + preview-height: $kendo-color-editor-sm-color-preview-height, + + ), + md: ( + min-width: $kendo-color-editor-md-min-width, + header-padding-x: $kendo-color-editor-md-header-padding-x, + header-padding-y: $kendo-color-editor-md-header-padding-y, + views-padding-x: $kendo-color-editor-md-views-padding-x, + views-padding-y: $kendo-color-editor-md-views-padding-y, + preview-gap: $kendo-color-editor-md-preview-gap, + preview-width: $kendo-color-editor-md-color-preview-width, + preview-height: $kendo-color-editor-md-color-preview-height, + ), + lg: ( + min-width: $kendo-color-editor-lg-min-width, + header-padding-x: $kendo-color-editor-lg-header-padding-x, + header-padding-y: $kendo-color-editor-lg-header-padding-y, + views-padding-x: $kendo-color-editor-lg-views-padding-x, + views-padding-y: $kendo-color-editor-lg-views-padding-y, + preview-gap: $kendo-color-editor-lg-preview-gap, + preview-width: $kendo-color-editor-lg-color-preview-width, + preview-height: $kendo-color-editor-lg-color-preview-height, + ) +) + + + +
Description
The size map of the ColorEditor.
+ + diff --git a/packages/material/docs/customization-color-gradient.md b/packages/material/docs/customization-color-gradient.md index 86afa7b5f2c..9acdcb1ef11 100644 --- a/packages/material/docs/customization-color-gradient.md +++ b/packages/material/docs/customization-color-gradient.md @@ -157,6 +157,66 @@ The following table lists the available variables for customization.
Description
The border color of the ColorGradient.
+ + $kendo-color-gradient-sm-width + Number + 254px + 254px + + +
Description
The width of the small ColorGradient.
+ + + + $kendo-color-gradient-md-width + Number + $kendo-color-gradient-width + 294px + + +
Description
The width of the medium ColorGradient.
+ + + + $kendo-color-gradient-lg-width + Number + 328px + 328px + + +
Description
The width of the large ColorGradient.
+ + + + $kendo-color-gradient-sm-gap + String + k-spacing(2.5) + var(--kendo-spacing-2\.5, 0.625rem) + + +
Description
The spacing between the sections of the small ColorGradient.
+ + + + $kendo-color-gradient-md-gap + String + $kendo-color-gradient-gap + var(--kendo-spacing-3, 0.75rem) + + +
Description
The spacing between the sections of the medium ColorGradient.
+ + + + $kendo-color-gradient-lg-gap + String + k-spacing(4) + var(--kendo-spacing-4, 1rem) + + +
Description
The spacing between the sections of the large ColorGradient.
+ + $kendo-color-gradient-focus-border String @@ -207,6 +267,66 @@ The following table lists the available variables for customization.
Description
The height the ColorGradient canvas hsv rectangle.
+ + $kendo-color-gradient-sm-canvas-rectangle-height + Number + 210px + 210px + + +
Description
The height the small ColorGradient canvas hsv rectangle.
+ + + + $kendo-color-gradient-md-canvas-rectangle-height + Number + $kendo-color-gradient-canvas-rectangle-height + 180px + + +
Description
The height the medium ColorGradient canvas hsv rectangle.
+ + + + $kendo-color-gradient-lg-canvas-rectangle-height + Number + 266px + 266px + + +
Description
The height the large ColorGradient canvas hsv rectangle.
+ + + + $kendo-color-gradient-sm-canvas-gap + String + k-spacing(2.5) + var(--kendo-spacing-2\.5, 0.625rem) + + +
Description
The spacing between the items of the small ColorGradient canvas.
+ + + + $kendo-color-gradient-md-canvas-gap + String + $kendo-color-gradient-canvas-gap + var(--kendo-spacing-3, 0.75rem) + + +
Description
The spacing between the items of the medium ColorGradient canvas.
+ + + + $kendo-color-gradient-lg-canvas-gap + String + k-spacing(4) + var(--kendo-spacing-4, 1rem) + + +
Description
The spacing between the items of the large ColorGradient canvas.
+ + $kendo-color-gradient-slider-track-size Number @@ -267,6 +387,36 @@ The following table lists the available variables for customization.
Description
The background image of the ColorGradient alpha slider.
+ + $kendo-color-gradient-sm-slider-vertical-size + Number + 210px + 210px + + +
Description
The height of the small ColorGradient vertical slider.
+ + + + $kendo-color-gradient-md-slider-vertical-size + Number + $kendo-color-gradient-slider-vertical-size + 180px + + +
Description
The height of the medium ColorGradient vertical slider.
+ + + + $kendo-color-gradient-lg-slider-vertical-size + Number + 266px + 266px + + +
Description
The height of the large ColorGradient vertical slider.
+ + $kendo-color-gradient-draghandle-width Number @@ -437,6 +587,36 @@ The following table lists the available variables for customization.
Description
The text color of the ColorGradient input labels.
+ + $kendo-color-gradient-sm-input-width + Number + 46px + 46px + + +
Description
The width of the small ColorGradient input.
+ + + + $kendo-color-gradient-md-input-width + Number + $kendo-color-gradient-input-width + 50px + + +
Description
The width of the medium ColorGradient input.
+ + + + $kendo-color-gradient-lg-input-width + Number + 62px + 62px + + +
Description
The width of the large ColorGradient input.
+ + $kendo-color-gradient-contrast-ratio-font-weight String @@ -457,6 +637,41 @@ The following table lists the available variables for customization.
Description
The spacing between the items in the ColorGradient contrast tool.
+ + $kendo-color-gradient-sizes + Map + ( + sm: ( + width: $kendo-color-gradient-sm-width, + vertical-slider-height: $kendo-color-gradient-sm-slider-vertical-size, + rectangle-height: $kendo-color-gradient-sm-canvas-rectangle-height, + input-width: $kendo-color-gradient-sm-input-width, + gap: $kendo-color-gradient-sm-gap, + canvas-gap: $kendo-color-gradient-sm-canvas-gap + ), + md: ( + width: $kendo-color-gradient-md-width, + vertical-slider-height: $kendo-color-gradient-md-slider-vertical-size, + rectangle-height: $kendo-color-gradient-md-canvas-rectangle-height, + input-width: $kendo-color-gradient-md-input-width, + gap: $kendo-color-gradient-md-gap, + canvas-gap: $kendo-color-gradient-md-canvas-gap + ), + lg: ( + width: $kendo-color-gradient-lg-width, + vertical-slider-height: $kendo-color-gradient-lg-slider-vertical-size, + rectangle-height: $kendo-color-gradient-lg-canvas-rectangle-height, + input-width: $kendo-color-gradient-lg-input-width, + gap: $kendo-color-gradient-lg-gap, + canvas-gap: $kendo-color-gradient-lg-canvas-gap + ) +) + + + +
Description
The size map of the ColorGradient.
+ + diff --git a/packages/material/docs/customization-color-palette.md b/packages/material/docs/customization-color-palette.md index b130617c4b6..7662cb4daf4 100644 --- a/packages/material/docs/customization-color-palette.md +++ b/packages/material/docs/customization-color-palette.md @@ -77,6 +77,66 @@ The following table lists the available variables for customization.
Description
The height of the ColorPalette tile.
+ + $kendo-color-palette-tile-sm-width + String + k-spacing(5.5) + var(--kendo-spacing-5\.5, 1.375rem) + + + + + + + $kendo-color-palette-tile-sm-height + String + $kendo-color-palette-tile-sm-width + var(--kendo-spacing-5\.5, 1.375rem) + + +
Description
The height of the small ColorPalette tile.
+ + + + $kendo-color-palette-tile-md-width + String + $kendo-color-palette-tile-width + var(--kendo-spacing-6, 1.5rem) + + +
Description
The width of the medium ColorPalette tile.
+ + + + $kendo-color-palette-tile-md-height + String + $kendo-color-palette-tile-height + var(--kendo-spacing-6, 1.5rem) + + +
Description
The height of the medium ColorPalette tile.
+ + + + $kendo-color-palette-tile-lg-width + String + k-spacing(8) + var(--kendo-spacing-8, 2rem) + + +
Description
The width of the large ColorPalette tile.
+ + + + $kendo-color-palette-tile-lg-height + String + $kendo-color-palette-tile-lg-width + var(--kendo-spacing-8, 2rem) + + +
Description
The height of the large ColorPalette tile.
+ + $kendo-color-palette-tile-focus-shadow List @@ -107,6 +167,29 @@ The following table lists the available variables for customization.
Description
The shadow of the ColorPalette selected tile.
+ + $kendo-color-palette-sizes + Map + ( + sm: ( + width: $kendo-color-palette-tile-sm-width, + height: $kendo-color-palette-tile-sm-height + ), + md: ( + width: $kendo-color-palette-tile-md-width, + height: $kendo-color-palette-tile-md-height + ), + lg: ( + width: $kendo-color-palette-tile-lg-width, + height: $kendo-color-palette-tile-lg-height + ) +) + + + +
Description
The size map of the ColorPalette.
+ + diff --git a/packages/material/docs/customization.md b/packages/material/docs/customization.md index 039350a50d5..6f444ab3fb0 100644 --- a/packages/material/docs/customization.md +++ b/packages/material/docs/customization.md @@ -6939,6 +6939,36 @@ The following table lists the available variables for customizing the Material t
Description
The minimum width of the ColorEditor.
+ + $kendo-color-editor-sm-min-width + Number + 278px + 278px + + +
Description
The minimum width of the ColorEditor.
+ + + + $kendo-color-editor-md-min-width + Number + $kendo-color-editor-min-width + 294px + + +
Description
The minimum width of the ColorEditor.
+ + + + $kendo-color-editor-lg-min-width + Number + 364px + 364px + + +
Description
The minimum width of the ColorEditor.
+ + $kendo-color-editor-border-width Number @@ -7069,6 +7099,66 @@ The following table lists the available variables for customizing the Material t
Description
The spacing between the ColorEditor header actions.
+ + $kendo-color-editor-sm-header-padding-y + String + $kendo-color-editor-header-padding-y + var(--kendo-spacing-3, 0.75rem) + + +
Description
The vertical padding of the small ColorEditor header.
+ + + + $kendo-color-editor-sm-header-padding-x + String + $kendo-color-editor-header-padding-x + var(--kendo-spacing-3, 0.75rem) + + +
Description
The horizontal padding of the small ColorEditor header.
+ + + + $kendo-color-editor-md-header-padding-y + String + $kendo-color-editor-header-padding-y + var(--kendo-spacing-3, 0.75rem) + + +
Description
The vertical padding of the medium ColorEditor header.
+ + + + $kendo-color-editor-md-header-padding-x + String + $kendo-color-editor-header-padding-x + var(--kendo-spacing-3, 0.75rem) + + +
Description
The horizontal padding of the medium ColorEditor header.
+ + + + $kendo-color-editor-lg-header-padding-y + String + k-spacing(4.5) + var(--kendo-spacing-4\.5, 1.125rem) + + +
Description
The vertical padding of the large ColorEditor header.
+ + + + $kendo-color-editor-lg-header-padding-x + String + k-spacing(4.5) + var(--kendo-spacing-4\.5, 1.125rem) + + +
Description
The horizontal padding of the large ColorEditor header.
+ + $kendo-color-editor-color-preview-width Number @@ -7099,6 +7189,96 @@ The following table lists the available variables for customizing the Material t
Description
The spacing between the colors in the ColorEditor preview.
+ + $kendo-color-editor-sm-preview-gap + String + k-spacing(2) + var(--kendo-spacing-2, 0.5rem) + + +
Description
The spacing between the colors in the small ColorEditor preview.
+ + + + $kendo-color-editor-md-preview-gap + String + $kendo-color-editor-preview-gap + var(--kendo-spacing-1, 0.25rem) + + +
Description
The spacing between the colors in the medium ColorEditor preview.
+ + + + $kendo-color-editor-lg-preview-gap + String + k-spacing(2) + var(--kendo-spacing-2, 0.5rem) + + +
Description
The spacing between the colors in the large ColorEditor preview.
+ + + + $kendo-color-editor-sm-color-preview-width + Number + 34px + 34px + + +
Description
The width of the small ColorEditor preview.
+ + + + $kendo-color-editor-sm-color-preview-height + Number + 12px + 12px + + +
Description
The height of the small ColorEditor preview.
+ + + + $kendo-color-editor-md-color-preview-width + Number + $kendo-color-editor-color-preview-width + 32px + + +
Description
The width of the medium ColorEditor preview.
+ + + + $kendo-color-editor-md-color-preview-height + Number + $kendo-color-editor-color-preview-height + 12px + + +
Description
The height of the medium ColorEditor preview.
+ + + + $kendo-color-editor-lg-color-preview-width + Number + 42px + 42px + + +
Description
The width of the large ColorEditor preview.
+ + + + $kendo-color-editor-lg-color-preview-height + Number + 16px + 16px + + +
Description
The height of the large ColorEditor preview.
+ + $kendo-color-editor-views-padding-y String @@ -7129,6 +7309,96 @@ The following table lists the available variables for customizing the Material t
Description
The spacing of the ColorEditor views container.
+ + $kendo-color-editor-sm-views-padding-y + String + $kendo-color-editor-spacer + var(--kendo-spacing-3, 0.75rem) + + +
Description
The vertical padding of the small ColorEditor views container.
+ + + + $kendo-color-editor-sm-views-padding-x + String + $kendo-color-editor-views-padding-y + var(--kendo-spacing-3, 0.75rem) + + +
Description
The horizontal padding of the small ColorEditor views container.
+ + + + $kendo-color-editor-sm-views-gap + String + $kendo-color-editor-spacer + var(--kendo-spacing-3, 0.75rem) + + +
Description
The spacing of the small ColorEditor views container.
+ + + + $kendo-color-editor-md-views-padding-y + String + $kendo-color-editor-views-padding-y + var(--kendo-spacing-3, 0.75rem) + + +
Description
The vertical padding of the medium ColorEditor views container.
+ + + + $kendo-color-editor-md-views-padding-x + String + $kendo-color-editor-views-padding-x + var(--kendo-spacing-3, 0.75rem) + + +
Description
The horizontal padding of the medium ColorEditor views container.
+ + + + $kendo-color-editor-md-views-gap + String + $kendo-color-editor-views-gap + var(--kendo-spacing-3, 0.75rem) + + +
Description
The spacing of the medium ColorEditor views container.
+ + + + $kendo-color-editor-lg-views-padding-y + String + k-spacing(4.5) + var(--kendo-spacing-4\.5, 1.125rem) + + +
Description
The vertical padding of the large ColorEditor views container.
+ + + + $kendo-color-editor-lg-views-padding-x + String + k-spacing(4.5) + var(--kendo-spacing-4\.5, 1.125rem) + + +
Description
The horizontal padding of the large ColorEditor views container.
+ + + + $kendo-color-editor-lg-views-gap + String + k-spacing(4.5) + var(--kendo-spacing-4\.5, 1.125rem) + + +
Description
The spacing of the large ColorEditor views container.
+ + $kendo-color-editor-color-gradient-focus-outline-color Color @@ -7159,6 +7429,48 @@ The following table lists the available variables for customizing the Material t
Description
The outline offset of the focused ColorGradient.
+ + $kendo-color-editor-sizes + Map + ( + sm: ( + min-width: $kendo-color-editor-sm-min-width, + header-padding-x: $kendo-color-editor-sm-header-padding-x, + header-padding-y: $kendo-color-editor-sm-header-padding-y, + views-padding-x: $kendo-color-editor-sm-views-padding-x, + views-padding-y: $kendo-color-editor-sm-views-padding-y, + preview-gap: $kendo-color-editor-sm-preview-gap, + preview-width: $kendo-color-editor-sm-color-preview-width, + preview-height: $kendo-color-editor-sm-color-preview-height, + + ), + md: ( + min-width: $kendo-color-editor-md-min-width, + header-padding-x: $kendo-color-editor-md-header-padding-x, + header-padding-y: $kendo-color-editor-md-header-padding-y, + views-padding-x: $kendo-color-editor-md-views-padding-x, + views-padding-y: $kendo-color-editor-md-views-padding-y, + preview-gap: $kendo-color-editor-md-preview-gap, + preview-width: $kendo-color-editor-md-color-preview-width, + preview-height: $kendo-color-editor-md-color-preview-height, + ), + lg: ( + min-width: $kendo-color-editor-lg-min-width, + header-padding-x: $kendo-color-editor-lg-header-padding-x, + header-padding-y: $kendo-color-editor-lg-header-padding-y, + views-padding-x: $kendo-color-editor-lg-views-padding-x, + views-padding-y: $kendo-color-editor-lg-views-padding-y, + preview-gap: $kendo-color-editor-lg-preview-gap, + preview-width: $kendo-color-editor-lg-color-preview-width, + preview-height: $kendo-color-editor-lg-color-preview-height, + ) +) + + + +
Description
The size map of the ColorEditor.
+ + @@ -7309,6 +7621,66 @@ The following table lists the available variables for customizing the Material t
Description
The border color of the ColorGradient.
+ + $kendo-color-gradient-sm-width + Number + 254px + 254px + + +
Description
The width of the small ColorGradient.
+ + + + $kendo-color-gradient-md-width + Number + $kendo-color-gradient-width + 294px + + +
Description
The width of the medium ColorGradient.
+ + + + $kendo-color-gradient-lg-width + Number + 328px + 328px + + +
Description
The width of the large ColorGradient.
+ + + + $kendo-color-gradient-sm-gap + String + k-spacing(2.5) + var(--kendo-spacing-2\.5, 0.625rem) + + +
Description
The spacing between the sections of the small ColorGradient.
+ + + + $kendo-color-gradient-md-gap + String + $kendo-color-gradient-gap + var(--kendo-spacing-3, 0.75rem) + + +
Description
The spacing between the sections of the medium ColorGradient.
+ + + + $kendo-color-gradient-lg-gap + String + k-spacing(4) + var(--kendo-spacing-4, 1rem) + + +
Description
The spacing between the sections of the large ColorGradient.
+ + $kendo-color-gradient-focus-border String @@ -7359,6 +7731,66 @@ The following table lists the available variables for customizing the Material t
Description
The height the ColorGradient canvas hsv rectangle.
+ + $kendo-color-gradient-sm-canvas-rectangle-height + Number + 210px + 210px + + +
Description
The height the small ColorGradient canvas hsv rectangle.
+ + + + $kendo-color-gradient-md-canvas-rectangle-height + Number + $kendo-color-gradient-canvas-rectangle-height + 180px + + +
Description
The height the medium ColorGradient canvas hsv rectangle.
+ + + + $kendo-color-gradient-lg-canvas-rectangle-height + Number + 266px + 266px + + +
Description
The height the large ColorGradient canvas hsv rectangle.
+ + + + $kendo-color-gradient-sm-canvas-gap + String + k-spacing(2.5) + var(--kendo-spacing-2\.5, 0.625rem) + + +
Description
The spacing between the items of the small ColorGradient canvas.
+ + + + $kendo-color-gradient-md-canvas-gap + String + $kendo-color-gradient-canvas-gap + var(--kendo-spacing-3, 0.75rem) + + +
Description
The spacing between the items of the medium ColorGradient canvas.
+ + + + $kendo-color-gradient-lg-canvas-gap + String + k-spacing(4) + var(--kendo-spacing-4, 1rem) + + +
Description
The spacing between the items of the large ColorGradient canvas.
+ + $kendo-color-gradient-slider-track-size Number @@ -7419,6 +7851,36 @@ The following table lists the available variables for customizing the Material t
Description
The background image of the ColorGradient alpha slider.
+ + $kendo-color-gradient-sm-slider-vertical-size + Number + 210px + 210px + + +
Description
The height of the small ColorGradient vertical slider.
+ + + + $kendo-color-gradient-md-slider-vertical-size + Number + $kendo-color-gradient-slider-vertical-size + 180px + + +
Description
The height of the medium ColorGradient vertical slider.
+ + + + $kendo-color-gradient-lg-slider-vertical-size + Number + 266px + 266px + + +
Description
The height of the large ColorGradient vertical slider.
+ + $kendo-color-gradient-draghandle-width Number @@ -7589,6 +8051,36 @@ The following table lists the available variables for customizing the Material t
Description
The text color of the ColorGradient input labels.
+ + $kendo-color-gradient-sm-input-width + Number + 46px + 46px + + +
Description
The width of the small ColorGradient input.
+ + + + $kendo-color-gradient-md-input-width + Number + $kendo-color-gradient-input-width + 50px + + +
Description
The width of the medium ColorGradient input.
+ + + + $kendo-color-gradient-lg-input-width + Number + 62px + 62px + + +
Description
The width of the large ColorGradient input.
+ + $kendo-color-gradient-contrast-ratio-font-weight String @@ -7609,6 +8101,41 @@ The following table lists the available variables for customizing the Material t
Description
The spacing between the items in the ColorGradient contrast tool.
+ + $kendo-color-gradient-sizes + Map + ( + sm: ( + width: $kendo-color-gradient-sm-width, + vertical-slider-height: $kendo-color-gradient-sm-slider-vertical-size, + rectangle-height: $kendo-color-gradient-sm-canvas-rectangle-height, + input-width: $kendo-color-gradient-sm-input-width, + gap: $kendo-color-gradient-sm-gap, + canvas-gap: $kendo-color-gradient-sm-canvas-gap + ), + md: ( + width: $kendo-color-gradient-md-width, + vertical-slider-height: $kendo-color-gradient-md-slider-vertical-size, + rectangle-height: $kendo-color-gradient-md-canvas-rectangle-height, + input-width: $kendo-color-gradient-md-input-width, + gap: $kendo-color-gradient-md-gap, + canvas-gap: $kendo-color-gradient-md-canvas-gap + ), + lg: ( + width: $kendo-color-gradient-lg-width, + vertical-slider-height: $kendo-color-gradient-lg-slider-vertical-size, + rectangle-height: $kendo-color-gradient-lg-canvas-rectangle-height, + input-width: $kendo-color-gradient-lg-input-width, + gap: $kendo-color-gradient-lg-gap, + canvas-gap: $kendo-color-gradient-lg-canvas-gap + ) +) + + + +
Description
The size map of the ColorGradient.
+ + @@ -7679,6 +8206,66 @@ The following table lists the available variables for customizing the Material t
Description
The height of the ColorPalette tile.
+ + $kendo-color-palette-tile-sm-width + String + k-spacing(5.5) + var(--kendo-spacing-5\.5, 1.375rem) + + + + + + + $kendo-color-palette-tile-sm-height + String + $kendo-color-palette-tile-sm-width + var(--kendo-spacing-5\.5, 1.375rem) + + +
Description
The height of the small ColorPalette tile.
+ + + + $kendo-color-palette-tile-md-width + String + $kendo-color-palette-tile-width + var(--kendo-spacing-6, 1.5rem) + + +
Description
The width of the medium ColorPalette tile.
+ + + + $kendo-color-palette-tile-md-height + String + $kendo-color-palette-tile-height + var(--kendo-spacing-6, 1.5rem) + + +
Description
The height of the medium ColorPalette tile.
+ + + + $kendo-color-palette-tile-lg-width + String + k-spacing(8) + var(--kendo-spacing-8, 2rem) + + +
Description
The width of the large ColorPalette tile.
+ + + + $kendo-color-palette-tile-lg-height + String + $kendo-color-palette-tile-lg-width + var(--kendo-spacing-8, 2rem) + + +
Description
The height of the large ColorPalette tile.
+ + $kendo-color-palette-tile-focus-shadow List @@ -7709,6 +8296,29 @@ The following table lists the available variables for customizing the Material t
Description
The shadow of the ColorPalette selected tile.
+ + $kendo-color-palette-sizes + Map + ( + sm: ( + width: $kendo-color-palette-tile-sm-width, + height: $kendo-color-palette-tile-sm-height + ), + md: ( + width: $kendo-color-palette-tile-md-width, + height: $kendo-color-palette-tile-md-height + ), + lg: ( + width: $kendo-color-palette-tile-lg-width, + height: $kendo-color-palette-tile-lg-height + ) +) + + + +
Description
The size map of the ColorPalette.
+ +