Made overlay nav not overlap leftmost layer

This commit is contained in:
thepaperpilot 2022-03-28 21:23:49 -05:00
parent 35b464b70e
commit 84ed880533
2 changed files with 10 additions and 6 deletions

View file

@ -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%;

View file

@ -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 > * {