From aaafdb323fddfa4654117b84b371ba49de3dd433 Mon Sep 17 00:00:00 2001
From: crupest <crupest@outlook.com>
Date: Sat, 23 Feb 2019 23:55:04 +0800
Subject: Add icon of todo list and redesign the page.

---
 Timeline/ClientApp/src/app/todo-item/todo-item.component.html | 11 +++++++++++
 1 file changed, 11 insertions(+)
 create mode 100644 Timeline/ClientApp/src/app/todo-item/todo-item.component.html

(limited to 'Timeline/ClientApp/src/app/todo-item/todo-item.component.html')

diff --git a/Timeline/ClientApp/src/app/todo-item/todo-item.component.html b/Timeline/ClientApp/src/app/todo-item/todo-item.component.html
new file mode 100644
index 00000000..624586cb
--- /dev/null
+++ b/Timeline/ClientApp/src/app/todo-item/todo-item.component.html
@@ -0,0 +1,11 @@
+<mat-card class="mat-elevation-z2 item-card">
+  <span class="item-color-block" [class.color-block-closed]="item.closed" [class.color-block-open]="!item.closed"></span>
+  <!-- Do not move the margin style to class because there is some preset classes on mat-card children making it invalid. -->
+  <div class="mat-h3 item-body-box" style="margin: 5px;">
+    <img class="item-icon" [src]="item.iconUrl" />
+    <span class="item-title">{{ item.id }}. {{ item.title }}</span>
+    <a mat-icon-button class="item-detail-button" [href]="item.detailUrl">
+      <mat-icon>arrow_forward</mat-icon>
+    </a>
+  </div>
+</mat-card>
-- 
cgit v1.2.3