Usage

Add CSS classes to your layers or pre-compositions.

You can add multiple classes: .inner-shadow.noclick :

You can target specific fill, strokes, …

Included classes

.overflow

• Disable the crop of AE pre-compositions

.click

• Add a cursor pointer
• And resets click if parent has .noclick

.noclick

• Disable event listeners on specific layers and its children

<!-- a lottie structure -->
<svg>
	<path class="top noclick"></path>
	<path class="bottom"></path>
<svg>

// won't trigger
getElem(".top").onclick = function() {
	console.log("top") 
}

// will trigger, even if below top layer
getElem(".bottom").onclick = function() {
	console.log("bottom") 
}

.noscale

• make the stroke-width constant no matter of the animation size

/* adjust the stroke-width if needed */
[path] {
	stroke-width: 1px;
}

.hitbox

• make a shape invisible and clickable like .click. Useful to define the clickable area of your animation.