diff options
Diffstat (limited to 'src/components')
| -rw-r--r-- | src/components/emoji_reactions/emoji_reactions.vue | 27 | ||||
| -rw-r--r-- | src/components/settings_modal/tabs/general_tab.vue | 9 |
2 files changed, 27 insertions, 9 deletions
diff --git a/src/components/emoji_reactions/emoji_reactions.vue b/src/components/emoji_reactions/emoji_reactions.vue index 12783114..eb46018e 100644 --- a/src/components/emoji_reactions/emoji_reactions.vue +++ b/src/components/emoji_reactions/emoji_reactions.vue @@ -12,20 +12,20 @@ @mouseenter="fetchEmojiReactionsByIfMissing()" > <span - v-if="reaction.url" class="reaction-emoji" > <img + v-if="reaction.url" :src="reaction.url" :title="reaction.name" class="reaction-emoji-content" width="1em" > + <span + v-else + class="reaction-emoji reaction-emoji-content" + >{{ reaction.name }}</span> </span> - <span - v-else - class="reaction-emoji reaction-emoji-content" - >{{ reaction.name }}</span> <span>{{ reaction.count }}</span> </button> </UserListPopover> @@ -49,6 +49,8 @@ margin-top: 0.25em; flex-wrap: wrap; + --emoji-size: calc(1.25em * var(--emojiReactionsScale, 1)); + .emoji-reaction { padding: 0 0.5em; margin-right: 0.5em; @@ -59,17 +61,24 @@ box-sizing: border-box; .reaction-emoji { - width: 1.25em; - height: 1.25em; + width: var(--emoji-size); + height: var(--emoji-size); margin-right: 0.25em; + line-height: var(--emoji-size); + display: flex; + justify-content: center; + align-items: center; } .reaction-emoji-content { - max-width: 1.25em; - max-height: 1.25em; + max-width: 100%; + max-height: 100%; width: auto; height: auto; + line-height: inherit; overflow: hidden; + font-size: calc(var(--emoji-size) * 0.8); + margin: 0; } &:focus { diff --git a/src/components/settings_modal/tabs/general_tab.vue b/src/components/settings_modal/tabs/general_tab.vue index 65248ac1..17afc5ba 100644 --- a/src/components/settings_modal/tabs/general_tab.vue +++ b/src/components/settings_modal/tabs/general_tab.vue @@ -271,6 +271,15 @@ {{ $t('settings.no_rich_text_description') }} </BooleanSetting> </li> + <li> + <IntegerSetting + v-if="user" + path="emojiReactionsScale" + expert="1" + > + {{ $t('settings.emoji_reactions_scale') }} + </IntegerSetting> + </li> <h3>{{ $t('settings.attachments') }}</h3> <li> <BooleanSetting |