aboutsummaryrefslogtreecommitdiff
path: root/Timeline/ClientApp/src/app/todo-list-page/todo-list-page.component.html
diff options
context:
space:
mode:
Diffstat (limited to 'Timeline/ClientApp/src/app/todo-list-page/todo-list-page.component.html')
-rw-r--r--Timeline/ClientApp/src/app/todo-list-page/todo-list-page.component.html19
1 files changed, 9 insertions, 10 deletions
diff --git a/Timeline/ClientApp/src/app/todo-list-page/todo-list-page.component.html b/Timeline/ClientApp/src/app/todo-list-page/todo-list-page.component.html
index 0dcc8a94..3b4809ae 100644
--- a/Timeline/ClientApp/src/app/todo-list-page/todo-list-page.component.html
+++ b/Timeline/ClientApp/src/app/todo-list-page/todo-list-page.component.html
@@ -2,18 +2,17 @@
<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="item-box" [class.first-item-box]="i === 0" [class.non-first-item-box]="i !== 0">
+ <app-todo-item [class.align-self-bottom]="i === 0" [item]="item"></app-todo-item>
+ <div class="space"></div>
<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 class="mat-caption sample-item">
+ <span class="sample-color-block color-block-open"></span>
+ <span> means working now.</span>
</div>
- <div class="mat-caption sample-container">
- <span class="sample-color-block sample-color-block-closed"></span> means completed.
+ <div class="mat-caption sample-item">
+ <span class="sample-color-block color-block-closed"></span>
+ <span> means completed.</span>
</div>
<div class="mat-caption">click on item to see details.</div>
</div>