Howdy,
I am looking to utilise Glide Progress bars in a Dashboard set up. To get them to fit with the style of the other assets in the Dashboard, I would like to increase the thickness of the progress bar itself.
Does anyone have any tips or CSS samples that can be used for this purpose ?
Regards
.custom-class [class^="wire-page-progress___StyledDiv2"] {
height: 0.85rem;
}
For a more varied progress bar, you can try making it with AI Component.
Thank you. Unfortunately I can not get it to update. I will inspect the component to ensure the class name has not changed
Have you already added the class name "custom-class" to your component?
Ahhh no.
How does one do this please ?
Thanks Jeff. Apologies, yes I had added “custom-class” to the components Options panel (CSS Class) already.
Unfortunately no change to the size of the progress bar. → I have also increased the size within the Custom CSS to see if that forced the re-size but alas no go
Try copying the code below without using the custom class:
[class^="wire-page-progress___StyledDiv2"] {
height: 0.85rem;
}
If it still doesn’t work, please provide a screenshot of what you have done so far. I can’t guess what other possible issues there might be.
Perfect 
Removing the custom class worked a treat !
Thank you once again
A custom class name is needed if you want your CSS to affect only a specific progress-bar component and not others you have. If you want to apply your CSS globally, then you can skip using a custom class.
Please mark which part of the thread serves as the solution, so it can help other community members who face the same issue.
As @Jeff_Hager said, use the CUSTOM CSS –> CSS CLASS spot on your component and insert:
custom-class
No full-stop in front… Then you can play with the height that you have inserted in the Appearance –> Custom CSS text box. I tested it and it works for me.