✨ New package `@master/animate.css`

Open 1aron opened this issue 2 years ago • 0 comments

Description

https://animate.style is a welcome CSS animation library that can be used on demand if we provide it with a Master CSS configuration.

export default {
    animations: {
        'slide-in-up': {
            from: { transform: 'translate3d(0, 100%, 0)' },
            to: { transform: 'translate3d(0, 0, 0)' }
        },
        ...
    }
}

Before we provide the package, you can of course import the pure CSS version first:

<html>
<head>
    <script src="https://cdn.master.co/css@beta"></script>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css"/>
    ...
</head>
<body>
    <div class="@slide-in-up|.5s">slideInUp</div>
</body>
</html>

That's the magic of it.

Using csso and css-tree

May 22 '23 09:05 1aron