Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Allow to change color of progress #852

Open
gilprime opened this issue Jul 16, 2024 · 2 comments
Open

Allow to change color of progress #852

gilprime opened this issue Jul 16, 2024 · 2 comments
Labels
enhancement New feature or request

Comments

@gilprime
Copy link

Progress is always in blue, add a way to change the tint of colors, for example, red, orange, green... Or based on a Hue or hex value that will affect the other striped color automatically based on the first one.

@xoxys
Copy link
Member

xoxys commented Jul 16, 2024

The color of UI elements (progress, buttons, etc.) is based on the --accent-color-lite and --accent-color vars. These vars can be changed as described in https://hugo-geekblog.geekdocs.de/posts/features/theming/. However, this will affect all UI elements and I would like to keep this behavor as it results in a consistent UI.

If you still want to use a different color for progess only, you can still use the custom css file to override the property in the progress bar class directly:

.gblog-progress__bar {
  background-color: green !important;
}

@xoxys xoxys added the question Further information is requested label Jul 16, 2024
@gilprime
Copy link
Author

Thanks for you response, i kenw that it is possible to customize color, but, my request was to customize it progress by progress, for example, if i have a table of items to develop with item in the first column and a progress on the second indicating the development progress of it. I wish to set the progress to green if item is completed, let it blue is in progress, and customize it to red if not started. So in one page i can have three coloring schemes for the progress.

See example of what i mean below:

Features to develop Status
Feat. one {{< progress title="Done" value=100 color=green >}}
Feat. two {{< progress title="In progress" value=80 >}}
Feat. three {{< progress title="Not started" value=0 color=red >}}

@xoxys xoxys added enhancement New feature or request and removed question Further information is requested labels Aug 27, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request
Projects
None yet
Development

No branches or pull requests

2 participants