forked from profectus/Profectus
Made overlay nav not overlap leftmost layer
This commit is contained in:
parent
35b464b70e
commit
84ed880533
2 changed files with 10 additions and 6 deletions
|
@ -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%;
|
||||||
|
|
|
@ -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 > * {
|
||||||
|
|
Loading…
Reference in a new issue