YunoHost/yunohost-admin
1
0
Fork 0
mirror of https://github.com/YunoHost/yunohost-admin.git synced 2024-09-03 20:06:15 +02:00
Code Issues Projects Releases Packages Wiki Activity

add header and footer

Browse source
This commit is contained in:
Axolotle 2020-07-07 18:56:12 +02:00
parent a54061249d
commit 712f22f6d3
1 changed files with 63 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

68
app/src/App.vue
View file

@ -1,14 +1,72 @@
<template> <template>
<div id="app"> <div id="app">
<nav> <header>
<b-nav> <b-navbar>
<b-nav-item to="/" exact exact-active-class="active">Home</b-nav-item> <b-navbar-brand to="/" exact exact-active-class="active"><img alt="Yunohost logo" src="./assets/logo.png"></b-navbar-brand>
</b-nav> <b-navbar-nav class="ml-auto">
</nav> <li class="nav-item">
<b-button href="/yunohost/sso" variant="primary" block size="sm">{{ $t('user_interface_link') }}</b-button>
</li>
<li class="nav-item">
<b-button to="/logout" variant="outline-dark" block size="sm">{{ $t('logout') }}</b-button>
</li>
</b-navbar-nav>
</b-navbar>
</header>
<router-view/> <router-view/>
<footer>
<nav>
<b-nav>
<b-nav-item href="https://yunohost.org/docs" target="_blank" link-classes='text-secondary'>Documentation</b-nav-item>
<b-nav-item href="https://yunohost.org/help" target="_blank" link-classes='text-secondary'>Need help?</b-nav-item>
<b-nav-item href="https://donate.yunohost.org/" target="_blank" link-classes='text-secondary'>Donate</b-nav-item>
<b-nav-text class="ml-auto" id="yunohost-version">version</b-nav-text>
</b-nav>
</nav>
</footer>
</div> </div>
</template> </template>
<style lang="scss"> <style lang="scss">
@import '@/scss/main.scss'; @import '@/scss/main.scss';
header {
border-bottom: 1px solid #eee;
.navbar {
padding: 1rem;
img {
width: 70px;
}
.navbar-nav {
flex-direction: column;
li {
margin: .2rem 0;
}
}
}
}
footer {
padding: 1rem 0;
border-top: 1px solid #eee;
font-size: 0.875rem;
li {
&:not(:first-child) a::before {
content: "•";
width: 1rem;
display: inline-block;
margin-left: -1rem;
}
&:first-child {
margin-left: -1rem;
}
}
}
</style> </style>