Let me first show the field:
Some context: this is for a progress tracking app I am building for myself, and other indie makers (https://logvana.com). I am really focusing on being able to navigate and use the app with just a keyboard. You can enter a date & time in two parts of the app: 1) when setting the date & time for a daily check-in, and 2) when setting a due date and optional time for a single todo item.
I originally started by using native date-time fields (input
fields with type=date
and type=time
). The problem with these fields is that they are inconsistent in how browsers implement them, and their overall keyboard-friendliness. I wanted something that consistently felt great when using with a keyboard.
The things that were really important to me, and that are thankfully working the way I want them to:
input
s for date & time entry.It was a lot of time to spend on a simple date and time field but I wanted to get this just right. A part of this was work around the plumbing to allow due dates and check-in times to be triggered with the keyboard.
I would love to hear thoughts, even if it's just based on the animated gif in the embedded tweet above (even better if you happen to give the datetime editor a spin for yourself at https://logvana.com).