AAE-36582 Fix forms misaligment in adf form renderer

lib/core/src/lib/form/components/form-renderer.component.html

@@ -1,4 +1,4 @@
-<div id="adf-form-renderer" class="{{ formDefinition.className }}"
+<div id="adf-form-renderer" class="{{ formDefinition.className }} adf-form-renderer"
      [ngClass]="{ 'adf-readonly-form': formDefinition.readOnly }">
     <div *ngIf="formDefinition.hasTabs()">
         <div *ngIf="hasTabs()" class="alfresco-tabs-widget">

lib/core/src/lib/form/components/form-renderer.component.scss

@@ -13,6 +13,14 @@
     height: 100%;
 }
 
+.adf-form-renderer {
+    // override Material styles, otherwise fields collapse on some screen widths
+    .mat-mdc-form-field-infix {
+        /* stylelint-disable-next-line declaration-no-important */
+        width: auto !important;
+    }
+}
+
 .alfresco-tabs-widget {
     width: 100%;
 

lib/core/src/lib/form/components/form-section/form-section.component.scss

@@ -3,7 +3,6 @@
         &-single-column {
             display: flex;
             flex-wrap: inherit;
-            align-items: baseline;
             gap: 1%;
         }