Gradient plugin is interfering with background-image
Can someone check if the latest release fixes the issue, please?
Read full answer below ↓Question
The background-image url is getting wrapper around by linear-gradient() function like so Even though I assigned gradient to 'background' property instead of 'background-image' I can't reproduce the bug in the demo of either grapesjs or the plugin because in neither of them have the two features (background image and gradient ) been used together.
Answers (3)
Can someone check if the latest release fixes the issue, please?
UPDATE: I know it's a very hacky fix but what I did is replace every 'backgroundImage' with just 'background' in the grapesjs-style-gradient.min.js file of the plugin. And now it works like I need it to. Perhaps someone could provide a better solution?
Wow! I'm not the only one going crazy!
background-image: -webkit-linear-gradient(https://domain.com/webasset.jpg?auth=eyJhbGciOiJSUzIN9wiUo3kUgN1BIFlHwaI9A)
@artf , do you have any suggestion? Where should a pull request be submited?
Related Questions and Answers
Continue research with similar issue discussions.
Issue #2137
[help needed] Can someone explain property.layers of the style manager? [pls read description]
I would like to code the entire background layers property but this time using 'background' instead of background-image so it doesn't mess...
Issue #2107
[BUG] Background image and gradient not working together
Since I started using the gradient plugin, the background image are in the following form: background-image: -webkit-linear-gradient(path/t...
Issue #3125
linear-gradient CSS does weird things to background-image
Version: 0.16.27 Are you able to reproduce the bug from the demo? [x] Yes [ ] No What is the expected behavior? When adding background-imag...
Issue #2849
[BUG] Using image url for background-image is not working properly
DescriptionOn our project for images assets we use url instead of base64 code .Expected behavior When setting a background-image to a contr...
Paid Plugins That Match This Issue
Curated by issue keywords and label relevance to help you ship faster.
Loading paid plugin recommendations...
Check the open-source GrapesJS plugins on GitHub or run a quick search in our free catalog.
Browse free plugins →Premium plugins ship with support, regular updates, and production-ready features — save days of integration work.
Browse premium plugins →Browse Plugin Categories
Jump directly to plugin category pages on the marketplace.