57 lines
1.4 KiB
CSS
57 lines
1.4 KiB
CSS
.joubel-progress-circle-wrapper{
|
|
display: inline-block;
|
|
padding: 0em 1em;
|
|
}
|
|
.joubel-progress-circle-percentage{
|
|
position: relative;
|
|
font-size: 1em;
|
|
}
|
|
|
|
.joubel-progress-circle-circle{
|
|
-webkit-transform: rotate(0deg);
|
|
-ms-transform: rotate(0deg);
|
|
transform: rotate(0deg);
|
|
|
|
display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
|
|
display: -ms-flexbox; /* TWEENER - IE 10 */
|
|
display: -webkit-flex; /* NEW - Chrome */
|
|
display: flex; /* NEW, Spec - Opera 12.1, Firefox 20+ */
|
|
|
|
-webkit-align-items: center;
|
|
-webkit-box-align: center;
|
|
-ms-flex-align: center;
|
|
align-items: center;
|
|
|
|
-webkit-justify-content: center;
|
|
-webkit-box-pack: center;
|
|
-ms-flex-pack: center;
|
|
justify-content: center;
|
|
|
|
position: relative;
|
|
|
|
top: 0.151em;
|
|
left: 0.151em;
|
|
text-align: center;
|
|
width: 2.7em;
|
|
height: 2.7em;
|
|
|
|
-webkit-border-radius: 100%; /* Safari 3-4, iOS 1-3.2, Android 1.6- */
|
|
-moz-border-radius: 100%; /* Firefox 1-3.6 */
|
|
border-radius: 100%; /* Opera 10.5, IE 9, Safari 5, Chrome, Firefox 4, iOS 4, Android 2.1+ */
|
|
|
|
background-color: #fff;
|
|
}
|
|
|
|
.joubel-progress-circle-active-border{
|
|
position: relative;
|
|
text-align: center;
|
|
width: 3em;
|
|
height: 3em;
|
|
|
|
-webkit-border-radius: 100%; /* Safari 3-4, iOS 1-3.2, Android 1.6- */
|
|
-moz-border-radius: 100%; /* Firefox 1-3.6 */
|
|
border-radius: 100%; /* Opera 10.5, IE 9, Safari 5, Chrome, Firefox 4, iOS 4, Android 2.1+ */
|
|
|
|
background-color: #1a73d9;
|
|
}
|