WEB-729 Improve Pending Tasks text visibility in dark mode

src/app/tasks/checker-inbox-and-tasks/checker-inbox-and-tasks.component.html

@@ -9,7 +9,7 @@
 <div class="container">
   <mat-card class="tasks-card">
     <mat-card-content>
-      <div class="card-heading">{{ 'labels.heading.Pending Tasks' | translate }}</div>
+      <div class="card-heading pending-tasks-heading">{{ 'labels.heading.Pending Tasks' | translate }}</div>
       <mat-divider></mat-divider>
       <nav mat-tab-nav-bar class="navigation-tabs" [tabPanel]="tabPanel">
         <a

src/app/tasks/checker-inbox-and-tasks/checker-inbox-and-tasks.component.scss

@@ -13,6 +13,11 @@
   margin-bottom: 16px;
 }
 
+:host-context(.dark-theme) .pending-tasks-heading {
+  color: #fff;
+  text-shadow: 0 1px 4px rgb(0 0 0 / 70%);
+}
+
 mat-divider {
   margin-bottom: 16px;
 }