currentColor in linear/radial/conic gradient not picked up on hover
Reported by
mvilr...@gmail.com,
Mar 16 2016
|
|||||||||||||||||
Issue descriptionUserAgent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_11_3) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/49.0.2623.87 Safari/537.36 Example URL: http://codepen.io/mvilrokx/pen/QNdENp Steps to reproduce the problem: 1. Create a block that has a linear gradient that uses "currentColor" as it's color 2. Wrap this block with another block that sets the color to color1 and to color2 on hover. 3. Hover over the block What is the expected behavior? When hovering over the block, it should change color What went wrong? When hovering over the block, it does not change color Does it occur on multiple sites: Yes Is it a problem with a plugin? No Did this work before? N/A Does this work in other browsers? Yes Chrome version: 49.0.2623.87 Channel: stable OS Version: OS X 10.11.3 Flash Version: This works fine in FF and Safari, just not in Chrome, tested both in stable and canary. It also starts working when I simultaneously set the border on hover (see codepen, uncomment border in .colorpicker:hover. This also works fine with a plain background (remove the striped class from the example div)
,
Mar 16 2016
,
Mar 16 2016
Below is the 'Blink' narrow bisect URL: https://chromium.googlesource.com/chromium/blink/+log/86ce4af33b763b24cf2365d8cd19a2ebade676c3..09bd97099a92cf983363f8db6c6c2178b0cd7c6a 39.0.2171.70 - Bad 38.0.2063.0 - Good timloh@, could you please look into this change (https://chromium.googlesource.com/chromium/blink/+/585314c3dfc63971200c93adfff7ef6b10a2c014) if possible? Please feel free to re-assign in-case if this is not your's. Thank you!
,
Mar 17 2016
I guess bool ComputedStyle::hasBackgroundRelatedColorReferencingCurrentColor() needs to take gradients into account. Probably gradients in other properties don't handle this right either.
,
Mar 17 2016
Another similar case below. The border repaints (probably because LayoutObject::adjustStyleDifference just checks hasBorder() for the color case), but the content doesn't seem to ever repaint.
<style>
div { color: green; }
div:hover { color: teal; }
div:before {
content: linear-gradient(to bottom, orange 0%, currentColor 100%);
border: 25px solid currentColor;
}
</style>
<div></div>
,
Mar 17 2016
,
Mar 17 2016
,
May 4 2016
,
May 18 2016
,
Aug 10 2016
Friendly ping from this week's CSS bug sheriff.
,
Aug 10 2016
I don't have time to look at this.
,
Oct 13 2016
,
Nov 22 2016
,
Jan 25 2017
Hi, I know that this issue is not your top priority. But I would like to give you some information about it. I made some tests here: http://codepen.io/7studio/pen/Lxxwgg and it seems that if you: - set `box-shadow` on the element; - set `position:relative; z-index:1;` in `:hover` declaration; - repeat the same `background-image` in `:hover` declaration. the value of the `currentColor` keyword is correctly updated. I hope you will fix this issue soon ;)
,
Feb 13 2017
,
Apr 10 2017
,
Apr 10 2017
,
Oct 30 2017
,
Oct 31 2017
,
Dec 6 2017
,
Dec 6
This issue has been Available for over a year. If it's no longer important or seems unlikely to be fixed, please consider closing it out. If it is important, please re-triage the issue. Sorry for the inconvenience if the bug really should have been left as Available. For more details visit https://www.chromium.org/issue-tracking/autotriage - Your friendly Sheriffbot
,
Dec 12
|
|||||||||||||||||
►
Sign in to add a comment |
|||||||||||||||||
Comment 1 by manoranj...@chromium.org
, Mar 16 2016Status: Assigned (was: Unconfirmed)