To add animations to a custom block, add the following code to your block properties.
<animation library="aos" version="3" />
👉 This is currently the only supported library and version. We might introduce other animations in the future with other libraries or versions.
Now you need to choose what to animate in your blocks. This is done by adding the sf-animate attribute to an HTML tag. Here is a full fledged example:
<div class="text-columns-column" sf-animate>
<div>Column 1</div>
</div>
<div class="text-columns-column" sf-animate sf-animate-delay="200">
<div>Column 2</div>
</div>
<div class="text-columns-column" sf-animate sf-animate-delay="400">
<div>Column 3</div>
</div>
A couple of things to remember: