opendev/storyboard-vue
Code Issues Proposed changes

Restyle the sidebar to actually be a sidebar

Browse Source
This commit is contained in:
Adam Coldrick 2020-04-30 22:52:00 +01:00
parent 420ce78587
commit 4b03086983
1 changed files with 23 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

32
src/components/Sidebar.vue
View File

@ -1,12 +1,12 @@
<template>
<div id="nav">
<router-link to="/">Home</router-link> |
<router-link to="/about">About</router-link> |
<router-link to="/story">Stories</router-link> |
<router-link to="/board">Boards</router-link> |
<router-link to="/worklist">Worklists</router-link> |
<router-link to="/project">Projects</router-link> |
<router-link to="/">Home</router-link>
<router-link to="/about">About</router-link>
<router-link to="/board">Boards</router-link>
<router-link to="/worklist">Worklists</router-link>
<router-link to="/project-group">Project Groups</router-link>
<router-link to="/project">Projects</router-link>
<router-link to="/story">Stories</router-link>
</div>
</template>
@ -19,14 +19,28 @@ export default {
<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped lang="scss">
#nav {
padding: 30px;
padding: 0px;
position: fixed;
top: 60px;
left: 0;
height: calc(100vh - 60px);
background-color: #333;
box-shadow: inset -6px 0 10px rgba(0, 0, 0, 0.5);
a {
font-weight: bold;
color: #2c3e50;
color: #f9f0eb;
display: block;
padding: 20px 20px;
text-decoration: none;
&.router-link-exact-active {
color: #42b983;
color: #f7f6f4;
background-color: #a03427;
}
&:hover {
color: #f7f6f4;
background-color: #7c342b;
}
}
}