Mastodon: Add a light background behind "dark text" emojis

Created on 24 Sep 2017  ·  7Comments  ·  Source: tootsuite/mastodon

As noted in #2475, Mastodon's EmojiOne 2 seems to assume a light background, making a bunch of emojis unreadable. This not only applies to nonsense emoji representations for ©️ ®️ ™️, but also messes up, among others, 🔜. Since we now have full control of what emoji images we are using, it makes sense to go ahead and put a light background behind those troublesome images.

Glyphs to edit: 🎵🎶➕➖➗✖️💲💱™️©️®️〰️➰🔚🔙🔛🔝🔜✔️☑️⚫🔳▪️◾◼️⬛♠️♣️🏴🎱🎮🌑🖋️✒️💣📸📷. Inherently black things (geometric and playing cards stuff) can be made as bright as 👤. Clock symbols and silhouettes appear OK.

(For some reason I believe 👁️‍🗨️ is not working properly.)
See also EmojiTwo/emojitwo#110.


  • [x] I searched or browsed the repo’s other issues to ensure this is not a duplicate.
  • [x] This bug happens on a tagged release, 1.6.1.
accessibility expertise wanted ui

All 7 comments

Does this happen with Twemoji, which we just switched to?
On Sun, Sep 24, 2017 at 5:06 PM Mingye Wang notifications@github.com
wrote:

As noted in #2475 https://github.com/tootsuite/mastodon/issues/2475,
Mastodon's EmojiOne 2 seems to assume a light background, making a bunch of
emojis unreadable. This not only applies to nonsense emoji representations
for ©️ ®️ ™️, but also messes up, among others, 🔜. Since we now have
full control of what emoji images we are using, it makes sense to go ahead
and put a light background behind them.

See also EmojiTwo/emojitwo#110

https://github.com/EmojiTwo/emojitwo/issues/110.


You are receiving this because you are subscribed to this thread.
Reply to this email directly, view it on GitHub
https://github.com/tootsuite/mastodon/issues/5083, or mute the thread
https://github.com/notifications/unsubscribe-auth/AAORV4_mSGZYeRz6SXeRyhRpFhBmObf5ks5slsRPgaJpZM4PiB5j
.

The arrows, arithmetic signs, and those "always black" things still appear problematic. Camera and bomb can use some outline.

A quick (though not extremely pretty) fix would be to use filter: drop-shadow(0 0 1px white);

®, © and ™ were excluded from emojification in the previous implementation, that should be added back imo. edit: appears those ARE excluded. Unless I tested it on some old commit

screenshot_20170925_101412

Yep, the fix to #2475 did remove emojificaton for those three nonsense characters.

it actually wasn't fixed until I made this PR in August: https://github.com/tootsuite/mastodon/pull/4472
Testing on glitch.social suggests the fix is still in place… the other symbols aren't so easy to work around tho :(

the filter: drop-shadow(0 0 1px white) is completely unreadable for me.

I still see this issue. Following the suggestion on https://github.com/twitter/twemoji/issues/62 I've tried adding filter: drop-shadow(1px 1px 0 #FFF) drop-shadow(-1px 1px 0 #FFF) drop-shadow(1px -1px 0 #FFF) drop-shadow(-1px -1px 0 #FFF); and it looks quite good, but it breaks the margins
image
image

Was this page helpful?
0 / 5 - 0 ratings