如何更改rc-slider工具提示的颜色？

Question

http://react-component.github.io/slider/

我尝试设置了overlayStyle的颜色和背景色，但是它并没有更改实际“气泡”的默认灰色/黑色。

import 'rc-slider/assets/index.css';
import 'rc-tooltip/assets/bootstrap.css';
import React, { Component } from 'react'
import { Container } from 'semantic-ui-react'
import Tooltip from 'rc-tooltip';
import Slider, { Handle } from 'rc-slider';

const handle = (props: any) => {
    const { value, dragging, index, ...restProps } = props;
    return (
        <Tooltip
            overlayStyle={{ 'backgroundColor': '#23bcec'  // <------ This changes the color behind the bubble :(
                            'color': 'red'}} <------ Doesn't work
            prefixCls="rc-slider-tooltip"
            overlay={value}
            visible={dragging}
            placement="top"
            key={index}
        >
            <Handle value={value} {...restProps} />
        </Tooltip>
    );
};

interface IRadioSliderProps {
    leftText: string
    middleText?: string
    rightText: string
    steps: number
    startValue: number
    onChange: (newValue: number) => void
}

interface IRadioSliderState {
    currentValue: number
}

export default class RadioSlider extends Component<IRadioSliderProps, IRadioSliderState> {
    private readonly marks: any
    constructor(props: IRadioSliderProps) {
        super(props)
        this.marks = this.createTickMarks(props)
        this.state = {
            currentValue: props.startValue
        }
    }

    public render(): React.ReactNode {
        return (
            <div className='answer-slider-container'>
                <Container text={true}>
                    <div>
                        <Slider
                            handle={handle}
                            handleStyle={{ 'borderColor': '#23bcec', 'backgroundColor': '#23bcec' }}
                            activeDotStyle={{ 'borderColor': '#23bcec', 'backgroundColor': '#23bcec' }}
                            trackStyle={{ 'backgroundColor': '#23bcec' }}
                            dots={true}
                            marks={this.marks}
                            min={1}
                            max={this.props.steps}
                            defaultValue={this.state.currentValue}
                            onChange={(val: number) => this.handleChange(val)}
                        />
                    </div>
                </Container>
            </div>
        );
    }

    private createTickMarks(props: IRadioSliderProps) {
        const marks = { 1: props.leftText }
        marks[props.steps] = props.rightText
        if (props.middleText !== undefined) {
            marks[props.steps / 2] = props.middleText
        }
        return marks
    }

    private handleChange(newValue: number) {
        this.setState({ currentValue: newValue })
        this.props.onChange(newValue)
    }
}