all-habits.component.html

<div class="all-habits">
	<h1>All Habits</h1>
	<button mat-raised-button color="accent" (click)="onAdd()">
      Add New Habit
  </button>
  <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"
          >edit</mat-icon
        >
        
<!--...Code Omitted...-->