Repository: material-ui
Issue: Consistent disabled state for all components
Labels: design: material,breaking change

<!-- Provide a general summary of the issue in the Title above -->

At the moment, the disabled color of the slider is [`theme.palette.grey[400]`](https://github.com/mui-org/material-ui/blob/master/packages/material-ui/src/Slider/Slider.js#L145). Other inputs use [`theme.palette.action.disabled`](https://github.com/mui-org/material-ui/blob/master/packages/material-ui/src/OutlinedInput/OutlinedInput.js#L35) (also used e.g. [here](https://github.com/mui-org/material-ui/blob/master/packages/material-ui/src/Checkbox/Checkbox.js#L37)) and [`theme.palette.text.disabled`](https://github.com/mui-org/material-ui/blob/master/packages/material-ui/src/InputBase/InputBase.js#L44).

The Slider should use `theme.palette.action.disabled` as well.

<!--
  Thank you very much for contributing to Material-UI by creating an issue! ❤️
  To avoid duplicate issues we ask you to check off the following list.
-->

<!-- Checked checkbox should look like this: [x] -->

- [ ] The issue is present in the latest release.
- [ ] I have searched the [issues](https://github.com/mui-org/material-ui/issues) of this repository and believe that this is not a duplicate.

## Current Behavior 😯

The Slider uses `theme.palette.grey[400]`.
<!-- Describe what happens instead of the expected behavior. -->

## Expected Behavior 🤔

The Slider should use `theme.palette.action.disabled`.

<!-- Describe what should happen. -->

## Steps to Reproduce 🕹

<!--
  Provide a link to a live example (you can use codesandbox.io) and an unambiguous set of steps to reproduce this bug.
  Include code to reproduce, if relevant (which it most likely is).

  This codesandbox.io template _may_ be a good starting point:
  https://codesandbox.io/s/github/mui-org/material-ui/tree/master/examples/create-react-app

  If you're using typescript a better starting point would be
  https://codesandbox.io/s/github/mui-org/material-ui/tree/master/examples/create-react-app-with-typescript

  If YOU DO NOT take time to provide a codesandbox.io reproduction, should the COMMUNITY take time to help you?
-->

Example showing that `theme.palette.grey[400]` is used: https://codesandbox.io/s/material-demo-qpzdk

![image](https://user-images.githubusercontent.com/10603631/72879169-a839b200-3cfc-11ea-95a6-5f9641ada70b.png)

Note: I've forced the color with `!important` for the screenshot above.

Actually, this demo shows another problem with the current style system - the custom disabled style is not applied, because the css specifity of the default disabled class is higher than the one of the custom class - is this wished? Should I create another issue for this problem?

![image](https://user-images.githubusercontent.com/10603631/72878822-f39f9080-3cfb-11ea-8045-3dcc80040c14.png)

![image](https://user-images.githubusercontent.com/10603631/72878610-8ab81880-3cfb-11ea-9082-4bb174627394.png)


Steps:

1. Create a custom theme to see the difference between `grey[400]` and `action.disabled`
2. set `disabled` to `true`

## Context 🔦

<!--
  What are you trying to accomplish? How has this issue affected you?
  Providing context helps us come up with a solution that is most useful in the real world.
-->

We edit some values of the palette, which leads to a difference between `grey[400]` and `actions.disabled`. All disabled inputs have the same color, except for the Slider component.
![image](https://user-images.githubusercontent.com/10603631/72879438-24cc9080-3cfd-11ea-82b5-e80aa3b88f3c.png)


## Your Environment 🌎

<!--
  Include as many relevant details about the environment with which you experienced the bug.
  If you encounter issues with typescript please include version and tsconfig.
-->

| Tech        | Version |
| ----------- | ------- |
| Material-UI | v4.8.3  |