all-habits.component.html

<!--...Code Omitted...-->  
<div *ngFor="let habit of habits; let i = index">
    <mat-card>
      <mat-card-title>
        <mat-icon
          class="habit-icon"
          color="accent"
          aria-hidden="false"
          aria-label="circle check mark icon"
          >check_circle_outline</mat-icon
        >
        {{ habit.name }}
      </mat-card-title>
      <div class="detail-options">
        <mat-icon
          class="habit-icon"
          color="primary"
          (click)="onEdit(habit)"
          >edit</mat-icon
        >
        <mat-icon class="habit-icon" color="warn" (click)="onDelete(i)"
          >remove_circle</mat-icon
        >
      </div>
<!--...Code Omitted...-->