Make it look more like the Telegram desktop app

joeytwiddle commented 4 years ago

I changed the layout and colours in light-mode to make the Telegram in Franz look more like the Telegram desktop app. It's still not an exact clone, but it's closer!

I then did the same for dark-mode, based on magazov's branch.

Some things still TODO:

[ ] Some of the pop up windows are unfinished, although they are usable. E.g. the Forward message dialogue window, and windows accessible from the burger menu
[ ] I overrode a lot of @magazov's black backgrounds with the dark blue of the Telegram desktop. We should probably do this directly in magazov's code instead of overriding.
[x] When selecting a message in dark mode, it doesn't get highlighted. Also the "check" icon appears off.
[x] Use 2 spaces for indentation.
[ ] Often instead of !important we could have made the selector more specific e.g. by putting body in front. But that won't always work. (The issue here is that sometimes our CSS appears in the DOM before Telegram's CSS, and sometimes after. This behaviour appears to be inconsistent. If we cannot consistently load our stylesheet after Telegram's, then we need to take extra measures to override their CSS rules.)

Current Telegram in Franz Telegram in Franz (this branch) Telegram desktop app Telegram in Franz (this branch) Telegram desktop app

This PR will close https://github.com/meetfranz/franz/issues/1240

Stanzilla commented 4 years ago

Your screenshots are a bit broken

joeytwiddle commented 4 years ago

Sorry, they are intentionally like that. I wanted to anonymise them!

meetfranz / recipe-telegram

Make it look more like the Telegram desktop app #13