haishanh / yacd

Yet Another Clash Dashboard
http://yacd.haishan.me
MIT License
4.16k stars 736 forks source link

yacd emoticon #749

Closed volatilaq closed 1 year ago

volatilaq commented 1 year ago

I want to ask, why when I open Yacd on Opera, no emoticons appear but when I open Yacd on Firefox, emoticons appear. I also tried opening yacd in chrome, and it's the same with opera, emoticons don't appear, why browser chrome and opera cant read emoticons like in firefox? do you have a solution?

yacd-chrome yacd-firefox yacd-opera

haishanh commented 1 year ago

I think it's related to the font family use in yacd. I thought "Segoe UI Emoji" is what Windows used to render Emoji. It's included in the CSS, not sure why it's not working in Chrome and Opera.

https://github.com/haishanh/yacd/blob/0b254f1c8784ef47e290329ef0339a602af4aa4d/src/components/Root.scss#L57

I don't have a Windows machine, if you have some web development experience you may try appending some additional font family like below and see if it works.

apple color emoji, segoe ui emoji, noto color emoji, android emoji, emojisymbols, emojione mozilla, twemoji mozilla, segoe ui symbol
volatilaq commented 1 year ago

I think it's related to the font family use in yacd. I thought "Segoe UI Emoji" is what Windows used to render Emoji. It's included in the CSS, not sure why it's not working in Chrome and Opera.

https://github.com/haishanh/yacd/blob/0b254f1c8784ef47e290329ef0339a602af4aa4d/src/components/Root.scss#L57

I don't have a Windows machine, if you have some web development experience you may try appending some additional font family like below and see if it works.

apple color emoji, segoe ui emoji, noto color emoji, android emoji, emojisymbols, emojione mozilla, twemoji mozilla, segoe ui symbol

how to apply the code above? sorry I don't understand in css code