Browser: Chrome 149.0.7827.156
OS: Windows
Hi team,
As you can see in the video below, there is a component with two variants (base and variant 1) on the page. First I selected the variant 1 component and clicked Edit Component and then went back. Then I selected the base variant component. The problem is that when I select and edit the component with the base variant, its style changes to the variant 1.
Hey @HOSEIN,
Thank you for the report. However, I’m not able to replicate it exactly as you did. We do have one fix prepared for a very similar issue, but I’m not sure if it’s the same one.
Could you send me your component so I can test it with yours? I tested it locally with one of my variation components, and I was not able to replicate the issue.
You can also try using the latest Bricks version. That may be why I wasn’t able to reproduce it. Please test the latest bricks and let me know. If it’s still not working correctly, then you can send me the component.
Thank you,
Matej.
Hi Matej,
Yes, I tested it in the latest version and the problem is the same.
{"content":[{"id":"bffqta","name":"section","parent":0,"children":["oajzfc"],"settings":{}},{"id":"oajzfc","name":"container","parent":"bffqta","children":["mrarnl","wrhvjp","ngllex","qppsdy"],"settings":{"_display":"grid","_gridTemplateColumns":"1fr 1fr 1fr 1fr","_gridGap":"20px"}},{"id":"mrarnl","name":"block","parent":"oajzfc","children":[],"settings":{},"cid":"drdwoc","variant":"variant-qzmbrx"},{"id":"qppsdy","name":"block","parent":"oajzfc","children":[],"settings":{},"cid":"drdwoc"},{"id":"ngllex","name":"block","parent":"oajzfc","children":[],"settings":{},"cid":"drdwoc","variant":"variant-qzmbrx"},{"id":"wrhvjp","name":"block","parent":"oajzfc","children":[],"settings":{},"cid":"drdwoc"}],"source":"bricksCopiedElements","sourceUrl":"https://avangtheme.ir","version":"2.3.8","components":[{"id":"drdwoc","category":"","desc":"","elements":[{"id":"drdwoc","name":"block","parent":0,"children":["bttebx","amzmbd"],"settings":{"_rowGap":"10","_padding:variant-qzmbrx":{"top":"10","right":"10","bottom":"10","left":"10"},"_border:variant-qzmbrx":{"width":{"top":"1","right":"1","bottom":"1","left":"1"},"style":"solid","color":{"id":"rwhvka","raw":"var(--text-1)","light":"#1f2328"}}},"label":"Component"},{"id":"bttebx","name":"image","parent":"drdwoc","children":[],"settings":{"image":{"id":9,"filename":"woocommerce-placeholder.webp","size":"large","full":"https://avangtheme.ir/wp-content/uploads/woocommerce-placeholder.webp","url":"https://avangtheme.ir/wp-content/uploads/woocommerce-placeholder-1024x1024.webp"}}},{"id":"amzmbd","name":"heading","parent":"drdwoc","children":[],"settings":{"text":"I am a heading"}}],"properties":[],"_created":1782248147,"_user_id":1,"_version":"2.3.8","variants":[{"id":"variant-qzmbrx","name":"Variant 1"}]}]}
Hey @HOSEIN,
Thank you so much for this. I’m really grateful. I was able to replicate the issue with your component, and I added it to our internal bug tracker.
Just to add a bit more information, I mentioned above that we have a fix prepared for a very similar issue, but it turns out this is not the same issue. So I had to create a new internal task for it.
Thank you,
Matej
We’ve addressed this in Bricks 2.3.9, now available as a one-click update in your WordPress Dashboard.
Please read the changelog entry before updating, and let us know if you experience any issues.
I just updated to 2.3.9 but the issue persists for me. Changing the e.g. font color of variant 1, changes the font color of base and vise-versa
Hey @tmueller,
can you copy the component and paste it here and also record a video, showing the bug you face?
I would need both things to properly being able to replicate it.
Thank you,
Matej
Sure thing. Here is the component:
{“content”:[{“id”:“tfotyn”,“name”:“div”,“parent”:“kahbub”,“children”:,“settings”:{“_cssGlobalClasses”:[“cftvxt”]},“cid”:“mrnpgk”,“properties”:{“rdsclx”:“Individuelle Genesungspläne”,“gcdrjx”:“Keine zwei Körper sind gleich. Wir entwerfen spezifische Behandlungsprotokolle, die auf Ihre einzigartigen Ziele zugeschnitten sind.”}}],“source”:“bricksCopiedElements”,“sourceUrl”:“``https://recovery-club-website-wordpress-v1.test``”,“version”:“2.3.9”,“components”:[{“id”:“mrnpgk”,“category”:“”,“desc”:“”,“elements”:[{“id”:“mrnpgk”,“name”:“div”,“parent”:0,“children”:[“ivrzha”,“feffso”,“lgowtv”],“settings”:{“_cssGlobalClasses”:[“onkutt”]},“label”:“Icon Card”},{“id”:“ivrzha”,“name”:“icon”,“parent”:“mrnpgk”,“children”:,“settings”:{“icon”:{“library”:“fontawesomeRegular”,“icon”:“fa fa-gem”},“_cssGlobalClasses”:[“vjgo08”]}},{“id”:“feffso”,“name”:“heading”,“parent”:“mrnpgk”,“children”:,“settings”:{“text”:“Lorem ipsum dolor sit amet”,“tag”:“custom”,“_cssGlobalClasses”:[“zv9cmc”],“customTag”:“strong”},“label”:“Heading”},{“id”:“lgowtv”,“name”:“text-basic”,“parent”:“mrnpgk”,“children”:,“settings”:{“text”:“Here goes your text … Select any part of your text to access the formatting toolbar.”,“tag”:“p”,“_cssGlobalClasses”:[“mb4wrg”]}}],“properties”:[{“label”:“Überschrift”,“type”:“text”,“default”:“Lorem ipsum dolor sit amet”,“id”:“rdsclx”,“connections”:{“feffso”:[“text”]}},{“label”:“Text”,“type”:“text”,“default”:“Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. “,“id”:“gcdrjx”,“connections”:{“lgowtv”:[“text”]}},{“label”:“Icon”,“type”:“icon”,“default”:{“library”:“fontawesomeRegular”,“icon”:“fa fa-gem”},“id”:“xauxlk”,“connections”:{“ivrzha”:[“icon”]}}],”_created”:1783607179,“_user_id”:1,“_version”:“2.3.8”,“variants”:[{“id”:“variant-gmbaru”,“name”:“Dark”}],“labelVariantBase”:“Light”}],“globalClasses”:[{“id”:“onkutt”,“name”:“icon-card”,“settings”:,“modified”:1783957469,“user_id”:1},{“id”:“vjgo08”,“name”:“icon-card__icon”,“settings”:{“iconSize”:“4.8rem”,“_margin”:{“bottom”:“1rem”},“iconColor”:{“raw”:“var(–secondary)”,“id”:“01GXBWJMZX793Y156N940FCB3G”,“name”:“secondary”,“hex”:“#383A39”},“_typography”:{“color”:{“raw”:“var(–secondary)”,“id”:“01GXBWJMZX793Y156N940FCB3G”,“name”:“secondary”,“hex”:“#383A39”}}},“modified”:1783957016,“user_id”:1,“selectors”:},{“id”:“zv9cmc”,“name”:“icon-card__heading”,“settings”:{“_typography”:{“font-size”:“var(–text-m)”,“font-weight”:“700”,“color”:{“raw”:“var(–secondary)”,“id”:“01GXBWJMZX793Y156N940FCB3G”,“name”:“secondary”,“hex”:“#383A39”}},“_display”:“block”},“modified”:1783956341,“user_id”:1},{“id”:“mb4wrg”,“name”:“icon-card__text-basic”,“settings”:{“_typography”:{“color”:{“raw”:“var(–secondary)”,“id”:“01GXBWJMZX793Y156N940FCB3G”,“name”:“secondary”,“hex”:“#383A39”}}},“modified”:1783956341,“user_id”:1},{“id”:“cftvxt”,“name”:“service-cards__div”,“settings”:{},“modified”:1783957469,“user_id”:1}]}
And the video: Unique Download Link | WeTransfer
Hey,
thank you for the video, I can see the issue (I assume that the top component is light and the bottom one is dark, or vice-versa).
However, can you please wrap the component JSON inside the triple backticks, so that the final result looks something like this:
My JSON code
Sadly, it’s not usable as it is now 
Matej
{"content":[{"id":"tfotyn","name":"div","parent":"kahbub","children":[],"settings":{"_cssGlobalClasses":["cftvxt"]},"cid":"mrnpgk","properties":{"rdsclx":"Individuelle Genesungspläne","gcdrjx":"Keine zwei Körper sind gleich. Wir entwerfen spezifische Behandlungsprotokolle, die auf Ihre einzigartigen Ziele zugeschnitten sind."}}],"source":"bricksCopiedElements","sourceUrl":"https://recovery-club-website-wordpress-v1.test","version":"2.3.9","components":[{"id":"mrnpgk","category":"","desc":"","elements":[{"id":"mrnpgk","name":"div","parent":0,"children":["ivrzha","feffso","lgowtv"],"settings":{"_cssGlobalClasses":["onkutt"]},"label":"Icon Card"},{"id":"ivrzha","name":"icon","parent":"mrnpgk","children":[],"settings":{"icon":{"library":"fontawesomeRegular","icon":"fa fa-gem"},"_cssGlobalClasses":["vjgo08"]}},{"id":"feffso","name":"heading","parent":"mrnpgk","children":[],"settings":{"text":"Lorem ipsum dolor sit amet","tag":"custom","_cssGlobalClasses":["zv9cmc"],"customTag":"strong"},"label":"Heading"},{"id":"lgowtv","name":"text-basic","parent":"mrnpgk","children":[],"settings":{"text":"Here goes your text ... Select any part of your text to access the formatting toolbar.","tag":"p","_cssGlobalClasses":["mb4wrg"]}}],"properties":[{"label":"Überschrift","type":"text","default":"Lorem ipsum dolor sit amet","id":"rdsclx","connections":{"feffso":["text"]}},{"label":"Text","type":"text","default":"Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. ","id":"gcdrjx","connections":{"lgowtv":["text"]}},{"label":"Icon","type":"icon","default":{"library":"fontawesomeRegular","icon":"fa fa-gem"},"id":"xauxlk","connections":{"ivrzha":["icon"]}}],"_created":1783607179,"_user_id":1,"_version":"2.3.8","variants":[{"id":"variant-gmbaru","name":"Dark"}],"labelVariantBase":"Light"}],"globalClasses":[{"id":"onkutt","name":"icon-card","settings":{},"modified":1783957469,"user_id":1},{"id":"vjgo08","name":"icon-card__icon","settings":{"iconSize":"4.8rem","_margin":{"bottom":"1rem"},"iconColor":{"raw":"var(--secondary)","id":"01GXBWJMZX793Y156N940FCB3G","name":"secondary","hex":"#383A39"},"_typography":{"color":{"raw":"var(--secondary)","id":"01GXBWJMZX793Y156N940FCB3G","name":"secondary","hex":"#383A39"}}},"modified":1783957016,"user_id":1,"selectors":[]},{"id":"zv9cmc","name":"icon-card__heading","settings":{"_typography":{"font-size":"var(--text-m)","font-weight":"700","color":{"raw":"var(--secondary)","id":"01GXBWJMZX793Y156N940FCB3G","name":"secondary","hex":"#383A39"}},"_display":"block"},"modified":1783956341,"user_id":1},{"id":"mb4wrg","name":"icon-card__text-basic","settings":{"_typography":{"color":{"raw":"var(--secondary)","id":"01GXBWJMZX793Y156N940FCB3G","name":"secondary","hex":"#383A39"}}},"modified":1783956341,"user_id":1},{"id":"cftvxt","name":"service-cards__div","settings":{},"modified":1783957469,"user_id":1}]}
Hey Matej, any updates?
Hey @tmueller,
Can you still replicate this issue with Bricks 2.4 beta 2? I tested it and I can’t replicate it anymore, not in the 2.4 beta version or in 2.3.10. Can you test it and let me know?
The video is not available anymore, but as far as I remember, you had a component that you pasted above with a light and dark variant. If you changed the text color in the dark variant, it also updated the base variant. I can’t replicate this with your component.
Also, sorry for not responding earlier, I missed the response 
Matej
@Matej sry i overlooked your answer. I did not try it with 2.4 but can definetly still replicate it with 2.3.10. It is very annoying unfortunatly.
And yeah, it happens exactly the way you exlained it.
Hey @tmueller,
Thanks for confirming. Please test this once in Bricks 2.4 beta 2 as well.
I still cannot reproduce it with your component in 2.3.10 or 2.4 beta, and the earlier video is no longer available. If it still happens in 2.4 beta 2, please send a fresh screen recording showing the exact steps from selecting the component instance through changing the style, including which variant is active when the style changes.
Matej