added some styles to folder select

Author: shawon

eform-client/src/app/common/modules/eform-shared/components/eform-tree-view-picker/eform-tree-view-picker.component.html

@@ -26,7 +26,6 @@
     matTreeNodePadding=""
     [ngClass]="{'children': getLevel(node) > 0}">
     <div
-      style="padding-left: 2px;"
       [ngClass]="{'folder': !lockSelectedNode, 'no-drop': lockSelectedNode,
       'selected-folder': selectedFolderIds.includes(node.id)}"
       (click)="selected(node.id)"

eform-client/src/app/common/modules/eform-shared/components/eform-tree-view-picker/eform-tree-view-picker.component.scss

@@ -43,7 +43,7 @@ mat-mdc-tree-node.mat-mdc-tree-node {
 }
 
 .folder:hover {
-  color: mat.m2-get-color-from-palette(mat.$m2-teal-palette, 300);
+  //color: mat.m2-get-color-from-palette(mat.$m2-teal-palette, 300);
   transition: color .5s;
 }
 

eform-client/src/app/common/modules/eform-shared/components/entity-edit-create/entity-edit-create.component.html

@@ -1,4 +1,5 @@
 <eform-new-subheader [title]="title | translate" [forceStaticTitle]="true">
+<div class="d-flex flex-row align-items-center gap-12">
   <button
     *ngIf="edit"
     class="btn-primary btn-primary--icon-left"
@@ -24,6 +25,7 @@
   >
     {{ 'Cancel' | translate }}
   </button>
+</div>
 </eform-new-subheader>
 
 <mat-card>
@@ -48,18 +50,18 @@
         type="text">
     </mat-form-field>
 
-    <div class="d-flex justify-content-end">
+    <div class="d-flex justify-content-end align-items-center gap-12 mb-4">
       <button
         id="editEntitySearchImportBtn"
-        mat-icon-button
+        class="btn-secondary btn-secondary--icon-rounded-border"
         [disabled]="entityGroupEditModel.isLocked && !entityGroupEditModel.isEditable"
         (click)="openImportEntityGroup()"
       >
         <mat-icon>format_list_bulleted</mat-icon>
       </button>
       <button
         id="addSingleEntitySelectableItem"
-        mat-icon-button
+        class="btn-secondary btn-secondary--icon-rounded-border"
         (click)="addNewEntityItem()"
         [disabled]="entityGroupEditModel.isLocked && !entityGroupEditModel.isEditable"
       >

eform-client/src/scss/styles.scss

@@ -65,6 +65,7 @@ body, .theme-light {
   --text-header: #{$text-header-light};
   //--mat-card-elevated-container-color: #{$bg-light}!important;
   --primary: #{$primary-light};
+  --primary-light: #{$primary-light-light-mode};
   --warning: #{$warning-light};
   --error: #{$error-light};
   --btn-delete-text: #{$text-header-dark};
@@ -86,6 +87,7 @@ body, .theme-dark {
   --text-header: #{$text-header-dark};
   //--mat-card-elevated-container-color: #{$bg-dark}!important;
   --primary: #{$primary-dark};
+  --primary-light: #{$primary-light-dark-mode};
   --warning: #{$warning-dark};
   --error: #{$error-dark};
   --btn-delete-text: #{$text-header-light};
@@ -641,14 +643,19 @@ ngx-material-timepicker-container {
 
 body.theme-dark .NgxEditor, body.theme-light .NgxEditor{
   background: var(--bg)!important;
-  border-bottom: unset!important;
-  border: 1px solid var(--border)!important;
+  //border-bottom: unset!important;
+  border: none!important;
   color: var(--tp-text) !important;
-  .NgxEditor__MenuBar{
-    background: var(--bg)!important;
+  &__MenuBar{
+    background: var(--card) !important;
   }
 }
 
+formatting-text-editor{
+  border: 1px solid var(--border)!important;
+  border-radius: 4px!important;
+}
+
 .ng-dropdown-panel{
   background: var(--bg)!important;
   border: 1px solid var(--border)!important;
@@ -954,6 +961,21 @@ eform-new-subheader{
       }
     }
   }
+}
 
-
+mat-tree-node.children {
+  padding-left: 56px !important;
+}
+mat-tree-node{
+  display: flex;
+  height: 40px;
+  padding: var(--28-px, 8px) var(--28-px, 8px) var(--28-px, 8px) var(--832-px, 32px)!important;
+  align-items: center;
+  gap: var(--156-px, 6px);
+  align-self: stretch;
+  background: var(--bg)!important;
+  &:hover, &:active, &[aria-expanded="true"]{
+    color: var(--primary);
+    background: var(--primary-light, #F5FCFC)!important;
+  }
 }