I want to share a serie of posts containing some tips of Beercss. Beercss is a new framework around, based on (not restricted to) Material Design 3. Material Design 3 is a design system created by Google. In this post, we will learn about custom progressbar. The logic of progressbar is very simple.
1) You need to place a progress element inside another element.
<*> <div class="progress"></div> </*>
2) Do not forget to change the directions and colors.
<*> <div class="progress left|right|top|bottom green|red"></div> </*>
4) And that's it, see this example at Codepen
Hope you enjoy 🍺