SOLVED: Filter settings not added to classes

Bricks Version: 1.4.02
Browser: Chrome 90
OS: macOS / Windows / Linux / etc.
URL: (a link to a page that illustrates the issue would be really helpful)

Hey guys,

I noticed earlier that nothing was attached to the class when I tried to add filters to a class. I manually added “filter: brightness(0)opacity(1)etc”… via CSS and it worked just fine, so the class was correctly added to the elements. Just filters won’t work :slight_smile:

Hi Maxime,
Thanks so much for your report!

Which element do you want to apply the filter to?

Best regards,
timmse

I was trying to apply the filter to a class, not an element in particular. In this specific case, the class was added to a container element.

Hey, Thanks for the quick reply!
Currently, if you add a class to an element and add styles to the class, the class gets attached to the element so it looks like this: .testClass.brx-container { … }

You can read more about why this is here: Custom CSS class properties not reflecting - #14 by thomas

However, it works for me without any problems with filters :thinking:

However, if you want to add the class to another element, it may not give you the desired result because it only affects certain parts of the element, depending on the element (please see Thomas statement).

Best regards,
timmse

sorry, I double-checked my settings and I figured out I mixed a couple of things. I was able to apply the filter on a container’s class element, BUT I’m still not able to apply filters to class when it’s attached to the code element’s.

Hey Maxime,

Currently, we only allow the filters to be applied to the container or images - not to each element (which makes little sense in most cases anyway). However, this can of course be limiting, so in the future, we will apply the filter to the root of the element in general.

As a temporary solution, you can put your code element into a container, and apply the filter to the container.

Best regards,
timmse

I see. In my case, I added an svg directly in the code element and hoped I could apply filters to it. Definitely something to consider in future :wink:

Marking this one as solved, as CSS filters are available for every element (Tab: “Style > CSS”) since 1.5 RC.

1 Like