Lissy93 / dashy

🚀 A self-hostable personal dashboard built for you. Includes status-checking, widgets, themes, icon packs, a UI editor and tons more!
https://dashy.to
MIT License
17.55k stars 1.34k forks source link

[FEATURE_REQUEST] Add a dropdown list for theme in the UI config editor #65

Closed MilesTEG1 closed 3 years ago

MilesTEG1 commented 3 years ago

Hello again 😄 It would be nice to have a dropdown list for the theme in the UI config editor, like the one for iconesize : image

Because guessing the right font case for the name is tricky 😆 For example, I set manually the theme to Nord, but it didn't work, because it should be nord.

It may be great to list them in github doc 😊

Thanks again ✋🏻

Lissy93 commented 3 years ago

Hey, good idea!

I'm just looking into it now, the config uses the schema defined in ConfigSchema.json, but it actually might be a bit harder than it sounds to put the themes in there, as it would mean users couldn't add there own custom theme, but I will see what I can do :)

In the meantime, here's a list of all available theme keys: callisto, thebe, dracula, material, material-dark, colorful, nord, nord-frost, minimal-dark, minimal-light, matrix, matrix-red, hacker-girl, raspberry-jam, bee, tiger, material-original, material-dark-original, vaporware, high-contrast-dark, high-contrast-light. (the themes names are specified in defaults.js)

MilesTEG1 commented 3 years ago

I'm just looking into it now, the config uses the schema defined in ConfigSchema.json, but it actually might be a bit harder than it sounds to put the themes in there, as it would mean users couldn't add there own custom theme, but I will see what I can do :)

Maybe set a custom entry that use another line like this :

appConfig:
  theme: "custom"
  custom_theme: "myCustomTheme"

with custom_theme: "myCustomTheme" is the only one that can be whatever the user create. With this, no need to worry about user's own themes 😃

What do you think about it ?

Lissy93 commented 3 years ago

Yeah, that's one solution, but it complicates things having two properties both controlling the theme. I guess customTheme could always take precedence, but then the user wouldn't be able to switch to a built-in theme with the main dropdown.

I have made an addition in 369c6f10db7eab3440a935f82dbbc2541e407424, which shows all the built-in themes in the tip, so when you hover over theme property you should see all the built-in options, but you can still type anything in the box. Do you think that will be enough?

image

MilesTEG1 commented 3 years ago

Yeah, that's one solution, but it complicates things having two properties both controlling the theme. I guess customTheme could always take precedence, but then the user wouldn't be able to switch to a built-in theme with the main dropdown.

I have made an addition in 369c6f1, which shows all the built-in themes in the tip, so when you hover over theme property you should see all the built-in options, but you can still type anything in the box. Do you think that will be enough?

image

That should be enough :)

If you managed to get the droplist working with another line, as I suggested, maybe with an algorythm like this

if theme = custom then
  use custom_theme value instead
else 
  use theme value as normal
endif

(I don't know the language used to code...)

Lissy93 commented 3 years ago

I'll add it to my todo list - At the moment I'm going to close the issue, but I will update it in the future if a better solution is implemented 😃 Let me know if you need anything else :)