w-okada/voice-changer

[REQUEST]: Could we have a dark mode for V2?

Mikey-Mikey opened this issue · 19 comments

In a few words, describe your idea

I want to not get flashbanged due to a white UI.

More information

The UI is not bad don't get me wrong, it's just the color scheme should have a dark theme for people who want it. I actually did this myself by changing the CSS file manually and I think I got it looking pretty good but I pretty much hardcoded these values because all of the CSS classes were random letters and numbers:

image
image

Notice how the icons in the top left are still black. I couldn't change just the color of these since the icons were made black in the image file for each of them.

If you want my CSS file I will gladly give it to you guys. Just be aware that the CSS is not very nice. I would also like the ability to make proper themes by maybe having like a theme.json or something, y'know to easily create themes like my dark theme.

As an extra feature that's unrelated to the title of this post. Having the ability to change each voice icon inside the UI would be nice. I had to do it manually by changing the .json. Unless this is already a feature and I just neglected to read about it.

I'm REALLY loving V2 so far and the performance has improved a crap ton. (Also in the bottom right you misspelt Voice Changer Info wrong, "Voice Changaer Info")

I think I messed up the passthru button since it's not supposed to be dark when off. (It's supposed to be brighter like the start button in the first image.)

You can change the icons of each voice if you click on the edit button, look for the voice that you want to change the icon and click the icon which will prompt to search for an image. When you add a voice the icon is always blank but your screenshot shows images. Doesn't that means that you already did change their icons??

A darker UI is a good idea so I am in with it. I would like also for the window size to adapt a bit better to the UI's content. It's often smaller than the content which results in navigation bars and me having to resize the window. It's not a huge deal though, only a little detail.

The edit button says it's not implemented yet when clicking on it. Btw I'm on the latest version 2.0.58-alpha cuda

How did you add the voices without the edit button? 🤔

I used the upload button?
Also to get the images on I changed the .json file for each one manually.

I think I said that in the post.

Isn't the upload button the one that you click after you click edit though? I think we are thinking about two different edit buttons. I mean this one:
Screenshot_20240809-010836106

Oh yea of course I went into that edit one. I mean't the edit button on each model, my bad.

Oh yea of course I went into that edit one. I mean't the edit button on each model, my bad.

Recording.2024-08-09.061406.mp4

Bruh I didn't know that that was even there bruh xd.

my bad

Btw most of the theme I created used #202020 and #000 for the dark color values along with #d3d3d3 for the white text. Just in case you wanted to know. Also I'm guessing that the CSS was auto-generated, if so, what did you use?

Bruh I didn't know that that was even there bruh xd.

Yeah it took me a bit to figure out the first time hehe

Also I'm pretty sure the big image for the selected model is the wrong aspect ratio, it's not square.

Fixed it on my end by setting object-fit: contain on it.

In the latest version v.2.0.60-alpha, we have added support for Dark Mode.
Please give it a try.

Thank you for your continued cooperation.

out.mp4

Thank you!

Thank you so much! I'm now closing this issue as it isn't relevant anymore!