From 5716cb1e486bcac81a14ba7d92ff47760028cb7b Mon Sep 17 00:00:00 2001
From: James Lyne <jim+github@not-null.co.uk>
Date: Tue, 18 May 2021 17:14:16 +0100
Subject: [PATCH] Inline more css to prevent splash screen jumping

---
 index.html          | 39 ++++++++++++++++++++++++++++++
 src/scss/style.scss | 58 ---------------------------------------------
 2 files changed, 39 insertions(+), 58 deletions(-)

diff --git a/index.html b/index.html
index a48af6a..9cb2796 100644
--- a/index.html
+++ b/index.html
@@ -124,12 +124,51 @@
             }
         }
 
+        * {
+            scrollbar-width: thin;
+            scrollbar-color: var(--background-hover) transparent;
+        }
+
+        *::-webkit-scrollbar {
+          width: 1.2rem;
+        }
+
+        *::-webkit-scrollbar-track {
+          background: transparent;
+        }
+
+        *::-webkit-scrollbar-thumb {
+            background-color: var(--background-light);
+            border-radius: 2rem;
+            transition: background 1s ease-in;
+        }
+
+        *:hover::-webkit-scrollbar-thumb {
+          background-color: var(--background-hover);
+        }
+
+        *::-webkit-scrollbar-button {
+            display: none;
+        }
+
         html, body {
             background-color: var(--background-dark);
             height: 100%;
             width: 100%;
             margin: 0;
             padding: 0;
+	        overscroll-behavior: none;
+        }
+
+        html {
+            font-size: 62.5%;
+        }
+
+        body {
+            font-family: Raleway, sans-serif;
+            color: var(--text-base);
+            text-shadow: 0.1rem 0.1rem #000000;
+            letter-spacing: 0.02rem;
         }
 
         noscript {
diff --git a/src/scss/style.scss b/src/scss/style.scss
index 40020d7..01a6f01 100644
--- a/src/scss/style.scss
+++ b/src/scss/style.scss
@@ -30,16 +30,6 @@
 	}
 }
 
-@keyframes fade {
-	0% {
-		opacity: 0;
-	}
-
-	100% {
-		opacity: 1;
-	}
-}
-
 @font-face {
 	font-family: 'Raleway';
 	font-style: normal;
@@ -49,50 +39,6 @@
 	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
 }
 
-* {
-    scrollbar-width: thin;
-    scrollbar-color: var(--background-hover) transparent;
-}
-
-*::-webkit-scrollbar {
-  width: 1.2rem;
-}
-
-*::-webkit-scrollbar-track {
-  background: transparent;
-}
-
-*::-webkit-scrollbar-thumb {
-	background-color: var(--background-light);
-	border-radius: 2rem;
-	transition: background 1s ease-in;
-}
-
-*:hover::-webkit-scrollbar-thumb {
-  background-color: var(--background-hover);
-}
-
-*::-webkit-scrollbar-button {
-    display: none;
-}
-
-html {
-	font-size: 62.5%;
-}
-
-body {
-	font-family: Raleway, sans-serif;
-	color: var(--text-base);
-	text-shadow: 0.1rem 0.1rem #000000;
-	letter-spacing: 0.02rem;
-}
-
-html, body {
-    background-color: var(--background-dark);
-    height: 100%;
-	overscroll-behavior: none;
-}
-
 h1, h2, h3, h4, h5, h6 {
 	font-weight: normal;
 	margin-top: 0;
@@ -193,10 +139,6 @@ input {
 	}
 }
 
-#app {
-    height: 100%;
-}
-
 #app .map .tile img, img {
     image-rendering: pixelated;
 }