diff --git a/frontend/src/app/pages/head-mod/staff-pt/staff-pt.component.html b/frontend/src/app/pages/head-mod/staff-pt/staff-pt.component.html
index eab71bf..42cfc6e 100644
--- a/frontend/src/app/pages/head-mod/staff-pt/staff-pt.component.html
+++ b/frontend/src/app/pages/head-mod/staff-pt/staff-pt.component.html
@@ -7,18 +7,19 @@
     <div class="staff-pt-container centered">
       <div class="week-header">
         <button mat-icon-button (click)="prevWeek()" matTooltip="Previous week" aria-label="Previous week">
-          <mat-icon>chevron_left</mat-icon>
+          <mat-icon style="color: var(--font-color)">chevron_left</mat-icon>
         </button>
 
-        <div class="week-title"><span>{{ weekLabel() }}</span></div>
+        <div class="week-title"><span style="color: var(--font-color)">{{ weekLabel() }}</span></div>
 
         <button mat-icon-button (click)="nextWeek()" [disabled]="!canGoNextWeek()"
                 matTooltip="Next week" aria-label="Next week">
-          <mat-icon>chevron_right</mat-icon>
+          <mat-icon style="color: var(--font-color)">chevron_right</mat-icon>
         </button>
       </div>
 
-      <table mat-table [dataSource]="sortedStaffPt()" class="mat-elevation-z2 full-width" matSort (matSortChange)="sort.set($event)"
+      <table mat-table [dataSource]="sortedStaffPt()" class="mat-elevation-z2 full-width" matSort
+             (matSortChange)="sort.set($event)"
              [matSortActive]="sort().active" [matSortDirection]="sort().direction" [matSortDisableClear]="true">
         <ng-container matColumnDef="staff_member">
           <th mat-header-cell *matHeaderCellDef mat-sort-header="staff_member">Staff Member</th>