From 3502bce7493c6fd0b3ffaad78acafd5bfc8508e9 Mon Sep 17 00:00:00 2001
From: jacekpluta <73617938+jacekpluta@users.noreply.github.com>
Date: Wed, 12 Jun 2024 08:45:40 +0200
Subject: [PATCH] [ACS-7944] [ADW] Start process page (#9802)

---
 .../components/login/login.component.scss     |  2 +-
 lib/core/src/lib/styles/_mat-selectors.scss   |  1 +
 .../attach-file-widget-dialog.component.html  |  2 +-
 .../attach-file-widget-dialog.component.scss  | 11 ++++++
 .../start-process.component.html              |  3 +-
 .../start-process.component.scss              | 34 +++++++++++++++++--
 6 files changed, 48 insertions(+), 5 deletions(-)

diff --git a/lib/core/src/lib/login/components/login/login.component.scss b/lib/core/src/lib/login/components/login/login.component.scss
index d3093ea47f7..cf30c636dac 100644
--- a/lib/core/src/lib/login/components/login/login.component.scss
+++ b/lib/core/src/lib/login/components/login/login.component.scss
@@ -24,7 +24,7 @@
     }
 
     .adf-ie11FixerParent {
-        margin-top: 16px;
+        margin: 16px 0;
         min-width: 320px;
 
         // IE11 vertical centering
diff --git a/lib/core/src/lib/styles/_mat-selectors.scss b/lib/core/src/lib/styles/_mat-selectors.scss
index 6415cf4c6eb..46c6e7aa5b2 100644
--- a/lib/core/src/lib/styles/_mat-selectors.scss
+++ b/lib/core/src/lib/styles/_mat-selectors.scss
@@ -145,3 +145,4 @@ $mat-form-field-error-wrapper: '.mat-mdc-form-field-error-wrapper';
 $mat-text-field-textarea: '.mdc-text-field--textarea';
 $mat-list-item-disabled: '.mdc-list-item--disabled';
 $mat-chip-focus-overlay: '.mat-mdc-chip-focus-overlay';
+$mat-card-header: '.mat-mdc-card-header';
diff --git a/lib/process-services/src/lib/form/widgets/content-widget/attach-file-widget-dialog.component.html b/lib/process-services/src/lib/form/widgets/content-widget/attach-file-widget-dialog.component.html
index c83361546b5..3a857bd744d 100644
--- a/lib/process-services/src/lib/form/widgets/content-widget/attach-file-widget-dialog.component.html
+++ b/lib/process-services/src/lib/form/widgets/content-widget/attach-file-widget-dialog.component.html
@@ -18,7 +18,7 @@
     </adf-content-node-selector-panel>
 </mat-dialog-content>
 
-<mat-dialog-actions align="end">
+<mat-dialog-actions class="adf-login-dialog-actions" align="end">
     <button
         mat-button
         (click)="close()"
diff --git a/lib/process-services/src/lib/form/widgets/content-widget/attach-file-widget-dialog.component.scss b/lib/process-services/src/lib/form/widgets/content-widget/attach-file-widget-dialog.component.scss
index b89d90dc515..69251d46267 100644
--- a/lib/process-services/src/lib/form/widgets/content-widget/attach-file-widget-dialog.component.scss
+++ b/lib/process-services/src/lib/form/widgets/content-widget/attach-file-widget-dialog.component.scss
@@ -22,4 +22,15 @@
             }
         }
     }
+
+    .adf-login-dialog-actions {
+        margin-left: -25px;
+        margin-right: -25px;
+        padding-right: 25px;
+    }
 }
+
+#{$mat-dialog-surface} {
+    overflow-x: hidden;
+}
+
diff --git a/lib/process-services/src/lib/process-list/components/start-process/start-process.component.html b/lib/process-services/src/lib/process-list/components/start-process/start-process.component.html
index adcf9f2e256..e359115fdbf 100644
--- a/lib/process-services/src/lib/process-list/components/start-process/start-process.component.html
+++ b/lib/process-services/src/lib/process-list/components/start-process/start-process.component.html
@@ -15,6 +15,7 @@
                             placeholder="{{ 'ADF_PROCESS_LIST.START_PROCESS.FORM.LABEL.SELECT_APPLICATION' | translate }}"
                             (selectionChange)="onAppSelectionChange($event)"
                             [(ngModel)]="selectedApplication"
+                            class="adf-start-process-definition-select"
                             data-automation-id="adf-start-process-apps-drop-down">
                             <mat-option
                                 *ngFor="let application of applications"
@@ -61,7 +62,7 @@
                         </div>
                     </mat-form-field>
                 </div>
-                <mat-form-field class="adf-process-input-container" [floatLabel]="'always'">
+                <mat-form-field class="adf-process-input-container adf-process-input-container-process-name" [floatLabel]="'always'">
                     <mat-label>{{'ADF_PROCESS_LIST.START_PROCESS.FORM.LABEL.NAME' | translate}}</mat-label>
                     <input
                         matInput
diff --git a/lib/process-services/src/lib/process-list/components/start-process/start-process.component.scss b/lib/process-services/src/lib/process-list/components/start-process/start-process.component.scss
index 5dbe851d603..01f3f418785 100644
--- a/lib/process-services/src/lib/process-list/components/start-process/start-process.component.scss
+++ b/lib/process-services/src/lib/process-list/components/start-process/start-process.component.scss
@@ -17,8 +17,11 @@
         }
 
         &-content-actions {
+            padding-bottom: 16px;
+            padding-right: 16px;
             text-align: right;
         }
+
         #{$mat-button} {
             width: auto;
             padding: 0 16px;
@@ -35,16 +38,20 @@
         mat-form-field {
             width: 100%;
         }
+
+        &-process-name {
+            margin-top: 16px
+        }
     }
 
     &-process-input-autocomplete {
         display: flex;
         padding-bottom: 2px;
 
-        button {
+        .adf-start-process-button {
             position: absolute;
             right: -14px;
-            top: 0;
+            top: 10px;
         }
 
         mat-spinner {
@@ -55,6 +62,14 @@
     }
 
     &-start-form-container {
+        #{$mat-card} {
+            height: 100%;
+        }
+
+        #{$mat-card-header} {
+            display: none;
+        }
+
         .adf-start-form-card:has(.adf-start-form-header) {
             box-shadow: none;
             padding: 0;
@@ -63,6 +78,11 @@
 
     &-start-form-actions:has(.adf-start-form-actions-button) {
         text-align: right;
+        padding-bottom: 16px;
+
+        button {
+            text-wrap: none;
+        }
     }
 
     &-start-process-definition-container {
@@ -70,6 +90,16 @@
         flex-direction: row;
         justify-content: space-around;
         align-items: baseline;
+
+        .adf-start-process-definition-select {
+            .mat-mdc-select-arrow-wrapper {
+                transform:  none;
+
+                svg {
+                    fill: initial;
+                }
+            }
+        }
     }
 
     &-start-process-app-list {