Limit the width of unsupported multichar emojis

This commit is contained in:
Tusooa Zhu 2022-04-29 22:40:06 -04:00
parent e01c76c7e9
commit 0fd0d6c4c2
No known key found for this signature in database
GPG key ID: 7B467EDE43A08224
2 changed files with 11 additions and 4 deletions

View file

@ -198,18 +198,22 @@ $emoji-picker-emoji-size: 32px;
height: $emoji-picker-emoji-size;
box-sizing: border-box;
display: flex;
font-size: $emoji-picker-emoji-size;
line-height: $emoji-picker-emoji-size;
align-items: center;
justify-content: center;
margin: 4px;
cursor: pointer;
img {
.emoji-picker-emoji.-custom {
object-fit: contain;
max-width: 100%;
max-height: 100%;
}
.emoji-picker-emoji.-unicode {
font-size: 24px;
overflow: hidden;
}
}
}

View file

@ -92,10 +92,13 @@
class="emoji-item"
@click.stop.prevent="onEmoji(emoji)"
>
<span v-if="!emoji.imageUrl">{{ emoji.replacement }}</span>
<span
v-if="!emoji.imageUrl"
class="emoji-picker-emoji -unicode"
>{{ emoji.replacement }}</span>
<still-image
v-else
class="emoji-picker-emoji"
class="emoji-picker-emoji -custom"
:ref="setEmojiRef(group.id + emoji.displayText)"
:data-src="emoji.imageUrl"
:data-emoji-name="group.id + emoji.displayText"