edit performance appraisal

Mohem/src/app/profile/performance-evaluation/performance-evaluation.component.html

@@ -25,7 +25,7 @@
     <ion-grid>
       <div class="grid">
         <ion-row>
-          <p class="Text">{{ts.trPK('userProfile','performance-evaluation')}}</p>
+          <p [ngClass]=" direction == 'ltr' ?  'Text' : 'Text-ar'">{{ts.trPK('userProfile','performance-evaluation')}}</p>
 
           <div [ngClass]=" direction == 'ltr' ?  'gauge' : 'gauge-ar'" >
 
@@ -65,11 +65,11 @@
           <ion-col  *ngFor="let data of performanceData ;let i = index"  [ngClass]="length % 2 != 0  && i == length - 1 ?  'rightgrid' : 'leftgrid'" >
             <div class="performancecolor" [style.background]="data.color"></div>
             <br>
-            <label class="label"> Your Performance In </label>
-            <label class="label"> {{data.name}} </label>
+            <label [ngClass]=" direction == 'ltr' ?  'label' : 'label-ar'"> {{ts.trPK('userProfile','your-performance')}} </label>
+            <label [ngClass]=" direction == 'ltr' ?  'label' : 'label-ar'"> {{data.name}} </label>
             <br>
-            <label class="labelvalue"> {{data.value}} </label>
-            <label class="percentage"> %</label>
+            <label [ngClass]=" direction == 'ltr' ?  'labelvalue' : 'labelvalue-ar'"> {{data.value}} </label>
+            <label [ngClass]=" direction == 'ltr' ?  'percentage' : 'percentage-ar'"> %</label>
           </ion-col>
       </ion-row>
         </div>

Mohem/src/app/profile/performance-evaluation/performance-evaluation.component.scss

@@ -76,6 +76,19 @@
     text-align: center;
     margin-left: 74px;
   }
+  .Text-ar{
+    margin: 0;
+    padding: 0;
+    text-align: center;
+    font-weight: bolder;
+    color: black;
+    font-size: 16px;
+    margin-top: 5px;
+    margin-bottom: 10px;
+    text-align: center;
+    
+    margin-right: 131px;
+  }
 
   .leftgrid{
     margin-left: 10px;
@@ -120,19 +133,37 @@
   margin-top: -7px !important;
   font-weight: bold !important;
 }
+.label-ar{
+    font-size: 15px !important;
+    margin-top: -7px !important;
+    font-weight: bold !important;
+}
 
 .labelvalue{
-  font-size: 27px !important;
+  font-size: 25px !important;
   font-weight: bold !important;
   margin-top: 7px !important;
   margin-left: 90px !important;
+
 }
+.labelvalue-ar{
+  
+  font-size: 24px !important;
+  font-weight: bold !important;
+  /* margin-top: 7px !important; */
+  margin-right: 19px !important;
+}
+
 
 .percentage{
   font-size: 19px !important;
   margin-top: 15px !important;
 
 }
+.percentage-ar{
+  font-size: 19px !important;
+  margin-right: -54px;
+}
 
 .gauge{
   transform: translate(-24px, -65px);

Mohem/src/assets/localization/i18n.json

@@ -997,6 +997,10 @@
             "en": "Performance",
             "ar": "الاداء"
         },
+        "your-performance": {
+            "en": "Your Performance In",
+            "ar": "ادائك في"
+        },
         "changepicture":{
             "en":"Change Picture",
             "ar":"تغيير الصوره"