@progress/kendo-theme-fluent 6.5.0-dev.0 → 6.5.0-dev.2

package/scss/chip/_variables.scss

@@ -37,7 +37,7 @@ $kendo-chip-solid-disabled-border: var( --kendo-disabled-border, inherit ) !defa
 $kendo-chip-outline-disabled-bg: var( $kendo-component-bg, transparent ) !default;
 /// The border color of the outline disabled Chip.
 /// @group chip
-$kendo-chip-outline-disabled-border: get-theme-color-var( neutral-90 ) !default;
+$kendo-chip-outline-disabled-border: k-get-theme-color-var( neutral-90 ) !default;
 
 /// The offset of the outline focused Chip.
 /// @group chip
@@ -129,8 +129,8 @@ $_tc-base-matrix: (
         hover: (30, 190, 30),
         focus: (20, 160, 130),
         focus-hover: (20, 190, 130),
-        selected: (get-theme-color-var( primary-100 ), $kendo-color-white, get-theme-color-var( primary-100 )),
-        selected-hover: (get-theme-color-var( primary-100 ), $kendo-color-white, get-theme-color-var( primary-100 )),
+        selected: (k-get-theme-color-var( primary-100 ), $kendo-color-white, k-get-theme-color-var( primary-100 )),
+        selected-hover: (k-get-theme-color-var( primary-100 ), $kendo-color-white, k-get-theme-color-var( primary-100 )),
         disabled: (var( --kendo-disabled-bg, inherit ), var( --kendo-disabled-text, inherit ), var( --kendo-disabled-border, inherit ))
     ),
     outline: (
@@ -169,12 +169,12 @@ $_tc-brand-matrix: (
 // The color matrix for the warning Chips
 $_tc-warning-matrix: (
     solid: (
-        normal: (20, get-theme-color-var( grey-160 ), 20),
-        hover: (30, get-theme-color-var( grey-190 ), 30),
-        focus: (20, get-theme-color-var( grey-160 ), 160),
-        focus-hover: (20, get-theme-color-var( grey-190 ), 160),
-        selected: (40, get-theme-color-var( grey-190 ), 40),
-        selected-hover: (30, get-theme-color-var( grey-190 ), 30),
+        normal: (20, k-get-theme-color-var( grey-160 ), 20),
+        hover: (30, k-get-theme-color-var( grey-190 ), 30),
+        focus: (20, k-get-theme-color-var( grey-160 ), 160),
+        focus-hover: (20, k-get-theme-color-var( grey-190 ), 160),
+        selected: (40, k-get-theme-color-var( grey-190 ), 40),
+        selected-hover: (30, k-get-theme-color-var( grey-190 ), 30),
         disabled: (var( --kendo-disabled-bg, inherit ), var( --kendo-disabled-text, inherit ), var( --kendo-disabled-border, inherit ))
     ),
     outline: (
@@ -195,7 +195,7 @@ $kendo-chip-theme-colors: () !default;
 @each $fill-mode, $ui-states in $_tc-base-matrix {
     $kendo-chip-theme-colors: map.deep-merge(
         $kendo-chip-theme-colors,
-        generate-fill-mode-theme-variation( $fill-mode, base, neutral, $ui-states )
+        k-generate-fill-mode-theme-variation( $fill-mode, base, neutral, $ui-states )
     );
 }
 
@@ -204,7 +204,7 @@ $kendo-chip-theme-colors: () !default;
     @each $brand-color in $kendo-chip-brand-colors {
         $kendo-chip-theme-colors: map.deep-merge(
             $kendo-chip-theme-colors,
-            generate-fill-mode-theme-variation( $fill-mode, $brand-color, $brand-color, $ui-states )
+            k-generate-fill-mode-theme-variation( $fill-mode, $brand-color, $brand-color, $ui-states )
         )
     }
 }
@@ -213,7 +213,7 @@ $kendo-chip-theme-colors: () !default;
 @each $fill-mode, $ui-states in $_tc-warning-matrix {
     $kendo-chip-theme-colors: map.deep-merge(
         $kendo-chip-theme-colors,
-        generate-fill-mode-theme-variation( $fill-mode, warning, warning, $ui-states )
+        k-generate-fill-mode-theme-variation( $fill-mode, warning, warning, $ui-states )
     );
 }
 

package/scss/color-preview/_variables.scss

@@ -2,7 +2,7 @@
 
 /// Border radius of the color preview.
 /// @group color-preview
-$kendo-color-preview-border-radius: var( --kendo-border-radius-md, 0 ) !default;
+$kendo-color-preview-border-radius: var( --kendo-border-radius-md, #{$kendo-border-radius-md} ) !default;
 /// Border width of the color preview.
 /// @group color-preview
 $kendo-color-preview-border-width: 1px !default;
@@ -14,17 +14,17 @@ $kendo-color-preview-bg: transparent !default;
 $kendo-color-preview-text: inherit !default;
 /// Border color of the color preview.
 /// @group color-preview
-$kendo-color-preview-border: get-theme-color-var( neutral-60 ) !default;
+$kendo-color-preview-border: k-get-theme-color-var( neutral-60 ) !default;
 /// Hover Border color of the color preview.
 /// @group color-preview
-$kendo-color-preview-hover-border: get-theme-color-var( neutral-60 ) !default;
+$kendo-color-preview-hover-border: k-get-theme-color-var( neutral-60 ) !default;
 
 /// Background color of the color preview when no color is selected.
 /// @group color-preview
 $kendo-color-preview-no-color-bg: $kendo-color-white !default;
 /// Text color of the color preview when no color is selected.
 /// @group color-preview
-$kendo-color-preview-no-color-text: get-theme-color( error, 190 ) !default;
+$kendo-color-preview-no-color-text: k-get-theme-color( error, 190 ) !default;
 /// Border color of the color preview when no color is selected.
 /// @group color-preview
 $kendo-color-preview-no-color-border: currentColor !default;

package/scss/coloreditor/_variables.scss

@@ -2,92 +2,91 @@
 @use "sass:math";
 @use "../core/" as *;
 
-/// Spacer of the color editor.
+/// The spacer of the ColorEditor.
 /// @group coloreditor
 $kendo-color-editor-spacer: map.get( $kendo-spacing, 2 ) !default;
 
-/// Min width of the color editor.
+/// The minimum width of the ColorEditor.
 /// @group coloreditor
 $kendo-color-editor-min-width: 260px !default;
-/// Border width of the color editor.
+/// The width of the border around the ColorEditor.
 /// @group coloreditor
 $kendo-color-editor-border-width: 1px !default;
-/// Border radius of the color editor.
+/// The border radius of the ColorEditor.
 /// @group coloreditor
-$kendo-color-editor-border-radius: var( --kendo-border-radius-md, 0 ) !default;
-/// Font family of the color editor.
+$kendo-color-editor-border-radius: var( --kendo-border-radius-md, #{$kendo-border-radius-md} ) !default;
+/// The font family of the ColorEditor.
 /// @group coloreditor
 $kendo-color-editor-font-family: var( --kendo-font-family, inherit ) !default;
-/// Font size of the color editor.
+/// The font size of the ColorEditor.
 /// @group coloreditor
 $kendo-color-editor-font-size: var( --kendo-font-size, inherit ) !default;
-/// Line height of the color editor.
+/// The line height of the ColorEditor.
 /// @group coloreditor
 $kendo-color-editor-line-height: var( --kendo-line-height, normal ) !default;
-/// Background color of the color editor.
-/// @group coloreditor
-$kendo-color-editor-bg: var( --kendo-component-bg, initial ) !default;
-/// Text color of the color editor.
+/// The text color of the ColorEditor.
 /// @group coloreditor
 $kendo-color-editor-text: var( --kendo-component-text, initial ) !default;
-/// Border color of the color editor.
+/// The background color of the ColorEditor.
+/// @group coloreditor
+$kendo-color-editor-bg: var( --kendo-component-bg, initial ) !default;
+/// The border color of the ColorEditor.
 /// @group coloreditor
 $kendo-color-editor-border: var( --kendo-component-border, initial ) !default;
-/// Shadow of the color editor.
+/// The box shadow of the ColorEditor.
 /// @group coloreditor
 $kendo-color-editor-shadow: var( --kendo-box-shadow-depth-2, none ) !default;
 
-/// Focus border color of the color editor.
+/// The border color of the focused ColorEditor.
 /// @group coloreditor
-$kendo-color-editor-focus-border: get-theme-color-var( neutral-20 ) !default;
-/// Focus shadow of the color editor.
+$kendo-color-editor-focus-border: k-get-theme-color-var( neutral-20 ) !default;
+/// The box shadow of the focused ColorEditor.
 /// @group coloreditor
 $kendo-color-editor-focus-shadow: var( --kendo-box-shadow-depth-3, none ) !default;
 
-/// Horizontal padding of the color editor header.
+/// The vertical padding of the ColorEditor header.
 /// @group coloreditor
 $kendo-color-editor-header-padding-y: $kendo-color-editor-spacer !default;
-/// Vertical padding of the color editor header.
+/// The horizontal padding of the ColorEditor header.
 /// @group coloreditor
 $kendo-color-editor-header-padding-x: $kendo-color-editor-header-padding-y !default;
-/// Spacing of the color editor header.
+/// The spacing between the ColorEditor header actions.
 /// @group coloreditor
 $kendo-color-editor-header-actions-spacing: math.div( $kendo-color-editor-spacer, 2 ) !default;
 
-/// Width of the color editor preview.
+/// The width of the ColorEditor preview.
 /// @group coloreditor
 $kendo-color-editor-color-preview-width: 34px !default;
-/// Height of the color editor preview.
+/// The height of the ColorEditor preview.
 /// @group coloreditor
 $kendo-color-editor-color-preview-height: 14px !default;
-
-/// Spacing between the colors in the color editor preview.
+/// The spacing between the colors in the ColorEditor preview.
 /// @group coloreditor
 $kendo-color-editor-preview-spacing: map.get( $kendo-spacing, 1 ) !default;
 
-/// Horizontal padding of the color editor views container.
+/// The vertical padding of the ColorEditor views container.
 /// @group coloreditor
 $kendo-color-editor-views-padding-y: $kendo-color-editor-spacer !default;
-/// Vertical padding of the color editor views container.
+/// The horizontal padding of the ColorEditor views container.
 /// @group coloreditor
 $kendo-color-editor-views-padding-x: $kendo-color-editor-views-padding-y !default;
-/// Spacing of the color editor views container.
+/// The spacing of the ColorEditor views container.
 /// @group coloreditor
 $kendo-color-editor-views-spacing: $kendo-color-editor-spacer !default;
 
-/// Horizontal padding of the color editor footer.
+/// The vertical padding of the ColorEditor footer.
 /// @group coloreditor
 $kendo-color-editor-footer-padding-y: map.get( $kendo-spacing, 2 ) !default;
-/// Vertical padding of the color editor footer.
+/// The horizontal padding of the ColorEditor footer.
 /// @group coloreditor
 $kendo-color-editor-footer-padding-x: map.get( $kendo-spacing, 2 ) !default;
 
-/// The color of the focused colorgradient.
+/// The outline color of the focused ColorGradient.
 /// @group coloreditor
 $kendo-color-editor-color-gradient-focus-outline-color: rgba(0, 0, 0, 0.3) !default;
-/// The outline of the focused colorgradient.
+/// The outline width of the focused ColorGradient.
 /// @group coloreditor
 $kendo-color-editor-color-gradient-focus-outline: 2px !default;
-/// The outline offset of the focused colorgradient.
+/// The outline offset of the focused ColorGradient.
 /// @group coloreditor
 $kendo-color-editor-color-gradient-focus-outline-offset: 2px !default;

package/scss/colorgradient/_variables.scss

@@ -2,151 +2,151 @@
 @use "sass:math";
 @use "../core/" as *;
 
-/// Spacer of the color gradient.
+/// The spacer of the ColorGradient.
 /// @group cologradient
 $kendo-color-gradient-spacer: map.get( $kendo-spacing, 4 ) !default;
 
-/// Default width of the color gradient.
+/// The width of the ColorGradient.
 /// @group cologradient
 $kendo-color-gradient-width: 260px !default;
-/// Border width of the color gradient.
+/// The width of the border around the ColorGradient.
 /// @group cologradient
 $kendo-color-gradient-border-width: 1px !default;
-/// Border radius of the color gradient.
+/// The border radius of the ColorGradient.
 /// @group cologradient
-$kendo-color-gradient-border-radius: var( --kendo-border-radius-md, 0 ) !default;
-/// Vertical padding of the color gradient.
+$kendo-color-gradient-border-radius: var( --kendo-border-radius-md, #{$kendo-border-radius-md} ) !default;
+/// The vertical padding of the ColorGradient.
 /// @group cologradient
 $kendo-color-gradient-padding-y: $kendo-color-gradient-spacer !default;
-/// Horizontal padding of the color gradient.
+/// The horizontal padding of the ColorGradient.
 /// @group cologradient
 $kendo-color-gradient-padding-x: math.div( $kendo-color-gradient-spacer, 2 ) !default;
-/// Spacing of the color gradient.
+/// The spacing between the sections of the ColorGradient.
 /// @group cologradient
 $kendo-color-gradient-spacing: $kendo-color-gradient-spacer !default;
-/// Font family of the color gradient.
+/// The font family of the ColorGradient.
 /// @group cologradient
 $kendo-color-gradient-font-family: var( --kendo-font-family, inherit ) !default;
-/// Font size of the color gradient.
+/// The font size of the ColorGradient.
 /// @group cologradient
 $kendo-color-gradient-font-size: var( --kendo-font-size, inherit ) !default;
-/// Line height of the color gradient.
+/// The line height of the ColorGradient.
 /// @group cologradient
 $kendo-color-gradient-line-height: var( --kendo-line-height, normal ) !default;
 
-/// Background color of the color gradient.
-/// @group cologradient
-$kendo-color-gradient-bg: var( --kendo-component-bg, initial ) !default;
-/// Text color of the color gradient.
+/// The text color of the ColorGradient.
 /// @group cologradient
 $kendo-color-gradient-text: var( --kendo-component-text, initial ) !default;
-/// Border color of the color gradient.
+/// The background color of the ColorGradient.
+/// @group cologradient
+$kendo-color-gradient-bg: var( --kendo-component-bg, initial ) !default;
+/// The border color of the ColorGradient.
 /// @group cologradient
 $kendo-color-gradient-border: var( --kendo-component-border, initial ) !default;
-/// Shadow of the color gradient.
+/// The box shadow of the ColorGradient.
 /// @group cologradient
 $kendo-color-gradient-shadow: var( --kendo-box-shadow-depth-2, none ) !default;
 
-/// Focus border of the color gradient.
+/// The border color of the focused ColorGradient.
 /// @group cologradient
-$kendo-color-gradient-focus-border: get-theme-color-var( neutral-20 ) !default;
-/// Focus shadow of the color gradient.
+$kendo-color-gradient-focus-border: k-get-theme-color-var( neutral-20 ) !default;
+/// The box shadow of the focused ColorGradient.
 /// @group cologradient
 $kendo-color-gradient-focus-shadow: var( --kendo-box-shadow-depth-3, none ) !default;
 
-/// Border radius of the color gradient canvas.
-/// @group cologradient
-$kendo-color-gradient-canvas-border-radius: var( --kendo-border-radius-md, 0 ) !default;
-/// Border width of the color gradient canvas.
+/// The width of the border around the ColorGradient canvas.
 /// @group cologradient
 $kendo-color-gradient-canvas-border-width: 0 !default;
-/// Spacing of the color gradient canvas.
+/// The border radius of the ColorGradient canvas.
+/// @group cologradient
+$kendo-color-gradient-canvas-border-radius: var( --kendo-border-radius-md, #{$kendo-border-radius-md} ) !default;
+/// The spacing between the items of the ColorGradient canvas.
 /// @group cologradient
 $kendo-color-gradient-canvas-spacing: math.div( $kendo-color-gradient-spacer, 2 ) !default;
-/// Height the color gradient canvas hsv rectangle.
+/// The height the ColorGradient canvas hsv rectangle.
 /// @group cologradient
 $kendo-color-gradient-canvas-rectangle-height: 180px !default;
-/// Border color of the color gradient canvas hsv rectangle.
+/// The border color of the ColorGradient canvas hsv rectangle.
 /// @group cologradient
-$kendo-color-gradient-canvas-rectangle-border: get-theme-color-var( neutral-30 ) !default;
-/// Shadow of the color gradient canvas draghandle.
+$kendo-color-gradient-canvas-rectangle-border: k-get-theme-color-var( neutral-30 ) !default;
+/// The box shadow of the ColorGradient canvas drag handle.
 /// @group cologradient
 $kendo-color-gradient-canvas-draghandle-shadow: 0px 0.6px 1.8px rgba(0, 0, 0, 0.1), 0px 3.2px 7.2px rgba(0, 0, 0, 0.13), inset 0px 0px 0px 3px #FFFFFF !default;
 
-/// Default input width of the color gradient.
-/// @group cologradient
-$kendo-color-gradient-input-width: 48px !default;
-/// Input spacing of the color gradient.
-/// @group cologradient
-$kendo-color-gradient-input-spacing: math.div( $kendo-color-gradient-spacer, 4 ) !default;
-/// Input label font size of the color gradient.
-/// @group cologradient
-$kendo-color-gradient-input-label-font-size: var( --kendo-font-size-sm, inherit ) !default;
-/// Input label spacing of the color gradient.
-/// @group cologradient
-$kendo-color-gradient-input-label-spacing: math.div( $kendo-color-gradient-spacer, 4 ) !default;
-/// Input label text color of the color gradient.
-/// @group cologradient
-$kendo-color-gradient-input-label-text: var( --kendo-subtle-text, inherit ) !default;
-
-/// Font weight of the color gradient contrast ratio text.
-/// @group cologradient
-$kendo-color-gradient-contrast-ratio-font-weight: var( --kendo-font-weight-bold, normal ) !default;
-/// Spacing of the color gradient contrast tool.
-/// @group cologradient
-$kendo-color-gradient-contrast-spacing: math.div( $kendo-color-gradient-spacer, 1.5 ) !default;
-
-/// The size of the color gradient slider.
+/// The width of the ColorGradient slider.
 /// @group cologradient
 $kendo-color-gradient-slider-track-size: 20px !default;
-/// Border radius of the color gradient slider.
+/// The border radius of the ColorGradient slider.
 /// @group cologradient
-$kendo-color-gradient-slider-border-radius: var( --kendo-border-radius-md, 0 ) !default;
-/// Border width of the color gradient slider.
+$kendo-color-gradient-slider-border-radius: var( --kendo-border-radius-md, #{$kendo-border-radius-md} ) !default;
+/// The width of the border around the ColorGradient slider.
 /// @group cologradient
 $kendo-color-gradient-slider-border-width: 1px !default;
-/// Border color of the color gradient slider.
+/// The color of the border around the ColorGradient slider.
 /// @group cologradient
-$kendo-color-gradient-slider-border: get-theme-color-var( neutral-30 ) !default;
+$kendo-color-gradient-slider-border: k-get-theme-color-var( neutral-30 ) !default;
 
-/// Height of the color gradient vertical slider.
+/// The height of the ColorGradient vertical slider.
 /// @group cologradient
 $kendo-color-gradient-slider-vertical-size: 180px !default;
-/// Width of the color gradient horizontal slider.
+/// The width of the ColorGradient horizontal slider.
 /// @group cologradient
 $kendo-color-gradient-slider-horizontal-size: 100% !default;
-/// Background image of the color gradient alpha slider.
+/// The background image of the ColorGradient alpha slider.
 /// @group cologradient
 $kendo-color-gradient-slider-alpha-bgr: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAuSURBVHgBxYyxDQAwDMJIL+YT+DjtzFRliUfLcklqBCRT4eCTxbD6kdL2/LgYXqpvCbs3kBv/AAAAAElFTkSuQmCC" !default;
 
-/// Width of the color gradient draghandle.
+/// The width of the ColorGradient canvas drag handle.
 /// @group cologradient
 $kendo-color-gradient-draghandle-width: 20px !default;
-/// Height of the color gradient draghandle.
+/// The height of the ColorGradient canvas drag handle.
 /// @group cologradient
 $kendo-color-gradient-draghandle-height: 20px !default;
-/// Border width of the color gradient draghandle.
+/// The width of the border around the ColorGradient canvas drag handle.
 /// @group cologradient
 $kendo-color-gradient-draghandle-border-width: 1px !default;
-/// Border color of the color gradient draghandle.
+/// The color of the border around the ColorGradient canvas drag handle.
 /// @group cologradient
-$kendo-color-gradient-draghandle-border: get-theme-color-var( neutral-110 ) !default;
-/// Shadow of the color gradient draghandle.
+$kendo-color-gradient-draghandle-border: k-get-theme-color-var( neutral-110 ) !default;
+/// The box shadow of the ColorGradient canvas drag handle.
 /// @group cologradient
 $kendo-color-gradient-draghandle-shadow: var( --kendo-box-shadow-depth-2, none ) !default;
-/// Focus shadow of the color gradient draghandle.
+/// The color of the border around the focused ColorGradient canvas drag handle.
 /// @group cologradient
-$kendo-color-gradient-draghandle-focus-shadow: $kendo-color-gradient-draghandle-shadow !default;
-/// Focus border color of the color gradient draghandle.
+$kendo-color-gradient-draghandle-focus-border: k-get-theme-color-var( neutral-160 ) !default;
+/// The box shadow of the focused ColorGradient canvas drag handle.
 /// @group cologradient
-$kendo-color-gradient-draghandle-focus-border: get-theme-color-var( neutral-160 ) !default;
-/// Hover shadow of the color gradient draghandle.
+$kendo-color-gradient-draghandle-focus-shadow: $kendo-color-gradient-draghandle-shadow !default;
+/// The box shadow of the hovered ColorGradient canvas drag handle.
 /// @group cologradient
 $kendo-color-gradient-draghandle-hover-shadow: $kendo-color-gradient-draghandle-focus-shadow !default;
 
-/// Vertical offset of the color gradient canvas draghandle.
+/// The vertical offset of the ColorGradient canvas drag handle.
 /// @group cologradient
 $kendo-color-gradient-canvas-draghandle-offset-y: ( -1 * math.div( $kendo-color-gradient-draghandle-height, 2 ) ) !default;
-/// Horizontal offset of the color gradient canvas draghandle.
+/// The horizontal offset of the ColorGradient canvas drag handle.
 /// @group cologradient
 $kendo-color-gradient-canvas-draghandle-offset-x: ( -1 * math.div( $kendo-color-gradient-draghandle-width, 2 ) ) !default;
+
+/// The width of the ColorGradient input.
+/// @group cologradient
+$kendo-color-gradient-input-width: 48px !default;
+/// The spacing between the ColorGradient inputs.
+/// @group cologradient
+$kendo-color-gradient-input-spacing: math.div( $kendo-color-gradient-spacer, 4 ) !default;
+/// The font size of the ColorGradient input labels.
+/// @group cologradient
+$kendo-color-gradient-input-label-font-size: var( --kendo-font-size-sm, inherit ) !default;
+/// The spacing between the ColorGradient inputs and their labels.
+/// @group cologradient
+$kendo-color-gradient-input-label-spacing: math.div( $kendo-color-gradient-spacer, 4 ) !default;
+/// The text color of the ColorGradient input labels.
+/// @group cologradient
+$kendo-color-gradient-input-label-text: var( --kendo-subtle-text, inherit ) !default;
+
+/// The font weight of the ColorGradient contrast ratio text.
+/// @group cologradient
+$kendo-color-gradient-contrast-ratio-font-weight: var( --kendo-font-weight-bold, normal ) !default;
+/// The spacing between the items in the ColorGradient contrast tool.
+/// @group cologradient
+$kendo-color-gradient-contrast-spacing: math.div( $kendo-color-gradient-spacer, 1.5 ) !default;

package/scss/colorpalette/_variables.scss

@@ -1,49 +1,49 @@
 @use "sass:map";
 @use "../core/" as *;
 
-/// Font family of the color palette.
+/// The font family of the ColorPalette.
 /// @group colorpalette
 $kendo-color-palette-font-family: var( --kendo-font-family, inherit ) !default;
-/// Font size of the color palette.
+/// The font size of the ColorPalette.
 /// @group colorpalette
 $kendo-color-palette-font-size: var( --kendo-font-size, inherit ) !default;
-/// Line height of the color palette.
+/// The line height of the ColorPalette.
 /// @group colorpalette
 $kendo-color-palette-line-height: 0 !default;
 
-/// Outline width of the color palette tile.
+/// The outline width of the ColorPalette tile.
 /// @group colorpalette
 $kendo-color-palette-tile-outline-width: 1px !default;
-/// Outline style of the color palette tile.
+/// The outline style of the ColorPalette tile.
 /// @group colorpalette
 $kendo-color-palette-tile-outline-style: solid !default;
-/// Outline color of the color palette tile.
+/// The outline color of the ColorPalette tile.
 /// @group colorpalette
 $kendo-color-palette-tile-outline: transparent !default;
-/// Width of the color palette tile.
+/// The width of the ColorPalette tile.
 /// @group colorpalette
 $kendo-color-palette-tile-width: map.get( $kendo-spacing, 6 ) !default;
-/// Height of the color palette tile.
+/// The height of the ColorPalette tile.
 /// @group colorpalette
 $kendo-color-palette-tile-height: $kendo-color-palette-tile-width !default;
-/// Focus outline color of the color palette tile.
+/// The outline color of the ColorPalette focused tile.
 /// @group colorpalette
-$kendo-color-palette-tile-focus-outline: get-theme-color-var( neutral-130 ) !default;
-/// Focus shadow of the color palette tile.
+$kendo-color-palette-tile-focus-outline: k-get-theme-color-var( neutral-130 ) !default;
+/// The shadow of the ColorPalette focused tile.
 /// @group colorpalette
 $kendo-color-palette-tile-focus-shadow: inset 0 0 0 2px $kendo-color-white !default;
-/// Hover outline color of the color palette tile.
+/// The outline color of the ColorPalette hovered tile.
 /// @group colorpalette
-$kendo-color-palette-tile-hover-outline: get-theme-color-var( neutral-20 ) !default;
-/// Hover shadow of the color palette tile.
+$kendo-color-palette-tile-hover-outline: k-get-theme-color-var( neutral-20 ) !default;
+/// The shadow of the ColorPalette hovered tile.
 /// @group colorpalette
 $kendo-color-palette-tile-hover-shadow: inset 0 0 0 2px $kendo-color-palette-tile-hover-outline, inset 0 0 0 4px $kendo-color-white !default;
-/// Selected outline color of the color palette tile.
+/// The outline color of the ColorPalette selected tile.
 /// @group colorpalette
 $kendo-color-palette-tile-selected-outline: $kendo-color-palette-tile-hover-outline !default;
-/// Selected shadow of the color palette tile.
+/// The shadow of the ColorPalette selected tile.
 /// @group colorpalette
 $kendo-color-palette-tile-selected-shadow: $kendo-color-palette-tile-hover-shadow !default;
-/// Selected hover outline color of the color palette tile.
+/// The outline color of the ColorPalette selected hover tile.
 /// @group colorpalette
 $kendo-color-palette-tile-selected-hover-outline: $kendo-color-palette-tile-focus-outline !default;

package/scss/core/_index.scss

@@ -1,24 +1,19 @@
 @use "sass:map";
 
-// Functions
-@forward "./functions";
+// Palettes
+@use "./color-system/palettes" as *;
 
 // Variables
+@use "./variables" as *;
 @forward "./variables";
 
-// Mixins
-@forward "./mixins";
-
-// Color System
-@forward "./color-system";
+@forward "@progress/kendo-theme-core/scss/index.import.scss" with (
+    $kendo-palettes: $kendo-fluent-palettes
+);
 
 // Helpers
 @use "./helpers";
 
-// Common styles
-@use "./layout";
-@use "./theme";
-
 // Module System
 @use "./module-system/" as module;