Author: | radiance |
---|---|
Views Total: | 1,334 views |
Official Page: | Go to website |
Last Update: | May 22, 2020 |
License: | MIT |
Preview:

Description:
An easy-to-use CSS/SCSS library used to draw simple plain circles & ring charts representing percentage values.
How to use it:
1. Override the default variables in the SCSS.
// background color $default-content-background-color: #fff; // border color $default-border-color: #ccc; // text color $info-color: #33f;
2. Load the compiled stylesheet on the web page.
<link rel="stylesheet" href="css/styles.css" />
3. The HTML structure to draw a progress circle (10%).
<div class="progress-circle progressing p-10"> <div class="progress-circle-border"> <div class="left-half-circle"></div><div class="right-half-circle"></div> </div> <div class="progress-circle-content"> 1/10 </div> </div>