SOLVED: Dynamic data not working for background-color inside query loop

Bugs
1

Bricks Version: 1.5.1 RC
Browser: Chrome 104
OS: Windows / Linux
URL: https://isa.b32.be/

I have setup a query loop which work very well with ACF dynamic data except for one field, it’s the background color, bricks only take into considération the background color of the first post and apply the same color to the other posts:

Here we can see that I have use the same string for the title and the background-color of the post, first post has a background-color set at: var(–primary-trans-40), meanwhile title change for the two other post, it’s the background color of the first post which get applied to all the posts.

2022-09-07 11_25_39-Isabelle Decroupette – Thérapeute praticienne psychocorporelle – Un site utilisa
2022-09-07 11_25_39-Isabelle Decroupette – Thérapeute praticienne psychocorporelle – Un site utilisa1144×723 109 KB

If I set the second post first, the 3 post will have a background color of the new first post: var(–secondary-trans-40):

2022-09-07 11_30_16-Isabelle Decroupette – Thérapeute praticienne psychocorporelle – Un site utilisa
2022-09-07 11_30_16-Isabelle Decroupette – Thérapeute praticienne psychocorporelle – Un site utilisa1134×709 106 KB

And if I put the third post first, it will change the 3 background color of that tird post var(–accent-trans-40):

2022-09-07 11_33_14-Isabelle Decroupette – Thérapeute praticienne psychocorporelle – Un site utilisa
2022-09-07 11_33_14-Isabelle Decroupette – Thérapeute praticienne psychocorporelle – Un site utilisa1130×709 106 KB

Thanks and Regards,

Nicolas.

1 Like
2

Hi Nicolas,
Thank you very much for your report!

The problem is that each div gets the same class and, therefore, the same color.

Bildschirmfoto 2022-09-08 um 09.59.41
Bildschirmfoto 2022-09-08 um 09.59.412784×216 95.1 KB

I think the only way to solve this is to add the dynamic color as an inline style attribute. Can you give this a try?

Bildschirmfoto 2022-09-08 um 10.03.30
Bildschirmfoto 2022-09-08 um 10.03.30666×676 18.3 KB

Best regards,
timmse

1 Like
3

Thanks timmse, it works like a charm :slight_smile:

2022-09-09 14_24_04-Window
2022-09-09 14_24_04-Window1136×709 105 KB

Always embarrassing when solution seems so simple and that I could thing about it!

But I guess that’s why we’ll always need expert :wink:

Thanks again!

1 Like
4

Hello @timmse , if I want to change the background color when hovering over an element, how could I do it?

5
6

a status update would really help. thanks.

7

About the status of…? If you apply styling inside a loop (e.g. on a class), it’s expectable that every element using that class gets the same styling, isn’t it?

8

thanks for such a great obvious answer. sorry for asking!

9

What I don’t understand now is that, is the background color coming from ACF, or from the Bricks Builder loop. Because the attribute set will have to retrieve colours for various backgrounds from somewhere it has been stored.

I checked ACF and it has nowhere to set colours, like for taxonomies or fields. So how does that attribute get different colors for the query loop?

1 Like
10

The author of the report (nickwe) has created an ACF color field for his posts and assigns a color to each post, which he then outputs within the loop via the style attribute.

1 Like
11

Is this background color problem solved or still there?
Thanks

12

Hi @aryanshirani ,
This was not a bug at the time and is, therefore, no longer relevant.

What exactly is the current problem?