Improve drawer width and conversation list style.

This commit is contained in:
Rafi
2023-03-08 16:22:22 +08:00
parent 85fc57e2b2
commit a8acfeea58

View File

@@ -99,6 +99,7 @@ onNuxtReady(async () => {
<v-navigation-drawer <v-navigation-drawer
v-model="drawer" v-model="drawer"
:permanent="drawerPermanent" :permanent="drawerPermanent"
width="300"
> >
<div class="px-2 py-2"> <div class="px-2 py-2">
<v-list> <v-list>
@@ -127,6 +128,7 @@ onNuxtReady(async () => {
> >
<v-list-item <v-list-item
active-color="primary" active-color="primary"
rounded="xl"
v-if="editingConversation && editingConversation.id === conversation.id" v-if="editingConversation && editingConversation.id === conversation.id"
> >
<v-text-field <v-text-field
@@ -137,6 +139,7 @@ onNuxtReady(async () => {
hide-details hide-details
density="compact" density="compact"
autofocus autofocus
@keyup.enter="updateConversation(cIdx)"
@click:append="updateConversation(cIdx)" @click:append="updateConversation(cIdx)"
></v-text-field> ></v-text-field>
</v-list-item> </v-list-item>
@@ -145,28 +148,33 @@ onNuxtReady(async () => {
v-slot="{ isHovering, props }" v-slot="{ isHovering, props }"
> >
<v-list-item <v-list-item
rounded="xl"
active-color="primary" active-color="primary"
@click="openConversationMessages(conversation)" @click="openConversationMessages(conversation)"
v-bind="props" v-bind="props"
> >
<v-list-item-title>{{ conversation.topic }}</v-list-item-title> <v-list-item-title>{{ conversation.topic }}</v-list-item-title>
<v-list-item-action v-show="isHovering"> <template v-slot:append>
<v-btn <div
icon="edit" v-show="isHovering"
size="small"
variant="text"
@click="editConversation(cIdx)"
> >
</v-btn> <v-btn
<v-btn icon="edit"
icon="delete" size="small"
size="small" variant="text"
variant="text" @click="editConversation(cIdx)"
:loading="deletingConversationIndex === cIdx" >
@click="deleteConversation(cIdx)" </v-btn>
> <v-btn
</v-btn> icon="delete"
</v-list-item-action> size="small"
variant="text"
:loading="deletingConversationIndex === cIdx"
@click="deleteConversation(cIdx)"
>
</v-btn>
</div>
</template>
</v-list-item> </v-list-item>
</v-hover> </v-hover>
</template> </template>