Shiny Text is not working with shadcn?

[LintaoAmons]

Is there an working example of shadcn with reactbits' Shiny Text?

[DavidHDev]

shadcn has nothing to do with React Bits. These are independent plug-in components. If it's not working there's a 99% chance you're not using it right.

[LintaoAmons]

Hi, I create a repo for demo my usage, could you please help me to check where goes wrong?

https://github.com/LintaoAmons/reactbit-shiny-text

you can test by running the cmds in the readme.md

npm run dev -- --port 4003

open http://localhost:4003/shiny-text-demo

Following is the result on my machine:

And I do succeed when I init a new project without shadcn, so I thought it is the reason

[DavidHDev]

I've cloned your project. As you can see it does work:

In your example, you just can't see the animation because the background color is white. After inspecting the website in the dev tools and changing the background to a dark color, the animation is running as expected.

[LintaoAmons]

okay， thanks! but I didn't expect that white background will make it totally disappear...

[DavidHDev]

well, if you shine a light in a very bright room, it would be hard to notice the light, right? Same concept applies here. You can play around with the color values in the code if you want to experiment on light mode.