mirror of
https://github.com/danbulant/Nertivia-Client
synced 2026-06-15 12:31:15 +00:00
moved nav bar to the bottom
This commit is contained in:
parent
bb9a2c83e6
commit
19da0e96f7
4 changed files with 21 additions and 7 deletions
|
|
@ -265,7 +265,7 @@ export default {
|
|||
position: relative;
|
||||
}
|
||||
.mobile {
|
||||
background: #005a9e;
|
||||
background: rgba(0, 0, 0, 0.4);
|
||||
padding-left: 10px;
|
||||
width: initial;
|
||||
.item {
|
||||
|
|
@ -275,6 +275,9 @@ export default {
|
|||
margin-right: 5px;
|
||||
font-size: 25px;
|
||||
}
|
||||
.tool-tip {
|
||||
top: -29px;
|
||||
}
|
||||
}
|
||||
.container {
|
||||
display: flex;
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<div class="navigation" ref="navigation">
|
||||
<div class="navigation" :class="{ mobile: mobileSize }" ref="navigation">
|
||||
<div
|
||||
class="tool-tip"
|
||||
ref="toolTip"
|
||||
|
|
@ -132,7 +132,11 @@ export default {
|
|||
if (this.drag) return;
|
||||
this.toolTipLocalName = null;
|
||||
this.toolTipServerID = serverID;
|
||||
this.toolTipTopPosition = top - this.getTopHeight() + 20;
|
||||
if (this.mobileSize) {
|
||||
this.toolTipTopPosition = top - this.getTopHeight() + 80;
|
||||
} else {
|
||||
this.toolTipTopPosition = top - this.getTopHeight() + 20;
|
||||
}
|
||||
this.toolTipShown = true;
|
||||
},
|
||||
mouseLeaveEvent() {
|
||||
|
|
@ -163,6 +167,14 @@ export default {
|
|||
}
|
||||
},
|
||||
computed: {
|
||||
mobileSize() {
|
||||
return (
|
||||
this.$mq === "mobile" &&
|
||||
(this.currentTab === 0 ||
|
||||
this.currentTab === 1 ||
|
||||
this.currentTab === 2)
|
||||
);
|
||||
},
|
||||
user() {
|
||||
return this.$store.getters.user;
|
||||
},
|
||||
|
|
@ -195,7 +207,6 @@ export default {
|
|||
selectedServerID() {
|
||||
return this.$store.getters["servers/selectedServerID"];
|
||||
}
|
||||
|
||||
},
|
||||
mounted() {
|
||||
bus.$on("server-tool-tip", this.serverToolTipEvent);
|
||||
|
|
|
|||
|
|
@ -6,7 +6,6 @@
|
|||
v-show="($mq === 'mobile' && showLeftPanel) || $mq !== 'mobile'"
|
||||
v-click-outside="hideLeftPanel"
|
||||
>
|
||||
<MainNav v-if="$mq === 'mobile'" />
|
||||
<div class="inner">
|
||||
<navigation />
|
||||
<div class="content">
|
||||
|
|
@ -62,6 +61,7 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<MainNav v-if="$mq === 'mobile'" />
|
||||
</div>
|
||||
</transition>
|
||||
|
||||
|
|
|
|||
|
|
@ -9,7 +9,7 @@
|
|||
v-show="($mq === 'mobile' && showLeftPanel) || $mq !== 'mobile'"
|
||||
v-click-outside="hideLeftPanel"
|
||||
>
|
||||
<MainNav v-if="$mq === 'mobile'" />
|
||||
|
||||
<div class="inner">
|
||||
<navigation />
|
||||
<div class="wrapper">
|
||||
|
|
@ -20,6 +20,7 @@
|
|||
</transition>
|
||||
</div>
|
||||
</div>
|
||||
<MainNav v-if="$mq === 'mobile'" />
|
||||
</div>
|
||||
</transition>
|
||||
<message-panel :type="currentTab === 1 ? 0 : currentTab === 2 ? 1 : null" />
|
||||
|
|
@ -119,7 +120,6 @@ export default {
|
|||
display: flex;
|
||||
flex-direction: column;
|
||||
z-index: 1;
|
||||
overflow: hidden;
|
||||
}
|
||||
.inner {
|
||||
z-index: 2;
|
||||
|
|
|
|||
Loading…
Reference in a new issue