-
-
Notifications
You must be signed in to change notification settings - Fork 1.1k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
[BUG] - Input with "datetime-local" type has wrong margin when setting min/max date #3026
Comments
Can you share the code you used for the screenshot? |
const [tt, setTT] = useState("2024-05-20T12:00:00");
<div className={"flex flex-row flex-wrap items-center justify-between gap-3 sm:gap-5 md:gap-10 lg:gap-16"}>
<div className={"flex flex-grow"}>
<div className={"flex items-center justify-center gap-0.5"}>
<Input type={"datetime-local"} value={tt} onValueChange={setTT}
max={new Date(Date.now()).toISOString().slice(0, -5)}
min={new Date(Date.now() - 2 * 24 * 60 * 60 * 1000).toISOString().slice(0, -5)} />
</div>
</div>
</div> |
@JobberRT I still don't know how to reproduce the issue based on this code. Can you elaborate more? |
@wingkwong Maybe because you are using PM/AM while I'm using 24H ? In my environment, the exact same code can reproduce the bug though. I also tried remove the "second" part of the time string, the bug is still there |
Can you share a stackblitz project so that we could be on the same ground? |
Sure, Here's the link: https://stackblitz.com/edit/vitejs-vite-x36zme?file=src%2FApp.tsx |
NextUI Version
2.3.6
Describe the bug
The
Input
component will have a wrong padding/margin when usingdatetime-local
withmin
/max
and some of the field are disabled.Bug screenshot
Normal screenshot
Your Example Website or App
No response
Steps to Reproduce the Bug or Issue
Create a
Input
component and set itsmax
to now(so that some fields can be disabled, likeyear
).Expected behavior
The margin/padding is correct
Screenshots or Videos
No response
Operating System Version
macOS
Browser
Chrome
The text was updated successfully, but these errors were encountered: