butter/keanu-weblite
3
0
Fork 0
Code Issues Pull requests Projects Releases Packages 1 Wiki Activity Actions

Make icons into vue components

Browse source
This commit is contained in:
N-Pex 2025-05-08 13:10:06 +02:00
parent a97211afdf
commit 110394a40a
26 changed files with 209 additions and 91 deletions
Download patch file Download diff file Expand all files Collapse all files

4
src/components/Chat.vue
View file

@ -143,8 +143,8 @@
<div class="col col-auto" v-if="replyToContentType !== 'm.text'">
<img v-if="replyToContentType === 'm.image'" width="50px" height="50px" :src="replyToImg"
class="rounded" />
<v-img v-if="replyToContentType === 'm.audio'" src="@/assets/icons/audio_message.svg" />
<v-img v-if="replyToContentType === 'm.video'" src="@/assets/icons/video_message.svg" />
<v-icon v-if="replyToContentType === 'm.audio'">$vuetify.icons.audio_message</v-icon>
<v-icon v-if="replyToContentType === 'm.video'">$vuetify.icons.video_message</v-icon>
<v-icon v-if="replyToContentType === 'm.poll'" theme="light">$vuetify.icons.poll</v-icon>
</div>
<div class="col col-auto">

2
src/components/CreatePollDialog.vue
View file

@ -59,7 +59,7 @@
<v-row cols="12" no-gutters class="ma-0 pa-0">
<v-col class="ma-0 pa-0">
<div :class="{'add-answer-button':true, 'clickable': true, 'hidden': addingAnswer}" @click.stop="addAnswer">
<img src="@/assets/icons/ic_add.svg" />
<v-icon>$vuetify.icons.ic_add</v-icon>
</div>
</v-col>
</v-row>

4
src/components/DeviceList.vue
View file

@ -5,11 +5,13 @@
:key="device.deviceId"
:value="device.deviceId"
>
<template v-slot:default="{ isActive }">
<template v-slot:default>
<v-list-item-title>{{ displayName(device) }}</v-list-item-title>
<v-list-item-subtitle>{{
verificationStatus(device)
}}</v-list-item-subtitle>
</template>
<template v-slot:append="{ isActive }">
<v-list-item-action v-if="isActive">
<v-btn icon>
<v-icon

2
src/components/GetLink.vue
View file

@ -36,7 +36,7 @@
<template v-slot:share>
<div v-if="shareSupported" class="clickable create-share" @click="shareLink">
<div>{{ $t("getlink.share_qr") }}</div>
<v-img src="@/assets/icons/ic_share.svg" />
<v-icon>$vuetify.icons.ic_share</v-icon>
</div>
</template>
</copy-link>

8
src/components/Invite.vue
View file

@ -43,11 +43,11 @@
}}</span>
</v-avatar>
</template>
<template v-slot:default="{ isActive }">
<template v-slot:default>
<v-list-item-title>{{ memberName(member) }}</v-list-item-title>
<v-list-item-subtitle
v-text="member.userId"
></v-list-item-subtitle>
<v-list-item-subtitle>{{ member.userId }}</v-list-item-subtitle>
</template>
<template v-slot:append="{ isActive }">
<v-list-item-action>
<v-btn icon v-if="isActive">
<v-icon color="grey-lighten-1">check</v-icon>

3
src/components/MoreMenuPopup.vue
View file

@ -103,10 +103,11 @@ export default {
font-weight: 400;
letter-spacing: 0.4px;
position: fixed;
margin: 0px;
margin: 0px !important;
top: 70px;
right: 10px;
display: flex;
align-items: flex-end;
justify-content: flex-end;
box-shadow: none;
pointer-events: none;

11
src/components/PurgeRoomDialog.vue
View file

@ -7,7 +7,7 @@
>
<div v-if="timeout == -1" class="dialog-content text-center">
<template>
<v-img contain height="28" src="@/assets/icons/trash_black.svg" />
<v-icon size="28">$vuetify.icons.trash_black</v-icon>
<h2 class="dialog-title">{{ $t("purge_room.title") }}</h2>
<div class="dialog-text">
{{ $t("purge_room.info") }}
@ -49,12 +49,9 @@
<!-- Timer -->
<div v-if="timeout >= 0 && !isPurging" class="dialog-content text-center">
<template>
<v-img
contain
width="20"
class="d-inline-block me-2"
src="@/assets/icons/timer.svg"
/>{{ $t("purge_room.n_seconds", { seconds: timeout }) }}
<v-icon size="20"
class="d-inline-block me-2">$vuetify.icons.timer</v-icon>
{{ $t("purge_room.n_seconds", { seconds: timeout }) }}
<h2 class="dialog-title mb-0">{{ $t("purge_room.self_destruct") }}</h2>
<div class="dialog-text text-center mb-5">
{{ $t("purge_room.notified") }}

2
src/components/QuoteView.vue
View file

@ -6,7 +6,7 @@
class="text-center d-flex flex-column goodbye-wrapper"
>
<div v-if="roomWasPurged">
<v-img src="@/assets/icons/trash.svg" />
<v-icon>$vuetify.icons.trash</v-icon>
</div>
<h2 v-if="roomWasPurged" class="text-white mt-2 mb-8">
{{ $t("goodbye.room_deleted") }}

15
src/components/RoomInfo.vue
View file

@ -135,20 +135,17 @@
<v-list-item link v-on:click="showMessageRetentionDialog = true" class="px-0 pb-0">
<template v-slot:prepend>
<v-avatar class="mr-0 pb-0 mb-0">
<v-img
contain
width="24"
height="24"
src="@/assets/icons/timer.svg"
/>
<v-icon>$vuetify.icons.timer</v-icon>
</v-avatar>
</template>
{{ messageRetentionDisplay }}
<v-list-item-action class="pb-0 mb-0">
<v-icon>arrow_drop_down</v-icon>
</v-list-item-action>
<template v-slot:append>
<v-list-item-action class="pb-0 mb-0">
<v-icon>arrow_drop_down</v-icon>
</v-list-item-action>
</template>
</v-list-item>
<hr />
</v-list>

6
src/components/messages/MessageIncomingPoll.vue
View file

@ -22,8 +22,8 @@
>
<v-col cols="auto" class="ma-0 pa-0 poll-answer-title">{{ answer.text }} {{ answer.max }}</v-col>
<v-col v-if="answer.id == pollTentativeAnswer" cols="auto" class="ma-0 pa-0 poll-answer-title"
><v-img class="poll-check-icon" src="@/assets/icons/ic_check.svg"
/></v-col>
><v-icon class="poll-check-icon">$vuetify.icons.ic_check</v-icon>
</v-col>
<v-col
v-if="
pollIsClosed || (pollIsDisclosed && userHasVoted) || (pollIsAdmin && (userHasVoted || pollViewResults))
@ -71,7 +71,7 @@
{{ $t("poll_create.close_poll") }}
</div>
<div class="poll-status-closed clickable" v-else-if="pollIsAdmin && pollIsClosed" @click.stop="pollClose">
<img class="icon" src="@/assets/icons/ic_check_small.svg" />
<v-icon class="icon">$vuetify.icons.ic_check_small</v-icon>
{{ $t("poll_create.poll_status_closed") }}
</div>
</v-col>

6
src/components/messages/MessageOutgoingPoll.vue
View file

@ -22,8 +22,8 @@
>
<v-col cols="auto" class="ma-0 pa-0 poll-answer-title">{{ answer.text }} {{ answer.max }}</v-col>
<v-col v-if="answer.id == pollTentativeAnswer" cols="auto" class="ma-0 pa-0 poll-answer-title"
><v-img class="poll-check-icon" src="@/assets/icons/ic_check.svg"
/></v-col>
><v-icon class="poll-check-icon">$vuetify.icons.ic_check</v-icon>
</v-col>
<v-col
v-if="
pollIsClosed || (pollIsDisclosed && userHasVoted) || (pollIsAdmin && (userHasVoted || pollViewResults))
@ -71,7 +71,7 @@
{{ $t("poll_create.close_poll") }}
</div>
<div class="poll-status-closed clickable" v-else-if="pollIsAdmin && pollIsClosed" @click.stop="pollClose">
<img class="icon" src="@/assets/icons/ic_check_small.svg" />
<v-icon class="icon">$vuetify.icons.ic_check_small</v-icon>
{{ $t("poll_create.poll_status_closed") }}
</div>
</v-col>