Show duration options in an overlay

“there is a common pattern in calendar software to show duration options in an overlay” is not a good enough reason to merge this into Drupal CMS, just a good enough reason to test it and evaluate if we want it.

I'd love that, if possible UX or UI improvements are identified, we highlight them first and discuss them, before assuming they are correct and merging them. Because as a consequence you'll start building things on top of that, others reusing them, and then changing things will be a headache.

So I'd recommend not merging this, but first test it to make sure it's an improvement.

Hi @mandclu, I've applied the provided MR as a patch and it applied cleanly with no errors. After applying the patch Use an overlay to display duration options. - EXPERIMENTAL option is now being shown in smart_date field widget. When enabling the new overlay display duration, duration is shown between the time in the node edit page. However, there's a spacing/alignment issue in the overlay as shown in the attached screenshot. The extra spaces issue can be resolved if width: 3.75rem; is removed from the class .smart-date--duration-list--time. After removing the extra space is not visible and the time duration is displayed properly. I've attached screenshots of before and after fixes for your reference. As the design issue is present hence moving the issue status to Needs work.

Thanks!

Hi @mandclu, now I can confirm that the styling issue for the duration has been fixed. I've tested the overlay duration for both 12h and 24h formatting and the overlay design is working perfectly. I'm attaching the screenshots for your reference. RTBC.

Thanks!