SOLVED: Custom CSS selector is overwritten with the calculate Bricks ID after adding a custom ID to the element

Bugs
1

Bricks Version: 1.3.2
Browser: Chrome 90
OS: Windows
URL: local development

Steps to reproduce:
1- Create a new “Single” Template
2- Add a Container to the canvas
3- Set a custom CSS to the Container with the “root” selector ( e.g root {background: red;})
4- Save → the style from the custom CSS is applied
5- Add a custom ID to the element

After the above steps the style from the custom CSS disappears, because the “root” selector has been overwritten by Bricks with the ID that Bricks has assigned to the container (e.g. #bricks-element-dieks).

When I applied the Single Template to a Page the style of the same Container disappears due the root renaming (beyond I assign or not an ID to the Container).

Here the image of CSS style after I applied the Single Template to the page:

image
image1144×527 17.3 KB

Thanks

2

Hi @lanzoni.nicola,

Thank you for reporting this problem.

I was able to reproduce the bug; it will be fixed.

3

Hi @ribarich / @thomas ,

In which release is this issue resolved? Because, in the last version (1.3.4) the problem is still here.

Thanks

4

Hi @ribarich , @thomas & @lanzoni.nicola ,

I am also curious when this will be fixed. I use this feature a lot and it’s not handy to use it now. Same for the cursor problem in the CSS editor (see the other post of @lanzoni.nicola : WIP: Working with the CSS Editor writing Custom CSS ). Would be really happy if you could fix this problem :slight_smile:

5

Should be fixed in the newly released 1.3.5. At least I can no longer replicate the “root” selector issue when editing the element ID. Could you try 1.3.5 to confirm if its working on your end as well, please?