Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

mask-image and gradients #1002

Closed
BaliBalo opened this issue Mar 12, 2018 · 5 comments
Closed

mask-image and gradients #1002

BaliBalo opened this issue Mar 12, 2018 · 5 comments
Labels

Comments

@BaliBalo
Copy link

mask-image: radial-gradient(circle closest-corner at 100% 50%, #000, transparent);

outputs the following

-webkit-mask-image: -webkit-radial-gradient(circle closest-corner at 100% 50%, #000, transparent);
mask-image: radial-gradient(circle closest-corner at 100% 50%, #000, transparent);

This is wrong because:

  • The prefixed version of radial-gradient uses an old syntax (-webkit-radial-gradient(100% 50%, circle closest-corner, ...)), the standard at 100% 50% is not recognized, so the first line doesn't work.
  • Webkit doesn't support the unprefixed mask-image, so the second line doesn't work.

One thing that would work would be the prefixed version of mask-image with the unprefixed version of radial-gradient: -webkit-mask-image: radial-gradient(circle closest-corner at 100% 50%, #000, transparent);

(I am testing in Chrome, not sure if this applies in Safari)

@ai ai added the bug label Mar 12, 2018
@ai
Copy link
Member

ai commented Mar 12, 2018

Thanks or report. I will look at it on Friday. Seems like gradient direction syntax replacer has some problem with this direction.

@ai
Copy link
Member

ai commented Apr 28, 2018

@BaliBalo Oops. I forget, sorry. Maybe you want to send PR?

@ai
Copy link
Member

ai commented May 13, 2018

Done 847bfd5

@ai ai closed this as completed May 13, 2018
@ai
Copy link
Member

ai commented May 13, 2018

Released in 8.5

@BaliBalo
Copy link
Author

Thanks a lot! Haven't had time to make a PR sorry.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

2 participants