UI-fixes

frontend/angular/src/app/components/admin-portal/edit-message-template/edit-message-template.component.html

@@ -2,14 +2,22 @@
     <app-error-message></app-error-message>
     <form #form="ngForm">
         <div class="ui-g ui-fluid">
-            <div class="page-title mb-0">
-                <a [routerLink]="['/admin/list-message-templates']" class="arrow-btn-blue ml-0" *ngIf="!objectID">
+            <div class="ui-g-12 ui-md-12">
+                <div class="ui-g ui-fluid">
+                    <div class="ui-g-12">
+                        <div class="page-title">
+                            <a [routerLink]="['/admin/list-message-templates']" class="arrow-btn-blue ml-0"
+                               *ngIf="!objectID">
                                 <img src="assets/images/arrow-left-prev_blue.svg">
                             </a>
                             {{editMode ? "Edit" : "Add"}} Message Template
                         </div>
                     </div>
-        <div class="ui-g form-group bg-white message-template-form">
+                </div>
+                <div class="main-tab-template">
+                    <span class="job-details culture">Message Template</span>
+                </div>
+                <div class="ui-g ui-fluid message-template-form">
                     <div class="ui-g-12 ui-md-12">
                         <div class="form-group row">
                             <div class="col-md-6">
@@ -82,24 +90,30 @@
                                 </span>
                                     </p-header>
                                 </p-editor>
-                        <textarea id="messageContentTxtAreaId" *ngIf="smsTemplateType()" pInputTextarea
+                                <textarea id="messageContentTxtAreaId" *ngIf="smsTemplateType()"
                                           [(ngModel)]="messageTemplate.MessageContent"
                                           name="MessageContent" class="form-control textarea-box"
                                           fieldLabel="Message Content"
                                           placeholder="Message Content"></textarea>
                             </div>
                         </div>
+                    </div>
+                </div>
+                <div class="ui-g ui-fluid">
+                    <div class="ui-g-12 ui-md-12">
                         <div class="ui-g">
                             <div class="ui-g-12 ui-md-12">
                                 <div class="text-center form-group">
                                     <button type="button" value="Cancel" class="btn btn-primary largeBtn greyBtn"
                                             (click)="cancelClicked()">Cancel
                                     </button>
-                            <button *ngIf="showSaveBtn()" type="button" value="Save" class="btn btn-primary largeBtn"
+                                    <button *ngIf="showSaveBtn()" type="button" value="Save"
+                                            class="btn btn-primary largeBtn"
                                             (click)="saveMessageTemplate()" [disabled]="showLoader">
                                         Save
                                     </button>
-                            <button *ngIf="showSaveIntoAllTemplates()" type="button" value="Save into all templates"
+                                    <button *ngIf="showSaveIntoAllTemplates()" type="button"
+                                            value="Save into all templates"
                                             class="btn btn-primary largeBtn"
                                             (click)="saveMessageTemplate()" [disabled]="showLoader">
                                         Save into all templates
@@ -114,6 +128,8 @@
                         </div>
                     </div>
                 </div>
+            </div>
+        </div>
         <div id="showPlainText"></div>
         <p-progressSpinner *ngIf="showLoader"></p-progressSpinner>
     </form>

frontend/angular/src/app/components/admin-portal/edit-workflow-template/edit-workflow-template.component.scss

@@ -68,10 +68,6 @@ p-inputMask {
     cursor: pointer;
 }
 
-.ml-0 {
-    margin-left: 0;
-}
-
 .templateName {
     font-size: 24px;
 }

frontend/angular/src/assets/css/custom.scss

@@ -81,6 +81,10 @@
     margin-right: 0 !important;
 }
 
+.ml-0 {
+    margin-left: 0;
+}
+
 .w-100 {
     width: 100% !important;
 }
@@ -311,6 +315,9 @@ body .ui-dropdown-panel .ui-dropdown-filter-container {
 }
 
 .message-template-form {
+    background-color: #F5F7F8;
+    padding: 65px 10.5%;
+
     label {
         font-family: 'Usual-Regular' !important;
     }
@@ -366,26 +373,6 @@ body .ui-dropdown-panel .ui-dropdown-filter-container {
     }
 }
 
-.ui-multiselect-header {
-    background: none !important;
-    color: #4e5258 !important;
-}
-
-.ui-button:focus, .ui-panel-titlebar-icon:hover {
+.ui-button:focus, .ui-panel-titlebar-icon:hover, .ui-multiselect-close:hover {
     background-color: rgba(3, 160, 231, 0.5) !important;
 }
-
-.ui-multiselect-close {
-    span {
-        color: rgba(78, 82, 88, 0.5) !important;
-        transition: all 0.3s ease;
-    }
-
-    &:hover {
-        background-color: rgba(3, 160, 231, 0.5) !important;
-
-        span {
-            color: white !important;
-        }
-    }
-}