fix(select): Remove blue background in IE on focus #3497
Conversation
|
🤖 Beep boop! Screenshot test report 🚦5 screenshots changed from Details |
|
🤖 Beep boop! Screenshot test report 🚦5 screenshots changed from Details |
|
🤖 Beep boop! Screenshot test report 🚦5 screenshots changed from Details |
| <main class="test-viewport test-viewport--mobile"> | ||
| <div class="test-layout"> | ||
|
|
||
| <!-- This tests that select suppresses IE's default blue background on focus --> |
There was a problem hiding this comment.
I don't think we need a new screenshot page for this. We can add these comments to the 3230.html page stating that the first select is verifying both issues. Maybe rename the file 3230_3496.html?
|
The disabled page diff in IE 11 💩 should be fixed by #3513. |
|
Why is there a diff in IE and not Edge? Shouldn't these changes affect both? Or does it have to do with the browser's default styles? |
| @@ -66,6 +66,11 @@ | |||
| display: none; | |||
| } | |||
|
|
|||
| &::-ms-value { | |||
| background-color: transparent; | |||
| color: inherit; | |||
There was a problem hiding this comment.
Would replacing this with @include mdc-select-ink-color($mdc-select-ink-color); obviate the need for #3513?
There was a problem hiding this comment.
I think we still need both PRs.
mdc-select-ink-color() specifically excludes --disabled, which is why the browser's default font color was getting used.
We either need to update mdc-select-ink-color() so that it includes --disabled, or set a disabled-specific color.
It seems like the simplest thing is to set the color once at a high level, and have all children just inherit it.
|
It's due to the browser's default styles. Earlier versions of Edge had the same problem, but they fixed it around version 15 or 16 I think. |
|
Because |
|
🤖 Beep boop! Screenshot test report 🚦5 screenshots changed from Details |
Fixes #3496