merge develop, add mobile nav component

This commit is contained in:
shpuld 2019-03-12 23:50:54 +02:00
commit 7ce8fe9214
67 changed files with 2219 additions and 697 deletions

View file

@ -0,0 +1,35 @@
import SideDrawer from '../side_drawer/side_drawer.vue'
import Notifications from '../notifications/notifications.vue'
import { unseenNotificationsFromStore } from '../../services/notification_utils/notification_utils'
const MobileNav = {
components: {
SideDrawer,
Notifications
},
data: () => ({
notificationsOpen: false
}),
computed: {
unseenNotifications () {
return unseenNotificationsFromStore(this.$store)
},
unseenNotificationsCount () {
return this.unseenNotifications.length
},
sitename () { return this.$store.state.instance.name }
},
methods: {
toggleMobileSidebar () {
this.$refs.sideDrawer.toggleDrawer()
},
toggleMobileNotifications () {
this.notificationsOpen = !this.notificationsOpen
},
scrollToTop () {
window.scrollTo(0, 0)
}
}
}
export default MobileNav

View file

@ -0,0 +1,29 @@
<template>
<nav class='nav-bar container' @click="scrollToTop()" id="nav">
<div class='inner-nav'>
<div class='item'>
<a href="#" class="menu-button" @click.stop.prevent="toggleMobileSidebar()">
<i class="button-icon icon-menu"></i>
</a>
<router-link class="site-name" :to="{ name: 'root' }" active-class="home">{{sitename}}</router-link>
</div>
<div class='item right'>
<a href="#" class="menu-button" @click.stop.prevent="toggleMobileNotifications()">
<i class="button-icon icon-bell-alt"></i>
<div class="alert-dot" v-if="unseenNotificationsCount"></div>
</a>
</div>
</div>
<SideDrawer ref="sideDrawer" :logout="logout"/>
<div class="mobile-notifications" :class="{ 'closed': !notificationsOpen }">
<Notifications/>
</div>
</nav>
</template>
<script src="./mobile_nav.js"></script>
<style lang="scss">
</style>