Make admin panel slightly nicer
This commit is contained in:
parent
f9d9031c33
commit
4d9f220644
@ -1,3 +1,15 @@
|
||||
<template>
|
||||
<admin-page-header></admin-page-header>
|
||||
|
||||
<router-view></router-view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import AdminPageHeader from "../components/AdminPageHeader.vue";
|
||||
|
||||
export default {
|
||||
components: {
|
||||
AdminPageHeader,
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
29
resources/js/components/AdminPageHeader.vue
Normal file
29
resources/js/components/AdminPageHeader.vue
Normal file
@ -0,0 +1,29 @@
|
||||
<template>
|
||||
<div class="header">
|
||||
<div class="container">
|
||||
<header>
|
||||
<router-link class="brand" :to="{ name: 'index' }">
|
||||
<img
|
||||
class="brand-logo"
|
||||
src="//via.placeholder.com/256"
|
||||
alt="Brand Logo"
|
||||
/>
|
||||
<span class="brand-name">Admin Panel</span>
|
||||
</router-link>
|
||||
<nav class="site-nav">
|
||||
<admin-site-nav></admin-site-nav>
|
||||
</nav>
|
||||
</header>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import AdminSiteNav from './AdminSiteNav.vue';
|
||||
|
||||
export default {
|
||||
components: {
|
||||
AdminSiteNav,
|
||||
},
|
||||
}
|
||||
</script>
|
||||
10
resources/js/components/AdminSiteNav.vue
Normal file
10
resources/js/components/AdminSiteNav.vue
Normal file
@ -0,0 +1,10 @@
|
||||
<template>
|
||||
<ul class="nav-items">
|
||||
<li class="nav-item">
|
||||
<router-link :to="{ name: 'blog' }">Blog</router-link>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="/">Leave Admin</a>
|
||||
</li>
|
||||
</ul>
|
||||
</template>
|
||||
@ -1,3 +1,19 @@
|
||||
<template>
|
||||
<h1>Admin Home</h1>
|
||||
<container>
|
||||
<h2>Blog</h2>
|
||||
<ul>
|
||||
<li><router-link :to="{ name: 'blog' }">View blog articles</router-link></li>
|
||||
<li><router-link :to="{ name: 'blog-article-create' }">Create blog post</router-link></li>
|
||||
</ul>
|
||||
</container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Container from "../components/Container.vue"
|
||||
|
||||
export default {
|
||||
components: {
|
||||
Container,
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user