From acfd8432dc94179de28d8d891dc09cac3e11dde1 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Tom=C3=A1=C5=A1=20Ml=C3=A1dek?= <t@mldk.cz>
Date: Mon, 2 Jan 2023 00:46:01 +0100
Subject: [PATCH] chore(ui): footer is hidden by default

---
 webui/src/components/layout/Footer.svelte | 23 +++++++++++++++++++----
 1 file changed, 19 insertions(+), 4 deletions(-)

diff --git a/webui/src/components/layout/Footer.svelte b/webui/src/components/layout/Footer.svelte
index 1dcff6d..aa71195 100644
--- a/webui/src/components/layout/Footer.svelte
+++ b/webui/src/components/layout/Footer.svelte
@@ -10,19 +10,27 @@
   let rootEl: HTMLElement;
   let contentEl: HTMLElement;
   let contentHeight = 0;
-  let hidden = false;
+  let hidden = true;
 
   let activeJobs: number;
 
   onMount(() => {
-    const observer = new ResizeObserver((entries) => {
+    const rootObserver = new ResizeObserver((entries) => {
       // should be only one
       entries.forEach((entry) => {
-        contentHeight = contentEl?.getBoundingClientRect()?.height;
         dispatch("resize", entry.contentRect.height);
       });
     });
-    observer.observe(rootEl);
+    rootObserver.observe(rootEl);
+
+    const contentObserver = new ResizeObserver((entries) => {
+      entries.forEach((entry) => {
+        contentHeight = entry.contentRect.height;
+      });
+    });
+    contentObserver.observe(contentEl);
+
+    rootEl.style.top = `${rootEl.getBoundingClientRect().top}px`;
   });
 
   function toggleHidden() {
@@ -91,6 +99,9 @@
     align-items: center;
     height: 2em;
     padding: 0.2em;
+    position: absolute;
+    top: 0;
+    width: 100%;
 
     .info {
       flex-grow: 1;
@@ -98,6 +109,10 @@
     }
   }
 
+  .content {
+    margin-top: 2em;
+  }
+
   :global(#footer .content > *) {
     margin: 0.5rem;
   }