Add white outline to black emojis (fix #5083)

[MaciekBaron]

This change adds a white outline to black emojis so they are visible while using the default theme. It also reduces their size slightly so that the outline does not leak out outside the container.

The list of black emojis can be easily updated by appending a string to a SASS variable.

[renatolond]

Cool! :)
Maybe add it to spider and ant too?

[MaciekBaron]

Done. Let me know if there are any more.

[Gargron]

Unfortunately, it doesn't seem to look any good on Firefox (deployed on mastodon.social):

I would suggest a revert because this is visually worse than them just not showing up on a dark theme (fwiw discord and tweetdeck have the same problem and aren't doing anything to correct it either)

[MaciekBaron]

I personally think it's better to have it look better on most browsers, than have it hardly visible on all browsers, but if the general consensus is to remove the outline, I'm happy with that.

[trwnh]

Wouldn't it be better to apply a filter like invert(100%) instead of a white outline? As long as the icons are greyscale, this shouldn't mess up any colors. If it does, then you can apply a filter hue-rotate(180deg) as well.

[MaciekBaron]

Personally I don't think that will work. Some emojis won't make much sense when you switch the black color with white. It's a nice suggestion nonetheless.

…

On Mon, 9 Jul 2018 at 01:48, trwnh ***@***.***> wrote: Wouldn't it be better to apply a filter like invert(100%) instead of a white outline? As long as the icons are greyscale, this shouldn't mess up any colors. If it does, then you can apply a filter hue-rotate(180deg) as well. — You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub <#7936 (comment)>, or mute the thread <https://github.com/notifications/unsubscribe-auth/ABl2aJOUWgIVql4J35R2IqIp4OAECzzrks5uEqhXgaJpZM4VA8Fl> .