Topics started by PaulHanney

1 Topic

P
PaulHanney
posted in Ask a Question

Adding Manual Progress Bar

Just wanted to share the code I have used to create a clean looking progress bar. This is just a manual one and not linked to any events on the page but something I couldn’t find any existing documentation on. Just change the max-width in the html to adjust the progress %. Add this to your page CSS: <style> .progressbar{ width:99%; border:1px solid #a9a9a9; background:#4c515d; border-radius: 10px; margin:0 auto; } .progressbar-inner{ background:repeating-linear-gradient( -55deg, 1cae9b, 1cae9b 10px, 49beaf 10px, 49beaf 20px ); height:6px; border-radius: 10px 0 0 10px; } </style> Then create a custom HTML block (one for desktop and a separate one for mobile) and add the following: <div class="progressbar"> <div class="progressbar-inner" style="max-width:50%;"></div> </div>

0
L
4 years ago

Badge winners

Show all badges
Terms & ConditionsCookie settings