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> <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}`"> <div v-for="(tab, index) in tabs" :key="index" class="tab" :ref="`tab-${index}`">
<Nav v-if="index === 0 && !useHeader" /> <Nav v-if="index === 0 && !useHeader" />
<div class="inner-tab"> <div class="inner-tab">
@ -29,9 +29,8 @@ const layerKeys = computed(() => Object.keys(layers));
const useHeader = projInfo.useHeader; const useHeader = projInfo.useHeader;
function gatherLayerProps(layer: GenericLayer) { function gatherLayerProps(layer: GenericLayer) {
const { display, minimized, minWidth, name, color, style, classes, links, minimizable, nodes } = const { display, minimized, minWidth, name, color, style, classes, minimizable, nodes } = layer;
layer; return { display, minimized, minWidth, name, color, style, classes, minimizable, nodes };
return { display, minimized, minWidth, name, color, style, classes, links, minimizable, nodes };
} }
</script> </script>
@ -44,6 +43,11 @@ function gatherLayerProps(layer: GenericLayer) {
display: flex; display: flex;
} }
.tabs-container:not(.useHeader) {
width: calc(100vw - 50px);
margin-left: 50px;
}
.tab { .tab {
position: relative; position: relative;
height: 100%; height: 100%;

View file

@ -147,12 +147,12 @@ function openDiscord() {
} }
.overlay-nav { .overlay-nav {
position: absolute; position: fixed;
top: 10px; top: 10px;
left: 10px; left: 10px;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
z-index: 1; z-index: 2;
} }
.overlay-nav > * { .overlay-nav > * {