AAE-35310 Displaying different text fields on an eform doesn't align vertically or horizontally (#10979)

* AAE-35310 fixing vertical or horizontal alignment issues

* AAE-35310 refactoring code and removed manual scss with flexboxes

lib/process-services-cloud/src/lib/form/components/widgets/date/date-cloud.widget.html

@@ -13,7 +13,7 @@
             ></label
         >
     </div>
-    <div>
+    <div class="adf-date-widget-container">
         <mat-form-field class="adf-date-widget adf-form-field-input" [class.adf-left-label-input-datepicker]="field.leftLabels">
             @if ( (field.name || field?.required) && !field.leftLabels) {
                 <mat-label class="adf-label" [attr.for]="field.id">

lib/process-services-cloud/src/lib/form/components/widgets/date/date-cloud.widget.scss

@@ -11,6 +11,12 @@
         .adf-label {
             top: 20px;
         }
+
+        &-container {
+            display: flex;
+            align-items: flex-start;
+            flex-direction: column;
+        }
     }
 
     &-left-label-input-datepicker {

lib/process-services-cloud/src/lib/form/components/widgets/display-rich-text/display-rich-text.widget.scss

@@ -1,6 +1,4 @@
 .adf-display-rich-text-widget {
-    padding: 10px;
-
     pre {
         min-height: 100px;
         font-family: Menlo, Monaco, Consolas, 'Courier New', monospace;

lib/process-services-cloud/src/lib/form/components/widgets/radio-buttons/radio-buttons-cloud.widget.scss

@@ -9,7 +9,6 @@
     }
 
     &-radio-button-container {
-        margin-bottom: 15px;
         display: flex;
         flex-direction: column;
 
@@ -23,7 +22,7 @@
     &-radio-button-container-horizontal {
         margin-bottom: 15px;
         display: flex;
-        flex-flow: row wrap;
+        flex-flow: column wrap;
         align-items: flex-start;
         justify-content: flex-start;