element-hq / element-web

A glossy Matrix collaboration client for the web.

https://element.io

GNU Affero General Public License v3.0

11.27k stars 2.01k forks source link

Changing the UI font to a custom font makes emojis change #14398

Closed pioneer closed 1 year ago

pioneer commented 4 years ago

Default UI font: Выделение_198

Roboto: Выделение_199

Steps to reproduce

OS, DE: Manjaro/Cinnamon
the nightly Riot-desktop build I'm using is https://packages.riot.im/debian/pool/main/r/riot-nightly/riot-nightly_2020070901_amd64.deb
go to Settings -> Appearance -> Show advanced -> Use a system font
tick the checkbox, type Roboto (the Roboto font should be installed)
emoji reactions will become black and white

Expected result:

Although design-wise I'm not 100% sure which solution is the best, I believe changing the UI font should not lead to such an unexpected thing. Instead, either the look of emojis should not be changed, or the user can select the emojis look independently using one of the predefined packs, for example.

pioneer commented 4 years ago

I was given this link - https://blog.livthomas.net/adding-color-emojis-to-chrome-on-fedora/, and seems it's very relevant, but I haven't used it just because installing the following packages from AUR and restarting Riot helped without any additional action: noto-fonts-emoji-flags, noto-fonts-emoji-fontconfig.

Pestdoktor commented 4 years ago

You are overriding the entire stack with that setting, so for your desired result you'd have to append the fallback fonts again: Roboto,Twemoji,Apple Color Emoji,Segoe UI Emoji,Arial,Helvetica,Sans-Serif,Noto Color Emoji or something to that effect.

Maybe this should be done transparently by riot?

geckolinux commented 4 years ago

I'm also running into this on openSUSE Tumbleweed when trying to use the Ubuntu font. I don't mind the B&W emojis, but the problem is that some of them are wrong. For example, here there should just be 3 "facepalms" (nothing to do with Riot :wink: ) :

Screenshot at 2020-07-14 08-43-19

So from @pioneer 's link, do I understand that I would have to use a font that specifically has a color emoji subset? Or can I put more than one font in the field?

Would it be possible to just make Riot always use its default font for emojis?

Pestdoktor commented 4 years ago

Or can I put more than one font in the field?

Yes, put a comma-seperated list ordered by descending priority and it will use the first font which supports any given character.

Pestdoktor commented 4 years ago

#charset

iav commented 4 years ago

Workaround work for me on windows 10: set font string Arial,Twemoji,Apple Color Emoji,Segoe UI Emoji I have arial text and good emoji.

maralorn commented 3 years ago

For what it's worth: For me personally knowing that you can enter a list of fonts and not just one font into the field helped me a lot. If the tool tip could be a little bit more precise and maybe show the default setting that would probably help a lot.

frakic commented 2 years ago

Retested on both Element Web and Nightly 1.10.12 by adding Open Sans as a custom font. Emojis appear different and some of them seem to be missing entirely:

The workaround, as mentioned above, is to set custom font to Open Sans,Twemoji,Apple Color Emoji,Segoe UI Emoji That way I have Open Sans set as my default font and emojis look fine:

I say we leave this issue open but with low priority.

CutestNekoAqua commented 2 years ago

For you all who may wanna use noto emojis: Roboto,Segoe UI Emoji,Arial,Helvetica,Sans-Serif,Noto Color Emoji

t3chguy commented 1 year ago