fix(chat): increase icons size

Signed-off-by: Maksim Sukharev <antreesy.web@gmail.com>
This commit is contained in:
Maksim Sukharev 2025-08-29 10:03:15 +02:00
parent 60ce790c48
commit 561e94477a
11 changed files with 46 additions and 46 deletions

View file

@ -205,8 +205,8 @@ useHotKey('r', toggleHandRaised)
<!-- The following icon is much bigger than all the others
so we reduce its size -->
<template #icon>
<IconHandBackLeft v-if="isHandRaised" :size="16" />
<IconHandBackLeftOutline v-else :size="16" />
<IconHandBackLeft v-if="isHandRaised" :size="18" />
<IconHandBackLeftOutline v-else :size="18" />
</template>
</NcButton>
</div>

View file

@ -70,7 +70,7 @@
class="password-form__button"
@click="copyPassword">
<template #icon>
<IconContentCopy :size="16" />
<IconContentCopy :size="20" />
</template>
</NcButton>
</form>

View file

@ -61,22 +61,22 @@
close-after-click
@click="toggleFavoriteConversation">
<template #icon>
<IconStar :size="16" :fill-color="!item.isFavorite ? '#FFCC00' : undefined" />
<IconStar :size="20" :fill-color="!item.isFavorite ? '#FFCC00' : undefined" />
</template>
{{ labelFavorite }}
</NcActionButton>
<NcActionButton key="copy-link" @click.stop="handleCopyLink">
<template #icon>
<IconContentCopy :size="16" />
<IconContentCopy :size="20" />
</template>
{{ t('spreed', 'Copy link') }}
</NcActionButton>
<NcActionButton key="toggle-read" close-after-click @click="toggleReadConversation">
<template #icon>
<IconEyeOutline v-if="item.unreadMessages" :size="16" />
<IconEyeOffOutline v-else :size="16" />
<IconEyeOutline v-if="item.unreadMessages" :size="20" />
<IconEyeOffOutline v-else :size="20" />
</template>
{{ labelRead }}
</NcActionButton>
@ -85,14 +85,14 @@
is-menu
@click="submenu = 'notifications'">
<template #icon>
<IconBellOutline :size="16" />
<IconBellOutline :size="20" />
</template>
{{ t('spreed', 'Notifications') }}
</NcActionButton>
<NcActionButton key="show-settings" close-after-click @click="showConversationSettings">
<template #icon>
<IconCogOutline :size="16" />
<IconCogOutline :size="20" />
</template>
{{ t('spreed', 'Conversation settings') }}
</NcActionButton>
@ -102,8 +102,8 @@
close-after-click
@click="toggleArchiveConversation">
<template #icon>
<IconArchiveOutline v-if="!item.isArchived" :size="16" />
<IconArchiveOffOutline v-else :size="16" />
<IconArchiveOutline v-if="!item.isArchived" :size="20" />
<IconArchiveOffOutline v-else :size="20" />
</template>
{{ labelArchive }}
</NcActionButton>
@ -113,7 +113,7 @@
close-after-click
@click="isLeaveDialogOpen = true">
<template #icon>
<IconExitToApp :size="16" />
<IconExitToApp :size="20" />
</template>
{{ t('spreed', 'Leave conversation') }}
</NcActionButton>
@ -124,7 +124,7 @@
class="critical"
@click="isDeleteDialogOpen = true">
<template #icon>
<IconTrashCanOutline :size="16" />
<IconTrashCanOutline :size="20" />
</template>
{{ t('spreed', 'Delete conversation') }}
</NcActionButton>
@ -135,7 +135,7 @@
:aria-label="t('spreed', 'Back')"
@click.stop="submenu = null">
<template #icon>
<IconArrowLeft class="bidirectional-icon" :size="16" />
<IconArrowLeft class="bidirectional-icon" :size="20" />
</template>
{{ t('spreed', 'Back') }}
</NcActionButton>
@ -149,7 +149,7 @@
type="radio"
@click="setNotificationLevel(level.value)">
<template #icon>
<component :is="level.icon" :size="16" />
<component :is="level.icon" :size="20" />
</template>
{{ level.label }}
</NcActionButton>
@ -163,7 +163,7 @@
:model-value="notificationCalls"
@click="setNotificationCalls(!notificationCalls)">
<template #icon>
<IconPhoneRingOutline :size="16" />
<IconPhoneRingOutline :size="20" />
</template>
{{ t('spreed', 'Notify about calls') }}
</NcActionButton>
@ -180,7 +180,7 @@
:model-value="item.isImportant"
@click="toggleImportant(!item.isImportant)">
<template #icon>
<IconMessageAlertOutline :size="16" />
<IconMessageAlertOutline :size="20" />
</template>
{{ t('spreed', 'Important conversation') }}
</NcActionButton>
@ -192,7 +192,7 @@
:model-value="item.isSensitive"
@click="toggleSensitive(!item.isSensitive)">
<template #icon>
<IconShieldLockOutline :size="16" />
<IconShieldLockOutline :size="20" />
</template>
{{ t('spreed', 'Sensitive conversation') }}
</NcActionButton>
@ -203,14 +203,14 @@
<template v-else-if="item.token" #actions>
<NcActionButton key="join-conversation" close-after-click @click="onActionClick">
<template #icon>
<IconArrowRight class="bidirectional-icon" :size="16" />
<IconArrowRight class="bidirectional-icon" :size="20" />
</template>
{{ t('spreed', 'Join conversation') }}
</NcActionButton>
<NcActionButton key="copy-link" @click.stop="handleCopyLink">
<template #icon>
<IconContentCopy :size="16" />
<IconContentCopy :size="20" />
</template>
{{ t('spreed', 'Copy link') }}
</NcActionButton>

View file

@ -21,7 +21,7 @@
:title="t('spreed', 'Reply')"
@click="handleReply">
<template #icon>
<IconArrowLeftTop :size="16" />
<IconArrowLeftTop :size="20" />
</template>
</NcButton>
<NcActions :force-menu="true"
@ -43,7 +43,7 @@
:aria-label="readInfo.sentIconTitle">
<IconCheck :size="16" />
</span>
<IconClockOutline v-else :size="16" />
<IconClockOutline v-else :size="20" />
</template>
{{ messageDateTime }}
</NcActionText>
@ -52,7 +52,7 @@
class="edit-timestamp"
:name="lastEditActorLabel">
<template #icon>
<IconClockEditOutline :size="16" />
<IconClockEditOutline :size="20" />
</template>
{{ editedDateTime }}
</NcActionText>
@ -120,7 +120,7 @@
close-after-click
@click.stop="handleMarkAsUnread">
<template #icon>
<IconEyeOffOutline :size="16" />
<IconEyeOffOutline :size="20" />
</template>
{{ t('spreed', 'Mark as unread') }}
</NcActionButton>
@ -149,7 +149,7 @@
close-after-click
@click="threadId = message.threadId">
<template #icon>
<IconForumOutline :size="16" />
<IconForumOutline :size="20" />
</template>
{{ t('spreed', 'Go to thread') }}
</NcActionButton>
@ -160,7 +160,7 @@
close-after-click
@click="forwardToNote">
<template #icon>
<IconNoteEditOutline :size="16" />
<IconNoteEditOutline :size="20" />
</template>
{{ t('spreed', 'Note to self') }}
</NcActionButton>
@ -170,7 +170,7 @@
close-after-click
@click.stop="openForwarder">
<template #icon>
<IconArrowRightTop :size="16" />
<IconArrowRightTop :size="20" />
</template>
{{ t('spreed', 'Forward message') }}
</NcActionButton>
@ -190,7 +190,7 @@
@click.stop="$emit('showTranslateDialog', true)"
@close="$emit('showTranslateDialog', false)">
<template #icon>
<IconTranslate :size="16" />
<IconTranslate :size="20" />
</template>
{{ t('spreed', 'Translate') }}
</NcActionButton>
@ -201,7 +201,7 @@
close-after-click
@click.stop="handleDelete">
<template #icon>
<IconTrashCanOutline :size="16" />
<IconTrashCanOutline :size="20" />
</template>
{{ t('spreed', 'Delete') }}
</NcActionButton>

View file

@ -18,7 +18,7 @@
@trailing-button-click="abortSearch"
@input="handleInput">
<template #icon>
<Magnify :size="16" />
<Magnify :size="20" />
</template>
<template #trailing-button-icon>
<Close :size="20" />

View file

@ -51,7 +51,7 @@
:aria-label="t('spreed', 'Add emoji')"
:aria-haspopup="true">
<template #icon>
<IconEmoticonOutline :size="16" />
<IconEmoticonOutline :size="20" />
</template>
</NcButton>
</NcEmojiPicker>
@ -61,7 +61,7 @@
:aria-label="t('spreed', 'Add emoji')"
:disabled="true">
<template #icon>
<IconEmoticonOutline :size="16" />
<IconEmoticonOutline :size="20" />
</template>
</NcButton>
</div>
@ -110,7 +110,7 @@
force-menu
:primary="silentChat">
<template #icon>
<IconBellOffOutline v-if="silentChat" :size="16" />
<IconBellOffOutline v-if="silentChat" :size="20" />
</template>
<NcActionButton close-after-click
:model-value="silentChat"
@ -118,7 +118,7 @@
@click="toggleSilentChat">
{{ silentSendInfo }}
<template #icon>
<IconBellOffOutline :size="16" />
<IconBellOffOutline :size="20" />
</template>
</NcActionButton>
</NcActions>
@ -161,8 +161,8 @@
:aria-label="sendMessageLabel"
@click="handleSubmit">
<template #icon>
<IconForumOutline v-if="threadCreating" :size="16" />
<IconSend v-else class="bidirectional-icon" :size="16" />
<IconForumOutline v-if="threadCreating" :size="20" />
<IconSend v-else class="bidirectional-icon" :size="20" />
</template>
</NcButton>
</template>

View file

@ -10,7 +10,7 @@
:aria-label="t('spreed', 'Share files to the conversation')"
:aria-haspopup="true">
<template #icon>
<IconPlus :size="16" />
<IconPlus :size="20" />
</template>
<NcActionButton v-if="canUploadFiles"
@ -57,7 +57,7 @@
close-after-click
@click="$emit('createThread', true)">
<template #icon>
<IconForumOutline :size="16" />
<IconForumOutline :size="20" />
</template>
{{ t('spreed', 'Create a thread') }}
</NcActionButton>

View file

@ -12,7 +12,7 @@
:disabled="!canStartRecording"
@click="start">
<template #icon>
<IconMicrophoneOutline :size="16" />
<IconMicrophoneOutline :size="20" />
</template>
</NcButton>
<div v-else class="wrapper">
@ -21,7 +21,7 @@
:aria-label="abortRecordingTitle"
@click="abortRecording">
<template #icon>
<IconClose :size="16" />
<IconClose :size="20" />
</template>
</NcButton>
<div class="audio-recorder__info">
@ -35,7 +35,7 @@
:class="{ 'audio-recorder__trigger--recording': isRecording }"
@click="stop">
<template #icon>
<IconCheck :size="16" />
<IconCheck :size="20" />
</template>
</NcButton>
</div>

View file

@ -33,13 +33,13 @@
<NcActionButton v-if="showAssistanceButton"
@click="dismissRequestAssistance">
<template #icon>
<IconHandBackLeftOutline :size="16" />
<IconHandBackLeftOutline :size="18" />
</template>
{{ t('spreed', 'Dismiss request for assistance') }}
</NcActionButton>
<NcActionButton @click="isDialogOpened = true">
<template #icon>
<IconSendOutline :size="16" />
<IconSendOutline :size="20" />
</template>
{{ t('spreed', 'Send message to room') }}
</NcActionButton>

View file

@ -144,7 +144,7 @@ function handleActionsMenuOpen(open: boolean) {
:aria-label="t('spreed', 'Back')"
@click.stop="submenu = null">
<template #icon>
<IconArrowLeft class="bidirectional-icon" :size="16" />
<IconArrowLeft class="bidirectional-icon" :size="20" />
</template>
{{ t('spreed', 'Back') }}
</NcActionButton>
@ -159,7 +159,7 @@ function handleActionsMenuOpen(open: boolean) {
type="radio"
@click="chatExtrasStore.setThreadNotificationLevel(thread.thread.roomToken, thread.thread.id, level.value)">
<template #icon>
<component :is="notificationLevelIcons[level.value]" :size="16" />
<component :is="notificationLevelIcons[level.value]" :size="20" />
</template>
{{ level.label }}
</NcActionButton>

View file

@ -72,7 +72,7 @@
close-after-click
@click="chatExtrasStore.setThreadNotificationLevel(token, threadId, level.value)">
<template #icon>
<component :is="notificationLevelIcons[level.value]" :size="16" />
<component :is="notificationLevelIcons[level.value]" :size="20" />
</template>
{{ level.label }}
</NcActionButton>