Intro

Animations for Helga website. Provided in a separate repo in order to

• make testing easier (simple test cases are contained within the repo)
• make development faster (no waiting times)

Build and deploy

Dev: npm run dev Live: npm run build Deploy: vercel --prod

Use

Import packages from main JavaScript file; they all expose a custom element.

JavaScript:

import { HelgaHoverableButton } from @joinbox/helga-animations';

HTML:

<helga-hoverable-button><span>Click me</span></button></helga-hoverable-button>

Develop

Run npm run dev in order to create dist files.

This creates/updates a dist folder within the root folder (as long as the animation provides an index.html file).

Run python -m http.server 8013 in the root folder to view the animations locally. Then open localhost:8013/dist.

Deploy

vercel --prod