Here is a Material design inspired progress loader
Here is a Material design inspired progress loader
This particular loader is used to indicate indeterminate loading 💫
The values for left and width were a little tricky to nail on this one through 🥴
Let's break this down:
👉🏻 We have a parent progress container with relative positioning and overflow set to hidden
👉🏻 Then we have an inner div with the required accent color which is the main element here
👉🏻 We animate the left and right property of this inner div
⚠️ But the important thing is that the left and width are automated at slightly different rates to create a cool growing effect.
Play with the values to get an animation you like 🤩
Share your thoughts in the comments!
----------
#css
#csstricks
#html
#html5
#javascript
#frontend
#frontenddeveloper
#fullstack
#fullstackdeveloper
#reactjs
#vuejs
#angular
post by @baby_wolf_codes
