61 lines
1.5 KiB
Vue
61 lines
1.5 KiB
Vue
<template>
|
|
<div class="dashboard container mx-auto px-6 py-6">
|
|
<Title title="Zeppelin - Dashboard" />
|
|
|
|
<nav class="flex items-stretch pl-4 pr-2 py-1 border border-gray-700 rounded bg-gray-800 shadow-xl mb-8">
|
|
<div class="flex-initial flex items-center">
|
|
<img class="flex-auto w-10 mr-5" src="../../img/logo.png" alt="" aria-hidden="true">
|
|
|
|
<router-link to="/dashboard">
|
|
<h1 class="flex-auto font-semibold">Zeppelin Dashboard</h1>
|
|
</router-link>
|
|
|
|
<ul class="dashboard-nav list-none flex ml-8">
|
|
<router-link class="flex-auto mr-4" to="/dashboard">Guilds</router-link>
|
|
<a href="javascript:void(0)" class="navbar-item hover:text-red-400" v-on:click="logout()">Log out</a>
|
|
</ul>
|
|
</div>
|
|
|
|
<div class="flex-1 flex items-center justify-end">
|
|
<router-link
|
|
to="/docs"
|
|
role="menuitem"
|
|
class="py-1 px-2 rounded hover:bg-gray-700">
|
|
Go to documentation
|
|
</router-link>
|
|
</div>
|
|
</nav>
|
|
|
|
<div class="main-content">
|
|
<router-view></router-view>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<style scoped>
|
|
.dashboard-nav a {
|
|
&:hover {
|
|
@apply underline;
|
|
}
|
|
}
|
|
|
|
.dashboard-nav .router-link-exact-active {
|
|
@apply underline;
|
|
}
|
|
</style>
|
|
|
|
<script>
|
|
import Title from "../Title.vue";
|
|
|
|
export default {
|
|
components: {
|
|
Title,
|
|
},
|
|
methods: {
|
|
async logout() {
|
|
await this.$store.dispatch("auth/logout");
|
|
window.location.pathname = '/';
|
|
}
|
|
},
|
|
};
|
|
</script>
|