From 84ed8805333940aeb023b25705b0f86979cdf8fc Mon Sep 17 00:00:00 2001
From: thepaperpilot <thepaperpilot@gmail.com>
Date: Mon, 28 Mar 2022 21:23:49 -0500
Subject: [PATCH] Made overlay nav not overlap leftmost layer

---
 src/components/Game.vue | 12 ++++++++----
 src/components/Nav.vue  |  4 ++--
 2 files changed, 10 insertions(+), 6 deletions(-)

diff --git a/src/components/Game.vue b/src/components/Game.vue
index 33067af..ca992ad 100644
--- a/src/components/Game.vue
+++ b/src/components/Game.vue
@@ -1,5 +1,5 @@
 <template>
-    <div class="tabs-container">
+    <div class="tabs-container" :class="{ useHeader }">
         <div v-for="(tab, index) in tabs" :key="index" class="tab" :ref="`tab-${index}`">
             <Nav v-if="index === 0 && !useHeader" />
             <div class="inner-tab">
@@ -29,9 +29,8 @@ const layerKeys = computed(() => Object.keys(layers));
 const useHeader = projInfo.useHeader;
 
 function gatherLayerProps(layer: GenericLayer) {
-    const { display, minimized, minWidth, name, color, style, classes, links, minimizable, nodes } =
-        layer;
-    return { display, minimized, minWidth, name, color, style, classes, links, minimizable, nodes };
+    const { display, minimized, minWidth, name, color, style, classes, minimizable, nodes } = layer;
+    return { display, minimized, minWidth, name, color, style, classes, minimizable, nodes };
 }
 </script>
 
@@ -44,6 +43,11 @@ function gatherLayerProps(layer: GenericLayer) {
     display: flex;
 }
 
+.tabs-container:not(.useHeader) {
+    width: calc(100vw - 50px);
+    margin-left: 50px;
+}
+
 .tab {
     position: relative;
     height: 100%;
diff --git a/src/components/Nav.vue b/src/components/Nav.vue
index b3678d4..05ae72a 100644
--- a/src/components/Nav.vue
+++ b/src/components/Nav.vue
@@ -147,12 +147,12 @@ function openDiscord() {
 }
 
 .overlay-nav {
-    position: absolute;
+    position: fixed;
     top: 10px;
     left: 10px;
     display: flex;
     flex-direction: column;
-    z-index: 1;
+    z-index: 2;
 }
 
 .overlay-nav > * {