diff --git a/packages/react-core/src/components/Slider/SliderStep.tsx b/packages/react-core/src/components/Slider/SliderStep.tsx index 36c184fe8be..81ff4afa54b 100644 --- a/packages/react-core/src/components/Slider/SliderStep.tsx +++ b/packages/react-core/src/components/Slider/SliderStep.tsx @@ -1,6 +1,7 @@ import * as React from 'react'; import styles from '@patternfly/react-styles/css/components/Slider/slider'; import { css } from '@patternfly/react-styles'; +import sliderStepLeft from '@patternfly/react-tokens/dist/esm/c_slider__step_Left'; export interface SliderStepProps extends Omit, 'label'> { /** Additional classes added to the slider step. */ @@ -26,7 +27,7 @@ export const SliderStep: React.FunctionComponent = ({ isActive = false, ...props }: SliderStepProps) => { - const style = { '--pf-v5-c-slider__step--Left': `${value}%` } as React.CSSProperties; + const style = { [sliderStepLeft.name]: `${value ? value : sliderStepLeft.value}%` } as React.CSSProperties; return (
{!isTickHidden &&
}