yetangitu/funkwhale
1
0
Fork 0
mirror of https://code.eliotberriot.com/funkwhale/funkwhale.git synced 2025-10-04 21:59:18 +02:00
Code Issues Releases Wiki Activity

Resolve "UX, UI : Browse Library"

Browse source
This commit is contained in:
Eliot Berriot 2018-07-17 11:09:13 +00:00
parent dc5eb1154e
commit 99a37dcb7a
35 changed files with 833 additions and 91 deletions
Download patch file Download diff file Expand all files Collapse all files

14
front/src/components/Sidebar.vue
View file

@ -2,7 +2,7 @@
<div :class="['ui', 'vertical', 'left', 'visible', 'wide', {'collapsed': isCollapsed}, 'sidebar',]">
<div class="ui inverted segment header-wrapper">
<search-bar @search="isCollapsed = false">
<router-link :title="'Funkwhale'" :to="{name: 'index'}">
<router-link :title="'Funkwhale'" :to="{name: logoUrl}">
<i class="logo bordered inverted orange big icon">
<logo class="logo"></logo>
</i>
@ -39,7 +39,7 @@
<translate :translate-params="{username: $store.state.auth.username}">
Logged in as %{ username }
</translate>
<img class="ui avatar right floated circular mini image" v-if="$store.state.auth.profile.avatar.square_crop" :src="$store.getters['instance/absoluteUrl']($store.state.auth.profile.avatar.square_crop)" />
<img class="ui right floated circular tiny avatar image" v-if="$store.state.auth.profile.avatar.square_crop" :src="$store.getters['instance/absoluteUrl']($store.state.auth.profile.avatar.square_crop)" />
</router-link>
<router-link class="item" v-if="$store.state.auth.authenticated" :to="{name: 'logout'}"><i class="sign out icon"></i><translate>Logout</translate></router-link>
<router-link class="item" v-else :to="{name: 'login'}"><i class="sign in icon"></i><translate>Login</translate></router-link>
@ -237,6 +237,13 @@ export default {
set (value) {
this.tracksChangeBuffer = value
}
},
logoUrl () {
if (this.$store.state.auth.authenticated) {
return 'library.index'
} else {
return 'index'
}
}
},
methods: {
@ -433,8 +440,9 @@ $sidebar-color: #3d3e3f;
}
}
}
.avatar {
.ui.tiny.avatar.image {
position: relative;
top: -0.5em;
width: 3em;
}
</style>