Catalog alignment

Issue-ID: SDC-2724
Signed-off-by: ys9693 <ys9693@att.com>
Change-Id: I52b4aacb58cbd432ca0e1ff7ff1f7dd52099c6fe
diff --git a/catalog-ui/src/assets/preloading.css b/catalog-ui/src/assets/preloading.css
new file mode 100644
index 0000000..1f0c2c6
--- /dev/null
+++ b/catalog-ui/src/assets/preloading.css
@@ -0,0 +1,69 @@
+html {
+    height: 100%;
+}
+body {
+    height: 100%;
+    width: 100%;
+    margin: 0px;
+    padding: 0px;
+    overflow:hidden;
+}
+
+.preloading-page {
+    height: 100%;
+    width: 100%;
+    margin: 0px;
+    overflow:hidden;
+    background-image: linear-gradient(to bottom right, rgba(30, 36, 48, 1), rgba(59, 74, 93, 1));
+    text-align: center;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    flex-direction: column;
+    color: #FFFFFF;
+}
+
+ .project-icon {
+    width: 200px;
+    height: 210px;
+    margin-top: 0%;
+    background-repeat: no-repeat;
+}
+
+.preloading-page-loading {
+    font-size: 24px;
+    line-height: 44px;
+    font-family: Arial,  Helvetica, sans-serif;
+    color: #1EB9F3;
+    margin-top: 10%;
+    margin-left: 3%;
+}
+
+.preloading-page-loading span {
+    font-family: Arial, Helvetica, sans-serif;
+    font-size: 50px;
+    animation-name: blink;
+    animation-duration: 1.5s;
+    animation-iteration-count: infinite;
+    animation-fill-mode: both;
+}
+
+.preloading-page-loading span:nth-child(2) {
+    animation-delay: .5s;
+}
+
+.preloading-page-loading span:nth-child(3) {
+    animation-delay: 1.0s;
+}
+
+@keyframes blink {
+    0% {
+        opacity: .2;
+    }
+    20% {
+        opacity: 1;
+    }
+    100% {
+        opacity: .2;
+    }
+}
\ No newline at end of file