Navbar remove is-nav menu, add collaps components

This commit is contained in:
ogerly 2021-12-09 14:59:39 +01:00
parent 1813b7b434
commit 82b0a77f3b
2 changed files with 31 additions and 2 deletions

View File

@ -35,8 +35,36 @@
</b-navbar-nav>
</b-collapse>
</div>
<b-navbar-toggle target="nav-collapse"></b-navbar-toggle>
<b-navbar-toggle @click="visible = !visible"></b-navbar-toggle>
</b-navbar>
<b-collapse
id="collapse-4"
v-model="visible"
class="p-3"
style="position: absolute; z-index: 100000; background-color: #dfe0e3f5; width: 100%; box-shadow: cadetblue 0px 13px 22px;"
>
<b-nav vertical @click="visible = false">
<b-nav-item to="/overview" class="mb-3">
{{ $t('overview') }}
</b-nav-item>
<b-nav-item to="/send" class="mb-3">{{ $t('send') }}</b-nav-item>
<b-nav-item to="/transactions" class="mb-3">
{{ $t('transactions') }}
</b-nav-item>
<b-nav-item to="/profile" class="mb-3">
{{ $t('site.navbar.my-profil') }}
</b-nav-item>
<br />
<b-nav-item class="mb-3" @click="$emit('get-elopage-link')">
{{ $t('members_area') }}
<b-badge v-if="!$store.state.hasElopage" pill variant="danger">!</b-badge>
</b-nav-item>
<b-nav-item class="mb-3" v-if="$store.state.isAdmin" @click="$emit('admin')">
{{ $t('admin_area') }}
</b-nav-item>
<b-nav-item class="mb-3" @click="$emit('logout')">{{ $t('logout') }}</b-nav-item>
</b-nav>
</b-collapse>
</div>
</template>
<script>
@ -50,6 +78,7 @@ export default {
},
data() {
return {
visible: false,
logo: 'img/brand/green.png',
}
},

View File

@ -1,7 +1,7 @@
<template>
<div>
<navbar :balance="balance" @get-elopage-link="getElopageLink" @admin="admin" @logout="logout" />
<div style="display: inline-flex; width: 100%">
<div style="display: inline-flex; width: 100%; height: 91%; position: absolute">
<div class="d-none d-sm-none d-md-none d-lg-flex shadow-lg" style="width: 300px">
<sidebar @get-elopage-link="getElopageLink" @admin="admin" @logout="logout" />
</div>