nextui-org / nextui

🚀 Beautiful, fast and modern React UI library.
https://nextui.org
MIT License
21.94k stars 1.53k forks source link

[BUG] - BLURRY ON SIZE ANIMATIONS #2288

Closed iyiolacak closed 4 days ago

iyiolacak commented 9 months ago

NextUI Version

2.2.9

Describe the bug

It gets blurry for a moment when I click on any button because of click animation. Animation is good but why is that blur happens? If you think it is unfixable and if that's easy for you, I would love to hear how to remove that animation briefly .

Browser: Brave

Your Example Website or App

No response

Steps to Reproduce the Bug or Issue

Click any button, same in NextUI's website(/docs/components/button)

Expected behavior

No blur, work properly.

Screenshots or Videos

https://github.com/nextui-org/nextui/assets/142077242/56a5c876-fedb-4a5f-914d-12fea92d391c

Operating System Version

Windows 11, up to date.

Browser

Chrome

RedFr4me commented 3 months ago

I'm having the exact same issue? It also happens on modals and everything really. Any solution yet?

wingkwong commented 3 months ago

@RedFr4me can you share which version are you using? It'd be better if you could provide a screen record since I couldn't really see the issue on my side.

RedFr4me commented 3 months ago

Hey, I'm using "@nextui-org/react": "^2.4.6", here is an example with the modal, pay attention to the text.

https://github.com/user-attachments/assets/6b785215-59f0-4f90-bf8d-5bdf72da2a35

iyiolacak commented 1 month ago

@RedFr4me Issue is same. Thanks for the screen record. I assume GPU acceleration causes this issue but I am NOT SURE. Some kind of a CSS transition should be triggering this.

wingkwong commented 1 month ago

it may be due to framer-motion. ref: #3817