nextui-org / nextui

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

[BUG] - Input transition duration does not work #2933

Open CD-Z opened 5 months ago

CD-Z commented 5 months ago

NextUI Version

2.3.6

Describe the bug

The border of the input variants bordered, underlined and faded has no transition. This is inconsistent with the Select component, which has transitions on these variants.

This can even be seen on the official page.

Your Example Website or App

https://nextui.org/docs/components/input

Steps to Reproduce the Bug or Issue

Use the Input Component

Expected behavior

Consistent behavior throughout the package

Screenshots or Videos

No response

Operating System Version

Linux TuxedoOS 2

Browser

Chrome

linear[bot] commented 5 months ago

ENG-782 [BUG] - Input transition duration does not work

wingkwong commented 5 months ago

I don't get which transitions you mean. Can you elaborate more?

CD-Z commented 5 months ago

I don't get which transitions you mean. Can you elaborate more?

I'm referring to the color transition of the border. I looked into it some more and created a CodeSandbox.

There I found that the class transition-colors gets overwritten by transition-background. image

However this class transition-background doesn't exist on the Select component. image

CD-Z commented 5 months ago

Which adds the problem that the Select Component has no animation on the flat variant.

tb-b commented 2 months ago

Also having this issue with buttons that have transition-transform-colors-opacity class. I'm unable to override the duration by passing className="duration-50"