Skip to content

Releases: lorisleiva/tailwindcss-plugins

v0.3.0

10 Aug 18:47
Compare
Choose a tag to compare

πŸŽ₯ New plugins animations and keyframes that work hand-in-hand together to animate your UI. Here is an example:

theme: {
    animations: {
        spin: 'spin 4s linear infinite',
    },
    keyframes: {
        spin: {
            'from': { 'transform': 'rotate(0deg)' },
            'to': { 'transform': 'rotate(360deg)' },
        }
    }
},
plugins: [
    require('tailwindcss-plugins/animations'),
    require('tailwindcss-plugins/keyframes'),
],
<div class="spin bg-blue-500 w-16 h-16"></div>

Note that you can pull some existing keyframes out-of-the-box. For example, the following code is equivalent to the configuration above.

theme: {
    animations: {
        spin: 'spin 4s linear infinite',
    },
},
plugins: [
    require('tailwindcss-plugins/animations'),
    require('tailwindcss-plugins/keyframes/spin'), // <- Simply pull the keyframes you need.
],

See available keyframes

⬆️ Additional, this library makes now use of Lodash. I originally tried to avoid using it to keep the library light and independent but, since TailwindCSS has Lodash in its dependency, the end-user will end up using Lodash so we might as well use it here too.

v0.2.0

11 Jun 19:17
Compare
Choose a tag to compare

⬆️ Support TailwindCSS 1.x

v0.1.5

11 Jun 17:14
Compare
Choose a tag to compare
:bookmark: Tag v0.1.5

v0.1.4

11 Jun 17:11
Compare
Choose a tag to compare
:bookmark: Tag v0.1.4

v0.1.2

06 Nov 11:14
Compare
Choose a tag to compare
:bookmark: Tag v0.1.2