<div class="list-group">
    <div class="list-group-item list-group-item-action flex-column align-items-start" 
        data-toggle="tooltip" data-placement="top" title="Click to mark as done"
        *ngFor="let thingToDo of thingsToDo">
        <div (click)="click(thingToDo)" class="d-flex w-100 justify-content-between">
            <h5 class="mb-1">{{thingToDo.name}}</h5>
            <small>{{thingToDo.created | date}}</small>
        </div>
    </div>
</div>
<div class="list-group">
    <div class="list-group-item list-group-item-action flex-column align-items-start" [style.background-color]="thingToDo.isDone ? 'green' : 'none'" 
        data-toggle="tooltip" data-placement="top" title="Click to mark as done"
        *ngFor="let thingToDo of thingsToDo">
        <div (click)="click(thingToDo)" class="d-flex w-100 justify-content-between">
            <h5 class="mb-1">{{thingToDo.name}}</h5>
            <small>{{thingToDo.created | date}}</small>
        </div>
    </div>
</div>
Add style for done items
Add style for done items
