Changed Deleted Icon

Author: el-rabies

projects/website-angular/src/app/search/search.component.html

@@ -282,7 +282,7 @@ <h2>{{ group.typeName }} ({{ group.entriesCount }})</h2>
                             <div class="search-entry">
                               <div class="entry-header">
                                 @if (entry.deleted) {
-                                  <span>❌</span>
+                                  <mat-icon class="deleted-icon">delete</mat-icon>
                                   <span class="deleted" [innerHTML]="entry.stId"></span>
                                   @if (entry.replacementStIds?.length) {
                                     ⇒

projects/website-angular/src/app/search/search.component.scss

@@ -78,6 +78,14 @@ $border-radius: 8px;
   color: #555;
 }
 
+.deleted-icon {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 20px;
+  color: var(--error);
+}
+
 
 // Facet sidebar
 .facet-sidebar {

projects/website-angular/src/app/search/search.component.ts

@@ -16,11 +16,12 @@ import {
   FacetCount,
 } from '../../services/search.service';
 import { DatePipe } from '@angular/common';
+import { MatIcon } from "@angular/material/icon";
 
 @Component({
   selector: 'app-search',
   standalone: true,
-  imports: [PageLayoutComponent, TileComponent, RouterLink, SearchBarComponent, FormsModule, DatePipe],
+  imports: [PageLayoutComponent, TileComponent, RouterLink, SearchBarComponent, FormsModule, DatePipe, MatIcon],
   templateUrl: './search.component.html',
   styleUrl: './search.component.scss',
 })