tailwindcss-animation-delay - npm Package Compare versions

Comparing version 1.1.0 to 1.2.0

index.js

		const plugin = require('tailwindcss/plugin');

		const animationDelay = plugin(function ({ addUtilities, theme, e }) {
		const values = theme('animationDelay', {
		const defaultValues = {
		'none': '0s',
		@@ -31,4 +31,7 @@ 75: '75ms',
		9000: '9000ms',
		});
		};

		const userValues = theme('animationDelay');
		const values = { ...defaultValues, ...userValues };

		const utilities = Object.entries(values).map(([key, value]) => ({
		@@ -35,0 +38,0 @@ [`.${e(`animation-delay-${key}`)}`]: { animationDelay: `${value}` },

package.json

		{
		"name": "tailwindcss-animation-delay",
		"version": "1.1.0",
		"version": "1.2.0",
		"description": "Tailwind CSS plugin, add animation-delay CSS property.",
		@@ -5,0 +5,0 @@ "main": "index.js",

README.md

		@@ -20,3 +20,3 @@ # tailwindcss-animation-delay
		```js
		// tailwind.config.js
		/** @type {import('tailwindcss').Config} */
		module.exports = {
		@@ -30,3 +30,3 @@ theme: {
		],
		};
		}
		```
		@@ -78,3 +78,3 @@
		```js
		// tailwind.config.js
		/** @type {import('tailwindcss').Config} */
		module.exports = {
		@@ -92,3 +92,23 @@ theme: {
		},
		};
		}
		```

		### Extending the default theme

		If you’d like to preserve the default values for a theme option but also add new values, add your extensions under the `theme.extend` key in your configuration file.

		```js
		/** @type {import('tailwindcss').Config} */
		module.exports = {
		theme: {
		extend: {
		animationDelay: {
		120: "120ms",
		250: "250ms",
		350: "350ms",
		450: "450ms",
		},
		},
		},
		}
		```

New alerts