Pro 7.6.2 Bug - Dynamic Global Colors

Beta
#1

Hi Charlie!

I’ve just updated to 7.6.2. I had some SVGs with dynamic global fill color:

fill='{{ global.color({"id":"clr-neutral-200"}) }}'

That stopped working. I have tried the same SVG on an older site that is not updated yet, and it works there.

I have tested a color with the default, unchanged ID as well, just to be sure. It doesn’t work either.

Edit, to be more precise, this SVG is directly added as a background-image, in CSS:

Full CSS 
$el {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='{{ global.color({"id":"clr-neutral-200"}) }}' viewBox='0 0 3807.55 170.6'%3E%3Cpath transform='scale(1,-1) translate(0,-170.6)' d='M0,109.41c30.64-34.87,76.58-54.87,126.04-54.87,49.46,0,95.41,20,126.06,54.87,34.17,38.88,87.35,61.18,145.91,61.18h0c58.56,0,111.75-22.3,145.93-61.18,30.64-34.87,76.58-54.87,126.04-54.87,49.46,0,95.41,20,126.06,54.87,34.17,38.88,87.35,61.18,145.91,61.18h0c58.56,0,111.75-22.3,145.92-61.18,30.64-34.87,76.58-54.87,126.04-54.87,49.46,0,95.41,20,126.06,54.87,34.17,38.88,87.35,61.18,145.91,61.18s111.74-22.3,145.91-61.18c30.65-34.87,76.59-54.87,126.06-54.87,49.46,0,95.4,20,126.04,54.87,34.17,38.88,87.36,61.18,145.93,61.18,58.56,0,111.74-22.3,145.91-61.18,30.65-34.87,76.59-54.87,126.06-54.87,49.46,0,95.4,20,126.04,54.87,34.17,38.88,87.36,61.18,145.93,61.18,58.56,0,111.74-22.3,145.91-61.18,30.65-34.87,76.59-54.87,126.06-54.87,49.46,0,95.4,20,126.04,54.87,34.17,38.88,87.36,61.18,145.93,61.18,58.56,0,111.74-22.3,145.91-61.18,30.65-34.87,76.59-54.87,126.06-54.87,49.46,0,95.4,20,126.04,54.87,34.17,38.88,87.36,61.18,145.93,61.18,58.56,0,111.74-22.3,145.91-61.18V0H0v109.41Z'/%3E%3C/svg%3E");
  background-repeat: repeat-x;
  background-position: bottom center;
  background-size: 200px;
}

Again, this exact thing works in older Pro.

2. This could be related. I am unable to use dynamic content in the Image mask. Image is not showing if added through a parameter control.

image

Thanks!

1 Like
#2

This hopefully is not a crossroads for the background image breakpoint changes. To get a URL working in your case with breakpoints would require putting the URL in a style tag, but there is too many quotes for it to work properly. What I’m going to try is just remove breakpoints entirely when you are using url( with quotes due to this issue. And hopefully we won’t have to revert the background image breakpoints changes. Do you have a staging site I could run a test build to make sure you are okay when I make the update?

image

What you have here also doesn’t work with normal dynamic content on older versions of Pro, so it was specific to Twig not having support for breakpoint values in style fields.

Thanks for sending my way.

1 Like
#3

Hi @charlie,

sure, but I have set it up on a different website. Never mind, that one has Pro 7.6.2 and it is just a testing playground. I have updated the secure note.

Btw, I had the second issue described, regarding dynamic content in the mask color. You must have been missed it because I was updating my posts probably as you were replying.

Thank you!

#4

On your site I placed a testing build. The SVG is green now and it looks like it’s working with other DC.

Sorry I missed that mask part. That’ll be fixed in the next point release. The testing build also has that fix in place.

Let me know if I missed anything and have a great day.

1 Like