diff --git a/src/components/emoji_reactions/emoji_reactions.vue b/src/components/emoji_reactions/emoji_reactions.vue
index 12783114b..eb46018e2 100644
--- a/src/components/emoji_reactions/emoji_reactions.vue
+++ b/src/components/emoji_reactions/emoji_reactions.vue
@@ -12,20 +12,20 @@
@mouseenter="fetchEmojiReactionsByIfMissing()"
>
+ {{ reaction.name }}
- {{ reaction.name }}
{{ reaction.count }}
@@ -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 65248ac1b..17afc5ba5 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') }}
+