chore(ui): footer is hidden by default

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;
   }