moon
/
pleroma-fe
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge branch 'feature/nav-panel-hover-state' into 'develop' 

themeable hover states for nav-panel

See merge request !53
This commit is contained in:
lambadalambda 2017-03-09 03:10:31 -05:00
parent 7a5bed0684 aff432a572
commit 64d71b75cf
1 changed files with 23 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

33
src/components/nav_panel/nav_panel.vue
View File

@ -1,24 +1,24 @@
<template>
<div class="nav-panel">
<div class="panel panel-default base01-background">
<div class="panel panel-default base02-background">
<ul>
<li v-if='currentUser'>
<router-link to='/main/friends'>
<router-link class="base01-background" to='/main/friends'>
Timeline
</router-link>
</li>
<li v-if='currentUser'>
<router-link :to="{ name: 'mentions', params: { username: currentUser.screen_name } }">
<router-link class="base01-background" :to="{ name: 'mentions', params: { username: currentUser.screen_name } }">
Mentions
</router-link>
</li>
<li>
<router-link to='/main/public'>
<router-link class="base01-background" to='/main/public'>
Public Timeline
</router-link>
</li>
<li>
<router-link to='/main/all'>
<router-link class="base01-background" to='/main/all'>
The Whole Known Network
</router-link>
</li>
@ -30,7 +30,6 @@
<script src="./nav_panel.js" ></script>
<style lang="scss">
.nav-panel ul {
list-style: none;
margin: 0;
@ -39,7 +38,15 @@
.nav-panel li {
border-bottom: 1px solid;
padding: 0.8em 0.85em;
padding: 0;
&:first-child a {
border-top-right-radius: 10px;
border-top-left-radius: 10px;
}
&:last-child a {
border-bottom-right-radius: 10px;
border-bottom-left-radius: 10px;
}
}
.nav-panel li:last-child {
@ -48,10 +55,16 @@
.nav-panel a {
display: block;
width: 100%;
padding: 0.8em 0.85em;
&:hover {
background-color: transparent;
}
&.router-link-active {
font-weight: bold
font-weight: bolder;
background-color: transparent;
&:hover {
text-decoration: underline;
}
}
}