fix(form): inline calendar fields did not display properly

When a ui calendar is used within a inline field, its display was broken (shrunk and not inline)
I had to use a proper direct em setting to fix this, as the input field is inside the calendar component making the usual width: auto not work as for the other standard input form fields.

Author: lubber-de

src/definitions/collections/form.less

@@ -1097,6 +1097,16 @@
     font-size: @inlineInputSize;
   }
 
+  .ui.form .inline.fields .field .calendar:not(.popup),
+  .ui.form .inline.field .calendar:not(.popup) {
+    display:inline-block;
+  }
+
+  .ui.form .inline.fields .field .calendar:not(.popup) > .input > input,
+  .ui.form .inline.field .calendar:not(.popup) > .input > input {
+    width: @inlineCalendarWidth;
+  }
+
   /* Label */
   .ui.form .inline.fields .field > :first-child,
   .ui.form .inline.field > :first-child {

src/themes/default/collections/form.variables

@@ -158,6 +158,7 @@
 @inlineLabelFontSize: @labelFontSize;
 @inlineLabelFontWeight: @labelFontWeight;
 @inlineLabelTextTransform: @labelTextTransform;
+@inlineCalendarWidth: 13.11em;
 
 @groupedInlineLabelMargin: 0.035714em 1em 0 0;