aahnik / tgcf

The ultimate tool to automate custom telegram message forwarding. Live-syncer, Auto-poster, backup-bot, cloner, chat-forwarder, duplicator, ... Call it whatever you like! tgcf can fulfill your custom needs.
https://github.com/aahnik/tgcf/wiki
MIT License
1.34k stars 795 forks source link

Theme switcher (light/dark mode) #480

Closed MobCode100 closed 10 months ago

MobCode100 commented 1 year ago

Description:

A function to switch between light/dark mode

Preview:

image

Key changes:

I have fully read and understood the terms and conditions laid down in the general Contributor License Agreement

MobCode100 commented 1 year ago

This PR might be unnecessary, but I would love to have a dark mode version of tgcf-web, less pain for my eyes XD. I remembered that Streamlit has already a default dark mode which can be accessed by the app menu. I thought to just enable the app menu, but you might have some reasons to disable it. So I implemented a custom theme switcher.

Actually, I made two versions of the feature:

  1. The first one is by reading theme config and start the Streamlit app with the theme. Once the theme is changed by clicking the save button, tgcf-web will automatically restart with the new configuration.
  2. The second one also reads the theme config but uses JavaScript's localStorage that simulates the default Streamlit theme switcher on the app menu. The only difference is that a website refresh is required for changes to take effect.

I decide to go with the second one, as it is a lot faster to just refresh a website and probably more stable than the first one.

Sorry for the very simple UI tho ๐Ÿคฃ, I can't think a better way to do that. Feel free to change anything and please give your feedback if any. Thank you for your time and efforts!

aahnik commented 1 year ago

This is awesome ๐Ÿ˜Ž๐Ÿ‘

I am stuck in some other work.. I will try my best to test and merge everything as soon as possible.

Thanks again for your contributions. ๐Ÿ˜Š๐Ÿ”ฅ