From 41023accd9dc1a3adc78a071acb97e34c87ee118 Mon Sep 17 00:00:00 2001
From: Valentin Serra <valentin.serra@camunda.com>
Date: Wed, 11 Oct 2023 23:58:31 +0200
Subject: [PATCH] fix: datetime resizes properly

Closes #781
---
 .../form-js-viewer/assets/form-js-base.css    | 22 +++++++++----------
 1 file changed, 10 insertions(+), 12 deletions(-)

diff --git a/packages/form-js-viewer/assets/form-js-base.css b/packages/form-js-viewer/assets/form-js-base.css
index 9ef092773..5c31593a3 100644
--- a/packages/form-js-viewer/assets/form-js-base.css
+++ b/packages/form-js-viewer/assets/form-js-base.css
@@ -458,13 +458,20 @@
   min-height: var(--form-field-height);
 }
 
-
 .fjs-container .fjs-datepicker,
-.fjs-container .fjs-timepicker,
-.fjs-container .fjs-datetime-subsection {
+.fjs-container .fjs-timepicker {
   width: 100%;
 }
 
+.fjs-container .fjs-datetime-subsection {
+  min-width: 0;
+  flex: 1;
+}
+
+.fjs-container .fjs-datetime-separator {
+  width: 10px;
+}
+
 .fjs-container .fjs-timepicker-anchor {
   height: 100%;
   display: flex;
@@ -474,10 +481,6 @@
   color: var(--color-icon-base);
 }
 
-.fjs-container .fjs-datetime-separator {
-  width: 10px;
-}
-
 .fjs-container .fjs-input-group {
   display: flex;
   width: 100%;
@@ -547,11 +550,6 @@
   border-radius: 3px;
 }
 
-.fjs-container .fjs-vertical-group {
-  display: flex;
-  width: 100%;
-}
-
 .fjs-container .flatpickr-wrapper {
   width: 100%;
   height: 100%;