Update use of color values

After rebasing on trunk, previous color values had been retired via #43994 and #43773
WordPress · Oct 3, 2022 · cda73dd · cda73dd
1 parent b943451
commit cda73dd
Show file tree

Hide file tree

Showing 3 changed files with 8 additions and 10 deletions.
diff --git a/packages/components/src/slider-control/slider/hook.ts b/packages/components/src/slider-control/slider/hook.ts
@@ -38,8 +38,8 @@ export function useSlider(
 		min = 0,
 		size = 'default',
 		style,
-		thumbColor = COLORS.admin.theme,
-		trackColor = COLORS.admin.theme,
+		thumbColor = COLORS.ui.theme,
+		trackColor = COLORS.ui.theme,
 		trackBackgroundColor = CONFIG.controlBackgroundDimColor,
 		value: valueProp,
 		...otherProps

diff --git a/packages/components/src/slider-control/styles.ts b/packages/components/src/slider-control/styles.ts
@@ -200,12 +200,10 @@ export const marks = css`
 `;
 
 const markFill = ( { disabled, isFilled }: MarkProps ) => {
-	let backgroundColor = isFilled
-		? COLORS.admin.theme
-		: COLORS.lightGray[ 600 ];
+	let backgroundColor = isFilled ? COLORS.ui.theme : COLORS.gray[ 300 ];
 
 	if ( disabled ) {
-		backgroundColor = COLORS.lightGray[ 800 ];
+		backgroundColor = COLORS.gray[ 400 ];
 	}
 
 	return css( { backgroundColor } );
@@ -225,14 +223,14 @@ export const mark = ( markProps: MarkProps ) => {
 
 const markLabelFill = ( { isFilled }: MarkProps ) => {
 	return css( {
-		color: isFilled ? COLORS.darkGray[ 300 ] : COLORS.lightGray[ 600 ],
+		color: isFilled ? COLORS.gray[ 700 ] : COLORS.gray[ 300 ],
 	} );
 };
 
 export const markLabel = ( markProps: MarkProps ) => {
 	return css`
 		box-sizing: border-box;
-		color: ${ COLORS.lightGray[ 600 ] };
+		color: ${ COLORS.gray[ 300 ] };
 		left: 0;
 		font-size: 11px;
 		position: absolute;

diff --git a/packages/components/src/slider-control/types.ts b/packages/components/src/slider-control/types.ts
@@ -24,15 +24,15 @@ export type SliderColors = {
 	/**
 	 * Allows customization of the thumb's color.
 	 *
-	 * @default COLORS.admin.theme
+	 * @default COLORS.ui.theme
 	 */
 	thumbColor?: CSSProperties[ 'color' ];
 	/**
 	 * CSS color string to customize the track elements foreground color. This
 	 * is the portion of the Slider's track representing progress or the actual
 	 * value selected.
 	 *
-	 * @default COLORS.admin.theme
+	 * @default COLORS.ui.theme
 	 */
 	trackColor?: CSSProperties[ 'color' ];
 	/**