httptoolkit / httptoolkit-ui

The UI of HTTP Toolkit
https://httptoolkit.com
GNU Affero General Public License v3.0
282 stars 106 forks source link

Add automatic theme (syncs with system settings) #92

Closed Bleuzen closed 11 months ago

Bleuzen commented 11 months ago

Hi :) This adds an option to follow the systems color theme. If theme is changed in system settings, HTTP Toolkit will automatically adapt (if enabled).

CLAassistant commented 11 months ago

CLA assistant check
All committers have signed the CLA.

pimterry commented 11 months ago

Hi @Bleuzen, thanks for this! Great idea.

The underlying model all looks great to me, but I'm not totally sure about the UX. Was there a reason you didn't add this as another tab in the theme options? Most theme pickers I've seen elsewhere use Auto/Dark/Light for example. I think that might be a little clearer and more intuitive for users coming from other tools.

Firefox for example (with a system dark mode default):

Firefox showing auto/light/dark buttons

What do you think?

Bleuzen commented 11 months ago

Was there a reason you didn't add this as another tab in the theme options?

Was, yeah. Had it as tab first but it was buggy sometimes under circumstances. Note: I usually don't work with some stuff used in httptoolkit, so I probably just made a weird mistake with mobx or something.

Anyway, gave it another try and it works this time. Pushed now.

Bleuzen commented 11 months ago

I'm not perfectly happy with the icon yet, didn't find a simple one for automatic and adjust is already used for the high contrast theme, so went with magic for now. @pimterry if you have a better idea, go ahead.

pimterry commented 11 months ago

Great stuff, thanks @Bleuzen! Looks perfect to me :+1:

By the way, in case you're not aware, HTTP Toolkit Pro is totally free for contributors. If you're interested, just let me know your email address (here or send me a message at tim @ httptoolkit.com) and I'll set you up.