[Windows] High contrast video controls have awkwardly-sized/positioned backplates on cnn.com/videos
Categories
(Core :: Layout, defect, P3)
Tracking
()
People
(Reporter: snegritas, Unassigned)
References
Details
Attachments
(2 files)
Affected versions
- 71.0b6
- 72.0a1 (2019-11-01)
Affected platforms
- Windows 10
- [ARM] Windows 10
- Windows 7
Steps to reproduce
* Precondition:
- Enable windows high contrast mode.
- Launch Firefox and navigate to
cnn.com/videos
. - Play video.
- Observe video controls.
Expected result
- The video controls are displayed properly without any visual glitches.
Actual result
- Video controls are shown with visual glitches.
Regression range
Will look for a regression ASAP.
Additional notes
- Please see the attachment
Comment 1•5 years ago
•
|
||
Thanks for the report.
This also happens in Microsoft Edge when the Windows high-contrast theme is enabled there, so I think this is, in fact, "High-Contrast Backplates" feature (proposed by & referenced from Edge) working-as-expected. The dark backgrounds behind the controls here are "backplates", and if we didn't draw them, it'd be very hard to see the controls in high-contrast mode, because there's a white-gradient background behind the white video-controls-icons.
(The white-gradient background is actually specified by CNN as a gradient from transparent to currentColor
, and CNN intends for currentColor
to be black, but that keyword in fact resolves to the forced-color
-value of white
in high-contrast mode. So if we weren't drawing the backplates, we'd end up with white-controls-on-whiteish-background here, which would mean high-contrast mode would be producing something unusable. This is the issue that backplates are meant to address.)
Having said that: the backplates are a bit "tighter" in Edge, so they look more reasonable & less like artifacts there. There may be some room for improvement/experimentation on that -- let's morph this bug to be about that.
Updated•5 years ago
|
Comment 2•5 years ago
|
||
Comment 3•5 years ago
|
||
Note for future assignee (who is probably me ;) ):
form controls seemed to have some extra horizontal and vertical visual overflow added to them by virtue of being widgets; I wonder if there's extra visual overflow added elsewhere that we should ignore when backplating?
Updated•5 years ago
|
Updated•2 years ago
|
Description
•