From ee7b5849078a51a907c07e0051127e88ff4362d4 Mon Sep 17 00:00:00 2001
From: Pieter Vander Vennet <pietervdvn@posteo.net>
Date: Thu, 21 Mar 2024 22:39:36 +0100
Subject: [PATCH] Tweak loading screen layout

---
 scripts/generateLayouts.ts  |  2 +-
 src/index.ts                |  3 +++
 src/index_theme.ts.template |  3 +++
 theme.html                  | 23 +++++++++++++----------
 4 files changed, 20 insertions(+), 11 deletions(-)

diff --git a/scripts/generateLayouts.ts b/scripts/generateLayouts.ts
index 2e62f7be3..832ec03d3 100644
--- a/scripts/generateLayouts.ts
+++ b/scripts/generateLayouts.ts
@@ -534,7 +534,7 @@ class GenerateLayouts extends Script {
             )
             .replace(
                 /<!-- IMAGE-START -->.*<!-- IMAGE-END -->/s,
-                "<img class='p-0 mb-8 h-32 w-32 self-start' src='" + icon + "' />"
+                "<img class='p-0 h-32 w-32 self-start' src='" + icon + "' />"
             )
             .replace(
                 /.*\/src\/index\.ts.*/,
diff --git a/src/index.ts b/src/index.ts
index 1eac36b03..9728d5e15 100644
--- a/src/index.ts
+++ b/src/index.ts
@@ -44,6 +44,9 @@ async function main() {
         const state = new ThemeViewState(layout, availableLayers)
         const main = new SvelteUIElement(ThemeViewGUI, { state })
         main.AttachTo("maindiv")
+        Array.from(document.getElementsByClassName("delete-on-load")).forEach(el => {
+            el.parentElement.removeChild(el)
+        })
     } catch (err) {
         console.error("Error while initializing: ", err, err.stack)
         const customDefinition = DetermineLayout.getCustomDefinition()
diff --git a/src/index_theme.ts.template b/src/index_theme.ts.template
index 3ad3b9924..2c415d004 100644
--- a/src/index_theme.ts.template
+++ b/src/index_theme.ts.template
@@ -39,6 +39,9 @@ async function main() {
         const state = new ThemeViewState(new LayoutConfig(<any> layout), availableLayers)
         const main = new SvelteUIElement(ThemeViewGUI, { state })
         main.AttachTo("maindiv")
+        Array.from(document.getElementsByClassName("delete-on-load")).forEach(el => {
+                    el.parentElement.removeChild(el)
+                })
     }
 }
 main()
diff --git a/theme.html b/theme.html
index 6d0d7051b..6fe12ea68 100644
--- a/theme.html
+++ b/theme.html
@@ -68,19 +68,22 @@
                 </p>
             </div>
 
-            <div class="flex justify-between items-end w-full">
-                
-            <!-- IMAGE-START -->
-            <img aria-hidden="true" class="p-4 h-32 w-32 self-start" src="./assets/svg/add.svg">
-            <!-- IMAGE-END -->
-                <div class="h-min subtle flex flex-col items-end"> 
-                Version
-                </div>
-                
-            </div>
+
         </div>
     </div>
 </div>
+
+<div class="flex justify-between items-end w-full absolute bottom-0 p-4 h-fit delete-on-load">
+
+  <!-- IMAGE-START -->
+  <img aria-hidden="true" class="p-4 h-32 w-32 self-start" src="./assets/svg/add.svg">
+  <!-- IMAGE-END -->
+  <div class="h-min subtle flex flex-col items-end">
+    Version
+  </div>
+
+</div>
+
 <div aria-hidden="true" id="belowmap" class="absolute top-0 left-0 -z-10">Below</div>
 <script src="./src/UI/RemoveOtherLanguages.ts" type="module"></script>
 <script async src="./src/InstallServiceWorker.ts" type="module"></script>