Hi there,
how to override default css animation (animate.css) with a custom value and in the same time being able to set them in the editor?
For example: fadeInUp has translate3d(0,100%,0) and I’d like translate3d(0,30px,0) for a more suble effect.
I’ve tried placing the whole fadeinup animation targeting .brx-animated-fadeInUp but without effort.
Many thanks!
I just had to find a way to override all the “fadeIn” animations from 100% to 30px because 100% was too aggressive. Initially I tried to create the same keyframe animations in a the bricks child theme style.css file with the “!important” prop but that didn’t work. Instead I had to modify the animate.min.css file in the Bricks parent theme.
Apply this with caution because you’ll be modifying the parent theme file.
I copied and pasted the animate.min.css file into VScode, searched and replaced “100%” with “30px” and then pasted that code back into the WP Theme File Editor. That eased up all the FadeIn animations across my site. I haven’t tested to see if a Bricks update would replace the default animate.min.css file but you would have to follow these steps again if it does.
Hope this helps!
I got the same Problem. I want to set my custom translate3D settings because the original setting is too harsh.
Why does not the child theme CSS work in this case?
Thank you! This is perfect solution.
