ease

css animations with ease 😒

fades

.fade-in

entrances

.enter-right

.enter-left

.enter-top

.enter-bottom

fades & entrances

.fade-right

.fade-left

.fade-top

.fade-bottom

scale

.enter-right-xxl

.enter-left-xl

.fade-left-l

.fade-top

.fade-bottom-s

duration

.fade-in .duration-xl

.fade-in .duration-l

.fade-in .duration-m

.fade-in .duration-s

function

.enter-right .function-linear

.enter-right .function-ease

.enter-right .function-ease-in

.enter-right .function-ease-out

.enter-right .function-ease-in-out

.enter-right .function-custom

activation

.fade-in .ease-active .ease-active is the class that is applied to activate animations. When this class is applied the animation will occur immediately ~

.fade-in .animate-onclick .animate-onclick will animate the object when it is clicked. This will reanimate the object if it has already been animated ~

.fade-bottom .animate-onvisible .animate-onvisible will animate the object when it becomes visible in the scrollbox. This will not reanimate the object if it has already been animated