SOLVED: Changing the CSS variable of a global color doesn't reflect on elements

If I create a global color and assign a variable to it - let’s say var(–test). Then I apply my newly created global color to an element. Now if I edit my global color to var(–test2), save the page, and refresh my page on frontend, the variable applied on the element is still var(–test) and not var(–test2).

That’s kind of problematic because in Advanced Themer, the prefix and variable names are dynamically created and applied on the colorPalette array, but any change to it breaks the existing elements with that color assigned (even if the color id is correctly set). The value gets correctly updated if I manually reopen the color control on the element, but it’s still element-specific and doesn’t apply to the whole site. So in my example, if a user changes the prefix of a global color, he would have to manually open the controls of each element that has this color assigned for every page of the site - a real pain :smiley:

It would be great if any change made to the colorPalette array - including variable changes - would be effective on all the elements of the site.

Cheers,
Maxime

6 Likes

Hey @timmse! Is there some criteria to get a status (WAIT/ NO BUG/ etc…) on the bugs we report? I noticed that I often get my posts unnoticed/unfollowed compared to more recent reports from other folks here (which can create some frustration on the long run :sweat_smile:). Is there something I can do to help you monitoring my reports and get more consistent followup?

Hi Maxime,
Sorry for the late reply. It can always happen that a report gets lost in the crowd (especially after weekend), or it takes a little longer due to the complexity of the report. However, this has nothing to do with you and your reports - we appreciate your input very much :heavy_heart_exclamation:

I just tried to reproduce the problem in various ways, but unfortunately I can’t do it. Can you please show your procedure in a screencast?

hey @timmse , here it is: WeTransfer - Send Large Files & Share Photos Online - Up to 2GB Free

Thanks!

That may help further:

on top, the background setting of the container with color applied that contains var(–test1)

On the bottom, the color palette has been correctly updated to var(–test2).

You can see that they are the same color with the same ID, but the raw value isn’t synced.

Btw, these values have been taken after a page reload. So they don’t sync even on load.

I guess they aren’t synced on different pages either, right? If I edit a global color on one page, I’d expect it to be updated on the whole site.

Hope it helps!

Thanks a million for the video! Now I can understand the problem and added it to the bug tracker :+1:

1 Like

Hi guys,

We’ve fixed this issue in Bricks 1.10 beta, now available as a manual download in your account (see changelog).

Please let us know if you are still experiencing issues.

As with any beta release, please do not use it on a production/live website. It is only meant for testing in a local or staging environment.

Best regards,
M

Oh really? I didn’t catch it in the changelogs…