From fbbe8660d7d4fb9e5363e80b959302b41a013d1b Mon Sep 17 00:00:00 2001
From: crupest <crupest@outlook.com>
Date: Wed, 10 Jun 2020 15:31:51 +0800
Subject: feat(front): Fix #92 .

---
 Timeline/ClientApp/src/index.sass                          |  8 ++++++++
 Timeline/ClientApp/src/timeline/TimelinePageTemplateUI.tsx | 12 ++++++++++--
 2 files changed, 18 insertions(+), 2 deletions(-)

diff --git a/Timeline/ClientApp/src/index.sass b/Timeline/ClientApp/src/index.sass
index a9329a34..4ba38aa1 100644
--- a/Timeline/ClientApp/src/index.sass
+++ b/Timeline/ClientApp/src/index.sass
@@ -73,3 +73,11 @@ textarea
   @extend .border-primary
   @extend .rounded
   @extend .bg-light
+
+.full-viewport-center-child
+  position: fixed
+  width: 100vw
+  height: 100vh
+  display: flex
+  justify-content: center
+  align-items: center
diff --git a/Timeline/ClientApp/src/timeline/TimelinePageTemplateUI.tsx b/Timeline/ClientApp/src/timeline/TimelinePageTemplateUI.tsx
index a246c0ce..bf87b706 100644
--- a/Timeline/ClientApp/src/timeline/TimelinePageTemplateUI.tsx
+++ b/Timeline/ClientApp/src/timeline/TimelinePageTemplateUI.tsx
@@ -151,7 +151,11 @@ export default function TimelinePageTemplateUI<
           }
         }
       } else {
-        timelineBody = <Spinner />;
+        timelineBody = (
+          <div className="full-viewport-center-child">
+            <Spinner color="primary" type="grow" />
+          </div>
+        );
       }
       const { CardComponent } = props;
 
@@ -185,7 +189,11 @@ export default function TimelinePageTemplateUI<
         </>
       );
     } else {
-      body = <Spinner />;
+      body = (
+        <div className="full-viewport-center-child">
+          <Spinner color="primary" type="grow" />
+        </div>
+      );
     }
   }
 
-- 
cgit v1.2.3