RocketChat / feature-requests

This repository is used to track Rocket.Chat feature requests and discussions. Click here to open a new feature request.
21 stars 9 forks source link

Custom emojis all have the same fixed size #807

Open paulchen opened 1 year ago

paulchen commented 1 year ago

Description:

All custom emojis have a fixed width of 2.75rem and a fixed height of 2.75rem which is set via CSS.

Steps to reproduce:

  1. Add a custom emoji which has a different size than 2.75rem x 2.75rem.
  2. Write a message containing this emoji.

Expected behavior:

The custom emoji is not resized:

image

Actual behavior:

The custom emoji is resized to 2.75rem x 2.75rem:

image

Server Setup Information:

Client Setup Information

Additional context

This problem was already reported in https://github.com/RocketChat/Rocket.Chat/issues/26547, but in my case I cannot use the solution mentioned there as my custom emojis have different sizes. Of course, I could make use of the fact that every custom emoji comes with its own CSS class and create a separate CSS definition for each emoji, but in my opinion this is a quite dirty solution.

I think this could be fixed by adding the attributes height and width to the span element of the emoji (this is how i created the screenshot in the section "Actual behaviour" above). During upload of a custom emoji, Rocket.Chat could save height and width of the emoji and retrieve these values when displaying it.

dudanogueira commented 1 year ago

Hi @paulchen! Thanks for your input.

I have tested this in 5.2.0-rc1 and it was not resized to 2.75rem x 2.75rem. Can you confirm this?

Renaming the name or alias required to upload an image again, and after uploading, it was indeed broken. So it was needed to remove the emoji and add it again.

I think this could be fixed by adding the attributes height and width to the span element of the emoji (this is how i created the screenshot in the section "Actual behaviour" above). During upload of a custom emoji, Rocket.Chat could save height and width of the emoji and retrieve these values when displaying it.

This is indeed a nice suggestion.

paulchen commented 1 year ago

Hi @dudanogueira! Thanks for for reply.

I have tested this in 5.2.0-rc1 and it was not resized to 2.75rem x 2.75rem. Can you confirm this?

I just fired up version 5.2.0-rc.1 from Docker Hub. I experienced the same behaviour as described above.

I uploaded this GIF as a custom emoji named "mb2": https://chat-dev.rueckgr.at/emoji-custom/mb2.gif

It is still resized to 2.75rem x 2.75rem. In the DevTools I can clearly see why this happens:

image

And because this style gets applied to all custom emojis, every custom emoji has the size of 2.75rem x 2.75rem.

dudanogueira commented 1 year ago

Oh, I am sorry. You are right! It's still an issue.

codewithmitesh commented 1 year ago

Is anyone solving this issue? If not, @dudanogueira would you kindly assign this to me?

hugocostadev commented 1 year ago

Hi there, thanks for raising the issue! 🚀 💯

Sorry, but GitHub is only for issues/bugs, this is a improvement of the current solution, I'll transfer this to feature-request repository.


Questions? Help needed? Feature Requests?

andys448 commented 1 year ago

Hello! Any luck?

Kot-o-pes commented 6 months ago

+1

swat-ordbogen commented 3 months ago

+1

HEPHEPHEP commented 3 months ago

+1