dan/Nertivia-Client
1
0
Fork 0
mirror of https://github.com/danbulant/Nertivia-Client synced 2026-06-24 17:11:43 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

moved nav bar to the bottom

Browse source
This commit is contained in:
supertiger1234 2020-02-21 10:53:10 +00:00
parent bb9a2c83e6
commit 19da0e96f7
4 changed files with 21 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
src/components/app/MainNav.vue
View file

@ -265,7 +265,7 @@ export default {
position: relative; position: relative;
} }
.mobile { .mobile {
background: #005a9e; background: rgba(0, 0, 0, 0.4);
padding-left: 10px; padding-left: 10px;
width: initial; width: initial;
.item { .item {
@ -275,6 +275,9 @@ export default {
margin-right: 5px; margin-right: 5px;
font-size: 25px; font-size: 25px;
} }
.tool-tip {
top: -29px;
}
} }
.container { .container {
display: flex; display: flex;

17
src/components/app/Navigation.vue
View file

@ -1,5 +1,5 @@
<template> <template>
<div class="navigation" ref="navigation"> <div class="navigation" :class="{ mobile: mobileSize }" ref="navigation">
<div <div
class="tool-tip" class="tool-tip"
ref="toolTip" ref="toolTip"
@ -132,7 +132,11 @@ export default {
if (this.drag) return; if (this.drag) return;
this.toolTipLocalName = null; this.toolTipLocalName = null;
this.toolTipServerID = serverID; 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; this.toolTipShown = true;
}, },
mouseLeaveEvent() { mouseLeaveEvent() {
@ -163,6 +167,14 @@ export default {
} }
}, },
computed: { computed: {
mobileSize() {
return (
this.$mq === "mobile" &&
(this.currentTab === 0 ||
this.currentTab === 1 ||
this.currentTab === 2)
);
},
user() { user() {
return this.$store.getters.user; return this.$store.getters.user;
}, },
@ -195,7 +207,6 @@ export default {
selectedServerID() { selectedServerID() {
return this.$store.getters["servers/selectedServerID"]; return this.$store.getters["servers/selectedServerID"];
} }
}, },
mounted() { mounted() {
bus.$on("server-tool-tip", this.serverToolTipEvent); bus.$on("server-tool-tip", this.serverToolTipEvent);

2
src/components/app/Tabs/Explore.vue
View file

@ -6,7 +6,6 @@
v-show="($mq === 'mobile' && showLeftPanel) || $mq !== 'mobile'" v-show="($mq === 'mobile' && showLeftPanel) || $mq !== 'mobile'"
v-click-outside="hideLeftPanel" v-click-outside="hideLeftPanel"
> >
<MainNav v-if="$mq === 'mobile'" />
<div class="inner"> <div class="inner">
<navigation /> <navigation />
<div class="content"> <div class="content">
@ -62,6 +61,7 @@
</div> </div>
</div> </div>
</div> </div>
<MainNav v-if="$mq === 'mobile'" />
</div> </div>
</transition> </transition>

4
src/components/app/Tabs/ServerAndDMTab.vue
View file

@ -9,7 +9,7 @@
v-show="($mq === 'mobile' && showLeftPanel) || $mq !== 'mobile'" v-show="($mq === 'mobile' && showLeftPanel) || $mq !== 'mobile'"
v-click-outside="hideLeftPanel" v-click-outside="hideLeftPanel"
> >
<MainNav v-if="$mq === 'mobile'" />
<div class="inner"> <div class="inner">
<navigation /> <navigation />
<div class="wrapper"> <div class="wrapper">
@ -20,6 +20,7 @@
</transition> </transition>
</div> </div>
</div> </div>
<MainNav v-if="$mq === 'mobile'" />
</div> </div>
</transition> </transition>
<message-panel :type="currentTab === 1 ? 0 : currentTab === 2 ? 1 : null" /> <message-panel :type="currentTab === 1 ? 0 : currentTab === 2 ? 1 : null" />
@ -119,7 +120,6 @@ export default {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
z-index: 1; z-index: 1;
overflow: hidden;
} }
.inner { .inner {
z-index: 2; z-index: 2;