Dialogs and Vuetify styling changes

This commit is contained in:
N-Pex 2025-05-08 11:52:39 +02:00
parent 2ba0d57aa8
commit a97211afdf
45 changed files with 320 additions and 346 deletions

View file

@ -1,10 +1,9 @@
<template>
<v-dialog
v-if="activeMember"
v-model="showDialog"
v-show="room"
class="ma-0 pa-0"
:width="$vuetify.display.smAndUp ? '688px' : '95%'"
v-if="showDialog"
>
<div class="dialog-content text-center member-action-dialog">
<div class="pt-4">
@ -39,7 +38,7 @@
</div>
<DeviceList :member="activeMember" />
<div class="py-3" v-if="activeMember.userId != $matrix.currentUserId">
<v-btn text x-large block v-if="activeMember.userId != $matrix.currentUserId && !$matrix.isDirectRoomWith(room, activeMember.userId)" class="start-private-chat clickable d-block text-none justify-start" @click="startPrivateChat(activeMember.userId)">
<v-btn text size="x-large" block v-if="activeMember.userId != $matrix.currentUserId && !$matrix.isDirectRoomWith(room, activeMember.userId)" class="start-private-chat clickable d-block text-none justify-start" @click="startPrivateChat(activeMember.userId)">
<v-icon left>$vuetify.icons.direct_chat</v-icon> {{ $t("menu.direct_chat") }}
</v-btn>
<div v-if="canBanUserComp">
@ -47,13 +46,13 @@
<v-icon left>$vuetify.icons.kickout</v-icon> {{ $t("menu.user_kick_and_ban") }}
</v-btn>
</div>
<v-btn text x-large block v-if="activeMember.userId != $matrix.currentUserId && !isAdminComp && canMakeAdminComp" class="start-private-chat clickable d-block text-none justify-start" @click="makeAdmin(activeMember)">
<v-btn text size="x-large" block v-if="activeMember.userId != $matrix.currentUserId && !isAdminComp && canMakeAdminComp" class="start-private-chat clickable d-block text-none justify-start" @click="makeAdmin(activeMember)">
<v-icon left>$vuetify.icons.make_admin</v-icon> {{ $t("menu.user_make_admin") }}
</v-btn>
<v-btn text x-large block v-if="activeMember.userId != $matrix.currentUserId && !isModeratorComp && !isAdminComp && canMakeModeratorComp" class="start-private-chat clickable d-block text-none justify-start" @click="makeModerator(activeMember)">
<v-btn text size="x-large" block v-if="activeMember.userId != $matrix.currentUserId && !isModeratorComp && !isAdminComp && canMakeModeratorComp" class="start-private-chat clickable d-block text-none justify-start" @click="makeModerator(activeMember)">
<v-icon left>$vuetify.icons.make_moderator</v-icon> {{ $t("menu.user_make_moderator") }}
</v-btn>
<v-btn text x-large block v-if="activeMember.userId != $matrix.currentUserId && isModeratorComp && canRevokeModeratorComp" class="start-private-chat clickable d-block text-none justify-start" @click="revokeModerator(activeMember)">
<v-btn text size="x-large" block v-if="activeMember.userId != $matrix.currentUserId && isModeratorComp && canRevokeModeratorComp" class="start-private-chat clickable d-block text-none justify-start" @click="revokeModerator(activeMember)">
<v-icon left>$vuetify.icons.revoke</v-icon> {{ $t("menu.user_revoke_moderator") }}
</v-btn>
</div>
@ -73,8 +72,9 @@ export default {
DeviceList,
AuthedImage
},
emits: ['update:modelValue'],
props: {
show: {
modelValue: {
type: Boolean,
default: function () {
return false;
@ -141,14 +141,20 @@ export default {
}
},
watch: {
activeMember() {
this.showDialog = this.show && this.activeMember && this.room;
},
room() {
this.showDialog = this.show && this.activeMember && this.room;
},
show: {
handler(newVal, ignoredOldVal) {
this.showDialog = newVal;
this.showDialog = newVal && this.activeMember && this.room;
}
},
showDialog() {
if (!this.showDialog) {
this.$emit("close");
this.$emit('update:modelValue', false);
}
},
},