add clear icon to parent

UI/public/config/appsetting.json

@@ -1,4 +1,5 @@
 {
+    "baseUrl1": "http://192.168.8.188:5015",    
     "baseUrl": "http://localhost:5015",    
     "attachment": "http://localhost/document/family"
 }

UI/src/app/person/family.tree.html

@@ -1,20 +1,10 @@
 <div class="shadow-2xl rounded p-2 mt-2">
-<h3>Family Tree</h3>
+<h3>Family Tree by Person has Father</h3>
 <div>
   <form>
     <div class="grid grid-cols-4 gap-2">
       <div class="">
-        <label for="login">Email</label>
+        <label for="firstname">Family Tree person Has Father </label>
-        <input id="login" pInputText name="login" type="text" [(ngModel)]="email"
-          class="inputfield w-full p-inputtext-sm">
-      </div>
-      <div class="">
-        <label for="lastname1">Surname</label>
-        <input id="lastname1" pInputText name="lastname" type="text" [(ngModel)]="lastname"
-          class="inputfield w-full p-inputtext-sm">
-      </div>
-      <div class="">
-        <label for="firstname">First Name</label>
         <input id="firstname" name="firstname" pInputText type="text" [(ngModel)]="firstname"
           class="inputfield w-full p-inputtext-sm">
       </div>    

UI/src/app/person/familylist.ts

@@ -79,7 +79,7 @@ export class FamilyList implements OnInit, OnDestroy{
                       }  
                     },
                     {
-                        label: 'Show Organization',
+                        label: 'Show Family',
                         icon: 'pi pi-sitemap',
                         command: () => {
                           this.showChildren(this.selectId);

UI/src/app/person/person.edit.html

@@ -21,7 +21,7 @@
             </div>
              <div class="">
                 <label for="dob" class="flex w-full">DOB</label>               
-                <p-datepicker  ariaLabelledBy="dob" formControlName="dob"></p-datepicker>
+                <p-datepicker  ariaLabelledBy="dob" formControlName="dob" dateFormat="dd/mm/yy"></p-datepicker>
             </div>
             <div class="">
                 <label for="login">Email</label>
@@ -34,12 +34,12 @@
             </div>
             <div class="">
                 <label class="flex w-full">Father</label>
-                <p-select [filter]="true" filterBy="name" [options]="fatherList" optionLabel="name" appendTo="body" optionValue="id" placeholder="Select Parent"
+                <p-select [filter]="true" [showClear]="true" filterBy="name" [options]="fatherList" optionLabel="name" appendTo="body" optionValue="id" placeholder="Select Parent"
                     formControlName="fatherId" class="w-full p-inputtext-sm mr-1"></p-select >
             </div>
              <div class="">
                 <label class="flex w-full">Mother</label>
-                <p-select  [options]="motherList" [filter]="true" filterBy="name" optionLabel="name" appendTo="body" optionValue="id" placeholder="Select Parent"
+                <p-select  [options]="motherList" [showClear]="true" [filter]="true" filterBy="name" optionLabel="name" appendTo="body" optionValue="id" placeholder="Select Parent"
                     formControlName="motherId" class="w-full p-inputtext-sm mr-1"></p-select >
             </div>
            

UI/src/app/toolbar/toolbar.component.html

@@ -1,8 +1,8 @@
 @if (currentUserS() && isAuth)
 {
-<div class="flex flex-column justify-between md:flex-row rounded" style="background-color:white">
+<div class="flex flex-column justify-between md:flex-row rounded" style="background-color:transparent">
     <div style="margin-top:5px;padding-right:35px; cursor: pointer;width:400px;">
-        <img (click)="onHome()" src="images/application_image.png" alt="Banner" style="height:60px;width:100%" />
+        <img (click)="onHome()" src="images/application_image.png" alt="Banner" style="height:80px;width:100%" />
     </div>
     <div class="flex justify-end items-end flex-row">
         <div class="flex-column">

UI/src/styles.css

@@ -39,8 +39,8 @@ body {
 }
 
 .p-datepicker table td>span {
-    width: 1rem !important;
+    width: 1.2rem !important;
-    height: 1rem !important;
+    height: 1.2rem !important;
     border: none !important;
 }
 
@@ -49,7 +49,7 @@ body {
 }
 
 .p-datepicker .p-timepicker span {
-    font-size: 0.9rem !important;
+    font-size: 1rem !important;
 }
 
 .p-datatable .p-datatable-tbody>tr>td {