Adding filter icons

bcgov · Oct 12, 2023 · 0adab34 · 0adab34
1 parent 9a3610c
commit 0adab34
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 8 deletions.
diff --git a/...mponents/wildfires-list-header/filter-options-dialog/filter-options-dialog.component.html b/...mponents/wildfires-list-header/filter-options-dialog/filter-options-dialog.component.html
@@ -8,20 +8,20 @@
       <div class="dialog-title">Sort By</div>
       <button [class]="'radius-button' + (filterData.sortColumn === 'incidentName' ? '-selected' : '')" (click)="setSortColumn('incidentName')" mat-flat-button ><span class="list-button-label">Wildfire Name</span></button>
       <button [class]="'radius-button' + (filterData.sortColumn === 'fireCentreName' ? '-selected' : '')" (click)="setSortColumn('fireCentreName')" mat-flat-button ><span class="list-button-label">Fire Centre</span></button>
-      <button [class]="'radius-button' + (filterData.sortColumn === 'lastUpdatedTimestamp' ? '-selected' : '')" (click)="setSortColumn('lastUpdatedTimestamp')" mat-flat-button ><span class="list-button-label">Last Update Time</span></button>
+      <button [class]="'radius-button' + (filterData.sortColumn === 'lastUpdatedTimestamp' ? '-selected' : '')" (click)="setSortColumn('lastUpdatedTimestamp')" mat-flat-button ><span class="list-button-label">Last Update</span></button>
     </div>
     <div class="radius-panel">
       <div class="dialog-title">Sort By Direction</div>
       <button [class]="'radius-button' + (filterData.sortDirection === 'ASC' ? '-selected' : '')" (click)="setSortDirection('ASC')" mat-flat-button ><span class="list-button-label">Ascending</span></button>
       <button [class]="'radius-button' + (filterData.sortDirection === 'DESC' ? '-selected' : '')" (click)="setSortDirection('DESC')" mat-flat-button ><span class="list-button-label">Descending</span></button>
     </div>
     <div class="radius-panel">
-      <div class="dialog-title">Filter By Wildfire Type</div>
-      <button [class]="'radius-button' + (filterData.fireOfNoteInd ? '-selected' : '')" (click)="setFireOfNoteInd()" mat-flat-button ><span class="list-button-label">Wildfire of Note</span></button>
-      <button [class]="'radius-button' + (filterData.stagesOfControl.includes('OUT_CNTRL') ? '-selected' : '')" (click)="setStageOfControl('OUT_CNTRL')" mat-flat-button ><span class="list-button-label">Out of Control</span></button>
-      <button [class]="'radius-button' + (filterData.stagesOfControl.includes('HOLDING') ? '-selected' : '')" (click)="setStageOfControl('HOLDING')" mat-flat-button ><span class="list-button-label">Being Held</span></button>
-      <button [class]="'radius-button' + (filterData.stagesOfControl.includes('UNDR_CNTRL') ? '-selected' : '')" (click)="setStageOfControl('UNDR_CNTRL')" mat-flat-button ><span class="list-button-label">Under Control</span></button>
-      <button [class]="'radius-button' + (filterData.stagesOfControl.includes('OUT') ? '-selected' : '')" (click)="setStageOfControl('OUT')" mat-flat-button ><span class="list-button-label">Out</span></button>
+      <div class="dialog-title">Filter By Stage of Control</div>
+      <button [class]="'radius-button' + (filterData.fireOfNoteInd ? '-selected' : '')" (click)="setFireOfNoteInd()" mat-flat-button ><img height="17" width="17" src="/assets/images/local_fire_department.png" alt="Wildfire" class="icon"><span class="list-button-label">Wildfire of Note</span></button>
+      <button [class]="'radius-button' + (filterData.stagesOfControl.includes('OUT_CNTRL') ? '-selected' : '')" (click)="setStageOfControl('OUT_CNTRL')" mat-flat-button ><img height="17" width="17" src="/assets/images/svg-icons/out-of-control.svg" alt="Out of Control" class="icon"><span class="list-button-label">Out of Control</span></button>
+      <button [class]="'radius-button' + (filterData.stagesOfControl.includes('HOLDING') ? '-selected' : '')" (click)="setStageOfControl('HOLDING')" mat-flat-button ><img height="17" width="17" src="/assets/images/svg-icons/being-held.svg" alt="Holding" class="icon"><span class="list-button-label">Being Held</span></button>
+      <button [class]="'radius-button' + (filterData.stagesOfControl.includes('UNDR_CNTRL') ? '-selected' : '')" (click)="setStageOfControl('UNDR_CNTRL')" mat-flat-button ><img height="17" width="17" src="/assets/images/svg-icons/under-control.svg" alt="Under Control" class="icon"><span class="list-button-label">Under Control</span></button>
+      <button [class]="'radius-button' + (filterData.stagesOfControl.includes('OUT') ? '-selected' : '')" (click)="setStageOfControl('OUT')" mat-flat-button ><img height="17" width="17" src="/assets/images/svg-icons/out-fire.svg" alt="Out" class="icon"><span class="list-button-label">Out</span></button>
     </div>
     <div class="radius-panel">
       <div class="dialog-title">Filter By Fire Centre</div>

diff --git a/...app/components/wildfires-list-header/wildfires-list/wildfires-list.component.desktop.html b/...app/components/wildfires-list-header/wildfires-list/wildfires-list.component.desktop.html
@@ -62,7 +62,7 @@
             <img height="17" width="17" src="/assets/images/svg-icons/under-control.svg" alt="Under Control" class="icon"><span class="checkbox-label">Under Control</span>
           </mat-checkbox>
           <mat-checkbox (change)="stageOfControlChanges($event)" value="all" [(ngModel)]="outWildfiresInd">
-            <img height="17" width="17" src="/assets/images/svg-icons/out-fire.svg" alt="Under Control" class="icon"><span class="checkbox-label">Out Wildfires</span>
+            <img height="17" width="17" src="/assets/images/svg-icons/out-fire.svg" alt="Out" class="icon"><span class="checkbox-label">Out Wildfires</span>
           </mat-checkbox>
       </section>
   </div>