Entire area around user counters are clickable now, not just the header-link
This commit is contained in:
parent
61fd0b65d9
commit
15a7151ade
|
@ -61,8 +61,10 @@ export default {
|
||||||
store.state.api.backendInteractor.setUserMute(this.user)
|
store.state.api.backendInteractor.setUserMute(this.user)
|
||||||
},
|
},
|
||||||
setProfileView (v) {
|
setProfileView (v) {
|
||||||
|
if (this.switcher) {
|
||||||
const store = this.$store
|
const store = this.$store
|
||||||
store.commit('setProfileView', { v })
|
store.commit('setProfileView', { v })
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
|
@ -74,20 +74,17 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="panel-body profile-panel-body">
|
<div class="panel-body profile-panel-body">
|
||||||
<div class="user-counts">
|
<div class="user-counts" :class="{clickable: switcher}">
|
||||||
<div class="user-count" :class="{selected: selected === 'statuses'}">
|
<div class="user-count" v-on:click.prevent="setProfileView('statuses')" :class="{selected: selected === 'statuses'}">
|
||||||
<a href="#" v-on:click.prevent="setProfileView('statuses')" v-if="switcher"><h5>{{ $t('user_card.statuses') }}</h5></a>
|
<h5>{{ $t('user_card.statuses') }}</h5>
|
||||||
<h5 v-else>{{ $t('user_card.statuses') }}</h5>
|
|
||||||
<span>{{user.statuses_count}} <br></span>
|
<span>{{user.statuses_count}} <br></span>
|
||||||
</div>
|
</div>
|
||||||
<div class="user-count" :class="{selected: selected === 'friends'}">
|
<div class="user-count" v-on:click.prevent="setProfileView('friends')" :class="{selected: selected === 'friends'}">
|
||||||
<a href="#" v-on:click.prevent="setProfileView('friends')" v-if="switcher"><h5>{{ $t('user_card.followees') }}</h5></a>
|
<h5>{{ $t('user_card.followees') }}</h5>
|
||||||
<h5 v-else>{{ $t('user_card.followees') }}</h5>
|
|
||||||
<span>{{user.friends_count}}</span>
|
<span>{{user.friends_count}}</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="user-count" :class="{selected: selected === 'followers'}">
|
<div class="user-count" v-on:click.prevent="setProfileView('followers')" :class="{selected: selected === 'followers'}">
|
||||||
<a href="#" v-on:click.prevent="setProfileView('followers')" v-if="switcher"><h5>{{ $t('user_card.followers') }}</h5></a>
|
<h5>{{ $t('user_card.followers') }}</h5>
|
||||||
<h5 v-else>{{ $t('user_card.followers') }}</h5>
|
|
||||||
<span>{{user.followers_count}}</span>
|
<span>{{user.followers_count}}</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -239,6 +236,16 @@
|
||||||
text-align: center;
|
text-align: center;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
text-shadow: $usercard-text-shadow;
|
text-shadow: $usercard-text-shadow;
|
||||||
|
|
||||||
|
&.clickable {
|
||||||
|
.user-count {
|
||||||
|
cursor: pointer;
|
||||||
|
|
||||||
|
&:hover:not(.selected) {
|
||||||
|
background-color: rgba(0,0,0,.1);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.user-count {
|
.user-count {
|
||||||
|
|
Loading…
Reference in New Issue