more-less: use mask-image for blur effect #5291
Conversation
|
Thanks for the PR! 🎉 We've deployed an automatic preview for this PR - you can see your changes here:
Note The build needs to finish before your changes are deployed. |
| * The gradient color of the blurring effect | ||
| * @type {string} | ||
| */ | ||
| blurColor: { type: String, attribute: 'blur-color' }, |
There was a problem hiding this comment.
Was the purpose of this to allow consumers to match the blur to non-white background colors, and mask-image (using semi-transparent gradient) essentially handles that for us?
There was a problem hiding this comment.
Correct (there are 2 usages of it which could be removed)
omsmith
force-pushed
the
omsmith/more-less-mask
branch
from
9bf327c to
cc144ff
Compare
|
Everyone happy with the golden changes? https://vdiff.d2l.dev/BrightspaceUI/core/cc144ffd2922e31e2fbfd561a79f75809d7dccf8/2025-01-08_15-38-23/report/ The filter diff is new / unrelated. The button is |
Seems good to me. The filter one is flake that we've been unable to solve -- I've re-run the job so hopefully it clears up. |
Do we want/need a visual-diff test with a non-white background? Seems like that case isn't really covered. |
Co-authored-by: Danny Gleckler <[email protected]>
Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
dlockhart
force-pushed
the
omsmith/more-less-mask
branch
from
0eb4e70 to
d6d878e
Compare
Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
|
🎉 This PR is included in version 3.79.3 🎉 The release is available on: Your semantic-release bot 📦🚀 |
This PR improves the method for supporting the blur on non-white backgrounds from requiring the consumer specifying the blur color to using
mask-imageCSS. Themask-imagewill handle the simpler non-white background case as well as the more complicated AI gradient case described in the Slack thread that motivated this change.https://d2l.slack.com/archives/C0PHG3QB0/p1736294752688859