Styling Plutio with CSS: Progress Bars
You might have seen the recent blog post that walks you through the process of using custom CSS with Plutio. If not, head over and read that first!
So if you’ve set your Plutio up to use your custom CSS styles you’re well on your way to making Plutio look the way you want it to. Now all you need is some CSS code to make things look pretty. If you know CSS then you’re all set. If not, you might like to use some of the examples below. You can copy and paste the bits of code you like the look of into the Cloudflare CSS app. Then save and refresh your Plutio to see it take effect.
You can combine as many of these code snippets as you like into the Cloudflare CSS app, mixing and matching to get the look you’re after. I would advise you to keep the /*comment line*/ with each code snippet so that you know what each line is doing when you want to come back and change things later down the line.
We’ll start in this post by looking at progress bars. Look out for a series of posts coming up on styling different areas of Plutio. Each snippet will be listed separately, along with a screenshot. At the end we’ll combine these snippets together to see what you can build when you chain a whole bunch of CSS together.
On with the examples!