scttcper / ngx-emoji-mart

Customizable Slack-like emoji picker for Angular
https://ngx-emoji-mart.vercel.app
MIT License
451 stars 95 forks source link

Emoji's not displaying inside of mart, but are hoverable and do show tooltip. #339

Open gardensgreen opened 4 years ago

gardensgreen commented 4 years ago

Screenshot from 2020-06-24 10-27-28

gardensgreen commented 4 years ago

This hasn't always happened but please help me understand what is going on.

Aleeexx commented 4 years ago

Did you check in the browser's dev tools' network tab if the backgroundImage (containing the emojis) was loaded successfully? You can either load them from unpkg (default, https://github.com/scttcper/ngx-emoji-mart#sheet-sizes) or provide a sheet locally by yourself (by setting backgroundImageFn) https://github.com/scttcper/ngx-emoji-mart#picker.

NookaPavan commented 4 years ago

emojiMart Same Problem and the sheet gets downloaded too.But the emojis are not showing only picker and tooltips , any other reason other than sheet @Aleeexx

Aleeexx commented 4 years ago

Nope, no clue. I had the problem with emojis not being displayed when I provided a wrong sheet locally...

scttcper commented 4 years ago

I would check that other styles are not overriding those in emoji-mart

Victorm0612 commented 2 years ago

I had the same problem. My solution was to add the set property to the emoji-mart component and use any option other than emojione.

Before: <emoji-mart class="emoji-mart" set="emojione" (emojiSelect)="addEmoji($event)" title="Choose your emoji…"></emoji-mart>

Now:

<emoji-mart class="emoji-mart" set="twitter" (emojiSelect)="addEmoji($event)" title="Choose your emoji…"></emoji-mart>

saranglakare commented 1 year ago

I faced the same problem today. It turns our unpkg is giving 502 randomly. Since no error is shown by the emoji picker, the user experience is bad. I am going to try and use backgroundImageFn to load it myself now. Let's see.