From 0418c9f9fd914b30838c081de5ef783cb172e197 Mon Sep 17 00:00:00 2001
From: AleksanderSklorz <115619721+AleksanderSklorz@users.noreply.github.com>
Date: Wed, 22 May 2024 11:55:20 +0200
Subject: [PATCH] [ACS-7999] Fix inputs for edit and create folder (#9713)

* ACS-7999 Fix inputs for edit and create folder

* ACS-7999 Fix jumping dialog when focus field
---
 .../src/lib/dialogs/folder.dialog.html        |  6 ++---
 .../src/lib/dialogs/folder.dialog.scss        | 23 +++++++++++++++++++
 lib/core/src/lib/styles/_mat-selectors.scss   |  2 ++
 3 files changed, 28 insertions(+), 3 deletions(-)

diff --git a/lib/content-services/src/lib/dialogs/folder.dialog.html b/lib/content-services/src/lib/dialogs/folder.dialog.html
index 943cf924af5..386f4ee8ff0 100644
--- a/lib/content-services/src/lib/dialogs/folder.dialog.html
+++ b/lib/content-services/src/lib/dialogs/folder.dialog.html
@@ -4,7 +4,7 @@ <h2 data-automation-id="adf-folder-dialog-title" class="adf-folder-dialog-title"
 
 <mat-dialog-content class="adf-folder-dialog-content">
     <form [formGroup]="form" (submit)="submit()">
-        <mat-form-field class="adf-full-width" appearance="outline">
+        <mat-form-field class="adf-full-width">
             <mat-label>{{ 'CORE.FOLDER_DIALOG.FOLDER_NAME.LABEL' | translate }}</mat-label>
             <input
                 id="adf-folder-name-input"
@@ -26,7 +26,7 @@ <h2 data-automation-id="adf-folder-dialog-title" class="adf-folder-dialog-title"
             </mat-hint>
         </mat-form-field>
 
-        <mat-form-field class="adf-full-width" appearance="outline">
+        <mat-form-field class="adf-full-width">
             <mat-label>{{ 'CORE.FOLDER_DIALOG.FOLDER_TITLE.LABEL' | translate }}</mat-label>
             <input
                 id="adf-folder-title-input"
@@ -36,7 +36,7 @@ <h2 data-automation-id="adf-folder-dialog-title" class="adf-folder-dialog-title"
             />
         </mat-form-field>
 
-        <mat-form-field class="adf-full-width" appearance="outline">
+        <mat-form-field class="adf-full-width">
             <mat-label>{{ 'CORE.FOLDER_DIALOG.FOLDER_DESCRIPTION.LABEL' | translate }}</mat-label>
             <textarea
                 id="adf-folder-description-input"
diff --git a/lib/content-services/src/lib/dialogs/folder.dialog.scss b/lib/content-services/src/lib/dialogs/folder.dialog.scss
index 84f11a69152..ad7072455cb 100644
--- a/lib/content-services/src/lib/dialogs/folder.dialog.scss
+++ b/lib/content-services/src/lib/dialogs/folder.dialog.scss
@@ -1,7 +1,30 @@
+@import 'styles/mat-selectors';
+
 .adf-folder-dialog {
     .adf-folder-dialog-content {
         padding: 0;
         overflow: unset;
+
+        #{$mat-form-field-infix} {
+            padding-bottom: 3.5px;
+        }
+
+        #{$mat-form-field-hide-placeholder} {
+            #{$mat-floating-label} {
+                padding-top: 11px;
+            }
+        }
+
+        #{$mat-form-field-hint-wrapper} {
+            padding-left: 0;
+            margin-left: -2px;
+            color: var(--adf-theme-foreground-secondary-text-color);
+            font-size: 10.5px;
+        }
+    }
+
+    .adf-folder-dialog-title {
+        display: inline-flex;
     }
 }
 
diff --git a/lib/core/src/lib/styles/_mat-selectors.scss b/lib/core/src/lib/styles/_mat-selectors.scss
index edf6467b46d..357da5d6302 100644
--- a/lib/core/src/lib/styles/_mat-selectors.scss
+++ b/lib/core/src/lib/styles/_mat-selectors.scss
@@ -96,6 +96,8 @@ $mat-slide-toggle: '.mat-mdc-slide-toggle';
 $mat-list-item-unscoped-content: '.mat-mdc-list-item-unscoped-content';
 $mat-text-field--no-label: '.mdc-text-field--no-label';
 $mat-form-field-infix: '.mat-mdc-form-field-infix';
+$mat-form-field-hide-placeholder: '.mat-form-field-hide-placeholder';
+$mat-form-field-hint-wrapper: '.mat-mdc-form-field-hint-wrapper';
 $mat-checkbox-background: '.mdc-checkbox__background';
 $mat-dialog-content: '.mdc-dialog__content';
 $mat-floating-label: '.mdc-floating-label';