aboutsummaryrefslogtreecommitdiff
path: root/Timeline/ClientApp/src/app/todo-list-page/todo-list-page.component.html
blob: 0dcc8a94c57e87e0b24caef84e234a5caa150988 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
<mat-progress-bar *ngIf="!items" mode="indeterminate"></mat-progress-bar>

<mat-list>
  <mat-list-item *ngFor="let item of items; let i = index" style="height:unset;">
    <div class="item-box" [class.first-item-box]="i === 0">
      <mat-card class="mat-elevation-z2 item-card" [style.background]="item.closed ? 'mediumspringgreen' : 'tomato'"
        [class.align-self-bottom]="i === 0">
        <img class="item-img" width="18" height="18" [src]="item.iconUrl">
        <a class="mat-h3 item-title" [href]="item.detailUrl">{{item.id}} {{item.title}}</a>
      </mat-card>
      <div class="sample-box" *ngIf="i === 0">
        <div class="mat-caption sample-container">
          <span class="sample-color-block sample-color-block-open"></span> means working now.
        </div>
        <div class="mat-caption sample-container">
          <span class="sample-color-block sample-color-block-closed"></span> means completed.
        </div>
        <div class="mat-caption">click on item to see details.</div>
      </div>
    </div>
  </mat-list-item>
</mat-list>