diff options
Diffstat (limited to 'src/components/user_card')
| -rw-r--r-- | src/components/user_card/user_card.vue | 75 |
1 files changed, 34 insertions, 41 deletions
diff --git a/src/components/user_card/user_card.vue b/src/components/user_card/user_card.vue index eedb67b5..2f2f9e5f 100644 --- a/src/components/user_card/user_card.vue +++ b/src/components/user_card/user_card.vue @@ -47,7 +47,7 @@ </div> <div v-if="loggedIn && isOtherUser" class="user-interactions"> <div> - <button @click="unfollowUser" class="pressed" :disabled="followRequestInProgress" :title="$t('user_card.follow_unfollow')" v-if="user.following"> + <button @click="unfollowUser" class="btn btn-default pressed" :disabled="followRequestInProgress" :title="$t('user_card.follow_unfollow')" v-if="user.following"> <template v-if="followRequestInProgress"> {{ $t('user_card.follow_progress') }} </template> @@ -55,7 +55,7 @@ {{ $t('user_card.following') }} </template> </button> - <button @click="followUser" :disabled="followRequestInProgress" :title="followRequestSent ? $t('user_card.follow_again') : ''" v-else> + <button @click="followUser" class="btn btn-default" :disabled="followRequestInProgress" :title="followRequestSent ? $t('user_card.follow_again') : ''" v-else> <template v-if="followRequestInProgress"> {{ $t('user_card.follow_progress') }} </template> @@ -67,45 +67,40 @@ </template> </button> </div> + <div> - <ProgressButton :click="subscribeUser" v-if="!user.subscribed"> + <ProgressButton class="btn btn-default" :click="subscribeUser" v-if="!user.subscribed"> {{ $t('user_card.subscribe') }} </ProgressButton> - <ProgressButton class="pressed" :click="unsubscribeUser" v-else> + <ProgressButton class="btn btn-default pressed" :click="unsubscribeUser" v-else> {{ $t('user_card.subscribed') }} </ProgressButton> </div> + <div> - <span v-if='user.muted'> - <button @click="unmuteUser" class="pressed"> - {{ $t('user_card.muted') }} - </button> - </span> - <span v-if='!user.muted'> - <button @click="muteUser"> - {{ $t('user_card.mute') }} - </button> - </span> + <button @click="unmuteUser" class="btn btn-default pressed" v-if="user.muted"> + {{ $t('user_card.muted') }} + </button> + <button @click="muteUser" class="btn btn-default" v-else> + {{ $t('user_card.mute') }} + </button> </div> + <div> - <span v-if='user.statusnet_blocking'> - <button @click="unblockUser" class="pressed"> - {{ $t('user_card.blocked') }} - </button> - </span> - <span v-if='!user.statusnet_blocking'> - <button @click="blockUser"> - {{ $t('user_card.block') }} - </button> - </span> + <button @click="unblockUser" class="btn btn-default pressed" v-if="user.statusnet_blocking"> + {{ $t('user_card.blocked') }} + </button> + <button @click="blockUser" class="btn btn-default" v-else> + {{ $t('user_card.block') }} + </button> </div> - <div class='block'> - <span> - <button @click="reportUser"> - {{ $t('user_card.report') }} - </button> - </span> + + <div> + <button @click="reportUser"> + {{ $t('user_card.report') }} + </button> </div> + <ModerationTools :user='user' v-if='loggedIn.role === "admin"' /> </div> <div class="user-interactions" v-if="!loggedIn && user.is_local"> @@ -366,25 +361,23 @@ justify-content: space-between; margin-right: -.75em; - > div { + > * { flex: 1 0 0; - margin-right: .75em; - margin-bottom: .6em; + margin: 0 .75em .6em 0; white-space: nowrap; - } - button { - width: 100%; - height: 100%; - margin: 0; + > button { + margin: 0; + width: 100%; + } } .remote-button { - height: 28px !important; - width: 92%; + height: 28px; + margin: 0; } - .pressed { + button.pressed { border-bottom-color: rgba(255, 255, 255, 0.2); border-top-color: rgba(0, 0, 0, 0.2); } |