-
Notifications
You must be signed in to change notification settings - Fork 1
Animated
Lucca UI comes with a library of pre-made css animations. To apply them to any element, add these classes: lui animated {optionalDirection} {animationStyle} {in | out}. For example, to have an element "scale up when appearing": class="lui animated up scale in".
To have an animation loop infinitely, just add the infinitely class to the element.
Description: translates from a direction and fades. Must be given a direction: [left | right | up | down]
class="lui animated left fade in" -- elements translates from the left while fading in
class="lui animated up fade out" -- elements translates away top while fading out
Description: slides from a direction while being resized. Must be given a direction: [left | right | up | down]
class="lui animated left slide in" -- elements slides in from the left while being resized
class="lui animated up slide out" -- elements slides away top while being resized
Description: scales from a direction while fading. Must be given a direction: [left | right | up | down]
class="lui animated left scale in" -- elements scales up from the left while fading
class="lui animated up scale out" -- elements scales down to the top while fading
class="lui animated bounce"
class="lui animated pulse"