1
0
mirror of https://github.com/oliviale/CSS-Progress-Pie.git synced 2025-08-04 19:47:25 +02:00

Fix copy-and-paste-but-did-not-change-content and other minor bugs

This commit is contained in:
oliviale
2017-06-11 04:36:19 +08:00
parent d5fff5632a
commit eb5c1decd8

View File

@@ -10,7 +10,7 @@ This is a progress pie done in CSS. It came about when I needed a simple progres
## How To Use ## How To Use
1. Download the CSS/SCSS file and include it in your `<head>`. There are two kinds - default (single color) or multi-colored with red, yellow and green for the numbers 1-40, 41-70 and 71-100 respectively. 1. Download the CSS/SCSS file and include it in your `<head>`. There are two kinds - default (single color) or multi-colored with red, yellow and green for the numbers 1-40, 41-70 and 71-100 respectively.
``` html ``` html
<div class="progress-pie" data-value="50"></div> <link rel="stylesheet" href="css/progress_pie_compiled.css"/>
``` ```
2. HTML structure 2. HTML structure
``` html ``` html
@@ -21,9 +21,10 @@ This is a progress pie done in CSS. It came about when I needed a simple progres
## Changing colors, fonts, etc. ## Changing colors, fonts, etc.
Manually change the properties of the CSS code. Your life will be easier if you use the SCSS file instead of the pure CSS file as you would need to alter for every `data-value`. Manually change the properties of the CSS code. Your life will be easier if you use the SCSS file instead of the pure CSS file as you would need to alter for every `data-value`.
##Playground ## Playground
[Play around in this Codepen](https://codepen.io/oliviale/pen/YqEgPw) [Play around in this Codepen](https://codepen.io/oliviale/pen/YqEgPw)
##License and other stuff ## License and other stuff
Do whatever you want license, but preferably do not delete the author comments in the CSS file :joy:. Do whatever you want license, but preferably do not delete the author comments in the CSS file :joy:.
Also, if you do end up using this and do wonderful things like you wonderful people always do, forking or tweeting your work at [me](http://twitter.com/meowlivia_) is appreciated. Also, if you do end up using this and do wonderful things like you wonderful people always do, forking or tweeting your work at [me](http://twitter.com/meowlivia_) is appreciated.