From beace34758740e89d935b85ea92c904de8278213 Mon Sep 17 00:00:00 2001
From: Ta180m <ta180m@gmail.com>
Date: Wed, 22 Jan 2020 10:50:01 -0600
Subject: [PATCH] Update city.css

---
 city.css | 81 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 81 insertions(+)

diff --git a/city.css b/city.css
index 59aacbd..5e8b3f3 100644
--- a/city.css
+++ b/city.css
@@ -9,6 +9,7 @@
  * Components
  */
 @import url(//brick.a.ssl.fastly.net/Raleway:200,300/Merriweather:200,200i,700,700i/Lato:400,700);
+@import url("https://fonts.googleapis.com/css?family=VT323:100,200,300,375,400,500,600,700,800,900");
 /**
  * Groups
  */
@@ -1427,3 +1428,83 @@ div.post-tags {
     border-radius: 0;
   }
 }
+
+/*Loading bar*/
+@keyframes loading{
+  0%{
+    width: 0px;
+    top: calc(50vh - 50px);
+    font-family: VT323;
+    content: "Loading...";
+    transition: ease;
+    text-align: center;
+  }
+  75%{
+    width: 300px;
+    top: calc(50vh - 50px);
+    font-family: VT323;
+    content: "Loading...";
+    text-align: center;
+  }
+  75.1%{
+    width: 300px;
+    top: calc(50vh - 50px);
+    font-family: VT323;
+    content: "Done!";
+    text-align: center;
+  }
+  85%{
+    top: calc(50vh - 100px);
+    width: 300px;
+    font-family: VT323;
+    content: "Done!";
+    text-align: center;
+  }
+  100%{
+    top: calc(150vh - 50px);
+    width: 300px;
+    font-family: VT323;
+    content: "Done!";
+    text-align: center;
+  }
+}
+html::before{
+  font-family: VT323;
+  content: "Loading...";
+  height: 100px;
+  position: fixed !important;
+  margin: 0px;
+  padding: 0px;
+  top: calc(150vh - 50px);
+  left: calc(50vw - 150px);
+  background-color: black;
+  color: white !important;
+  line-height: 100px;
+  white-space: nowrap;
+  font-size: 50px !important;
+  z-index: 1000000000 !important;
+  animation: loading 2s ease !important;
+  width: 300px !important;
+  box-shadow: 0px 0px 0px 5px white, 0px 50vw 0px calc(50vw + 50vh - 50px) black, 0px 0px 0px 5px white !important; 
+/*The box shadow that makes the border is put before and after the background shadow, because of order issues (Firefox displays the first one on top, chrome displays the last one on top)*/
+  display: block !important;
+}
+html::after{
+  font-family: VT323;
+  content: "Loading... please wait";
+  height: 100px;
+  width: 0px;
+  position: fixed !important;
+  margin: 0px;
+  padding: 0px;
+  top: calc(150vh - 50px);
+  left: calc(50vw - 150px);
+  background-color: white;
+  color: black !important;
+  line-height: 100px;
+  z-index: 1000000001 !important;
+  white-space: nowrap;
+  font-size: 50px !important;
+  animation: loading 2s ease !important;
+  overflow: hidden !important;
+}