[Slider] Add customization example

I’m reffering to the implementation code here: https://github.com/mui-org/material-ui/blob/next/packages/material-ui-lab/src/Slider/Slider.js Check out this REPL: https://codesandbox.io/s/w65j3jmlr5 the Thumb -MuiSlider activated class is supposed to be rgba(84, 78, 93, 0.16) but is returning as rgba(156, 39, 176, 0.16) (the primary color fade)

    sliderThumb: {
      backgroundColor: colors.primary,
      "&$focused, &:hover": {
        boxShadow: `0px 0px 0px ${conspressedOutlineRadius}px ${
          colors.thumbOutline
        }`
      },
      "&$activated": {
        boxShadow: `0px 0px 0px ${conspressedOutlineRadius * 2}px ${
          colors.thumbOutline
        }`
      },
      "&$jumped": {
        boxShadow: `0px 0px 0px ${conspressedOutlineRadius * 2}px ${
          colors.thumbOutline
        }`
      }
    }

return (
    <MUISlider
      classes={{
        root: classes.slider,
        thumb: classes.sliderThumb,
        track: classes.sliderForeground
      }}
      min={min}
      step={step}
      // onChange={this.handleChange}
      {...props}
    />
  );

How do you override the &$activated class?

[oliviertassinari]

@bh1505 It’s all yours 😃

[Falieson]

@bh1505 thank you so much. @oliviertassinari sorry i didn’t get this too. Working at that startup was so crazy I didn’t have time to breath or do any of this good citizen stuff. New company is wicked cool and breezy, looking forward to next time!