Added Preloader

Author: intisor

Views/Shared/_Layout.cshtml

@@ -32,6 +32,16 @@
         </nav>
     </header>
     <div class="container">
+<div id="preloader">
+    <img src="~/preloader.gif" alt="Loading..." />
+</div>
+<script>
+    window.addEventListener('load', function() {
+        setTimeout(function() {
+            document.getElementById('preloader').style.display = 'none';
+        }, 5000);
+    });
+</script>
         <main role="main" class="pb-3">
             @RenderBody()
         </main>

Views/Shared/_Layout.cshtml.css

@@ -46,3 +46,20 @@ button.accept-policy {
   white-space: nowrap;
   line-height: 60px;
 }
+#preloader {
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  background-color: #fff;
+  z-index: 9999;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+
+#preloader img {
+  width: 100px;
+  height: 100px;
+}

wwwroot/css/site.css

@@ -19,4 +19,21 @@ html {
 
 body {
   margin-bottom: 60px;
+}
+#preloader {
+    position: fixed;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    background-color: #fff;
+    z-index: 9999;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+}
+
+#preloader img {
+    width: 100px;
+    height: 100px;
 }