where X is one of {In, Out} and Y is one of {Down, Left, Right, Up}.
Tip: If you're using intellisense, you can just hover over animation class, and if --animate-distance variable appears in styles then you can change its value using animate-distance-[...px].
Regarding downloads stats, it is mainly because I have not put much effort to increase its publicity. And also partially owing to how npm calculates package performance, quality and maintenance scores. They basically look up for stuff like whether or not the package has frequent commits, releases, issues, has tests, linters, docs, types, badges, ci, how is the reputation of the publisher, how many github stars, forks, watchers, contributors, dependents are there, etc. I have many of them as can be seen from the GitHub repo, but I am not bundling that large scripts, dev dependencies list and other such stuff using which npm determines all that as they are useless to a user and wastes their bandwidth. The package.json that is being distributed with the plugin is way truncated down than what is being used for its development.
Thanks a lot! All I have to do "work around" right now is install NPM dependencies. I don't know much at all, I only know that this problem only occurred after installing animated-tailwindcss. I am currently solving the problem below using npm install --force, however it is not an ideal solution.
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! Found: tailwindcss@3.0.0-alpha.2
npm ERR! node_modules/tailwindcss
npm ERR! dev tailwindcss@"^3.0.0-alpha.2" from the root project
npm ERR! peer tailwindcss@">=2.0.0 || >=3.0.0-alpha.1" from @tailwindcss/aspect-ratio@0.3.0
npm ERR! node_modules/@tailwindcss/aspect-ratio
npm ERR! dev @tailwindcss/aspect-ratio@"^0.3.0" from the root project
npm ERR! 2 more (@tailwindcss/forms, @tailwindcss/typography)
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! dev animated-tailwindcss@"^2.6.0" from the root project
npm ERR!
npm ERR! Conflicting peer dependency: tailwindcss@2.2.19
npm ERR! node_modules/tailwindcss
npm ERR! peer tailwindcss@">=1.6.0" from animated-tailwindcss@2.6.0
npm ERR! node_modules/animated-tailwindcss
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
"Since v2.6.0, you can also customize the translating distance of some of the animations using classes like this: animate-distance-[100px]."
I tried the animate-distance property, but it doesn't work. Which animation can it be used on and how exactly does it work?
Thanks for the great plugin, I don't understand why it doesn't have more downloads right now.
Thanks for trying it. You can customize the behavior of the following animation classes using
animate-distance-[...px]
class:where
X
is one of{In, Out}
andY
is one of{Down, Left, Right, Up}
.Tip: If you're using intellisense, you can just hover over animation class, and if
--animate-distance
variable appears in styles then you can change its value usinganimate-distance-[...px]
.Regarding downloads stats, it is mainly because I have not put much effort to increase its publicity. And also partially owing to how npm calculates package performance, quality and maintenance scores. They basically look up for stuff like whether or not the package has frequent commits, releases, issues, has tests, linters, docs, types, badges, ci, how is the reputation of the publisher, how many github stars, forks, watchers, contributors, dependents are there, etc. I have many of them as can be seen from the GitHub repo, but I am not bundling that large scripts, dev dependencies list and other such stuff using which npm determines all that as they are useless to a user and wastes their bandwidth. The package.json that is being distributed with the plugin is way truncated down than what is being used for its development.
Thanks a lot! All I have to do "work around" right now is install NPM dependencies. I don't know much at all, I only know that this problem only occurred after installing animated-tailwindcss. I am currently solving the problem below using npm install --force, however it is not an ideal solution.
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! Found: tailwindcss@3.0.0-alpha.2
npm ERR! node_modules/tailwindcss
npm ERR! dev tailwindcss@"^3.0.0-alpha.2" from the root project
npm ERR! peer tailwindcss@">=2.0.0 || >=3.0.0-alpha.1" from @tailwindcss/aspect-ratio@0.3.0
npm ERR! node_modules/@tailwindcss/aspect-ratio
npm ERR! dev @tailwindcss/aspect-ratio@"^0.3.0" from the root project
npm ERR! 2 more (@tailwindcss/forms, @tailwindcss/typography)
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! dev animated-tailwindcss@"^2.6.0" from the root project
npm ERR!
npm ERR! Conflicting peer dependency: tailwindcss@2.2.19
npm ERR! node_modules/tailwindcss
npm ERR! peer tailwindcss@">=1.6.0" from animated-tailwindcss@2.6.0
npm ERR! node_modules/animated-tailwindcss
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
Can you create an issue on GitHub for this? github.com/ikcb/animated-tailwindc...
I basically need to know how to reproduce this. I would probably need your Node.js and yarn/npm version, and the contents of package.json.
UPDATE: Can you try v2.6.1 and see if the issue is fixed?
Version 2.6.1 solved the problem. Huge thanks!