fix(select): Disabled color and opacity

[acdvorak]

What it does

• Sets disabled color directly instead of giving the entire mdc-select element opacity: .38 and relying on the default browser styles for text color.

Example output

Before:

After:

[kfranqueiro]

Why are we changing this? The default guidance is 38% opacity of the overall component, which is what the code is currently doing.

[acdvorak]

Look at the screenshots in the PR description. The existing version's text color is incorrect.

Browsers automatically style disabled <select> elements with color: graytext (WebKit). On top of that, we're applying 38% opacity. So the end result is opacity much less than 38%, which makes the text really hard to read.

In addition, the old version has transparent backgrounds, whereas the new one has opaque backgrounds.

[kfranqueiro]

After discussing this w/ Andy and comparing against current text field disabled styles... this is at least closer to what text field is currently doing. I don't think it's necessarily 100% correct, but it's a lot more consistent than before, and we need to revisit disabled styles overall in the future anyway.

[mdc-web-bot]

🤖 Beep boop!

Screenshot test report 🚦

4 screenshots changed from master on commit 1a88d5f:

• https://storage.googleapis.com/mdc-web-screenshot-tests/travis/2018/09/05/19_17_01_974/report/report.html?utm_source=github&utm_content=pr_comment

Details

4 Changed:

• spec/mdc-select/classes/disabled.html