mirror_php/moodle
1
0
Fork 0
mirror of https://github.com/moodle/moodle.git synced 2025-01-19 06:18:28 +01:00
Code Issues Projects Releases Wiki Activity

MDL-58299 block_myoverview: fix styling of progress chart

Browse Source 
Part of MDL-55611 epic.
This commit is contained in:
Ryan Wyllie 2017-03-20 05:43:51 +00:00 committed by Damyon Wiese
parent 07d1abe346
commit 0a2b761c1a
4 changed files with 117 additions and 117 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
blocks/myoverview/templates/progress-chart.mustache
View File

@ -33,9 +33,9 @@
<g>
<title>{{progress}}&#37;</title>
<circle class="circle percent-{{progress}}"
r="32.5"
cx="40"
cy="40"/>
r="27.5"
cx="35"
cy="35"/>
</g>
</svg>
</div>

2
theme/boost/scss/moodle/blocks.scss
View File

@ -73,7 +73,7 @@ $blocks-plus-gutter: $blocks-column-width + $grid-gutter-width;
$chart-size: 70px;
$doughnut-border-size: 15px;
$doughnut-dasharray: 204;
$doughnut-dasharray: 173;
$doughnut-empty-colour: $gray-lighter;
$doughnut-fill-colour: $brand-warning;

4
theme/bootstrapbase/less/moodle/blocks.less
View File

@ -241,9 +241,9 @@
}
}
@chart-size: 80px;
@chart-size: 70px;
@doughnut-border-size: 15px;
@doughnut-dasharray: 204;
@doughnut-dasharray: 173;
@doughnut-empty-colour: @grayLighter;
@doughnut-fill-colour: @orange;

222
theme/bootstrapbase/style/moodle.css
View File

@ -15957,13 +15957,13 @@ body {
width: 100%;
}
.progress-chart-container {
height: 80px;
width: 80px;
height: 70px;
width: 70px;
}
.progress-chart-container .progress-doughnut {
position: relative;
height: 80px;
width: 80px;
height: 70px;
width: 70px;
background-clip: padding-box;
border: 15px solid #eee;
border-radius: 50%;
@ -15984,8 +15984,8 @@ body {
position: absolute;
top: -15px;
left: -15px;
height: 80px;
width: 80px;
height: 70px;
width: 70px;
}
.progress-chart-container .progress-doughnut .progress-indicator svg {
position: relative;
@ -15996,314 +15996,314 @@ body {
stroke-width: 15px;
stroke: #f89406;
fill: none;
stroke-dasharray: 204;
stroke-dashoffset: 204;
stroke-dasharray: 173;
stroke-dashoffset: 173;
transform: rotate(-90deg);
transform-origin: center center;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-1 {
stroke-dashoffset: 201.96;
stroke-dashoffset: 171.27;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-2 {
stroke-dashoffset: 199.92;
stroke-dashoffset: 169.54;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-3 {
stroke-dashoffset: 197.88;
stroke-dashoffset: 167.81;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-4 {
stroke-dashoffset: 195.84;
stroke-dashoffset: 166.08;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-5 {
stroke-dashoffset: 193.8;
stroke-dashoffset: 164.35;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-6 {
stroke-dashoffset: 191.76;
stroke-dashoffset: 162.62;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-7 {
stroke-dashoffset: 189.72;
stroke-dashoffset: 160.89;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-8 {
stroke-dashoffset: 187.68;
stroke-dashoffset: 159.16;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-9 {
stroke-dashoffset: 185.64;
stroke-dashoffset: 157.43;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-10 {
stroke-dashoffset: 183.6;
stroke-dashoffset: 155.7;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-11 {
stroke-dashoffset: 181.56;
stroke-dashoffset: 153.97;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-12 {
stroke-dashoffset: 179.52;
stroke-dashoffset: 152.24;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-13 {
stroke-dashoffset: 177.48;
stroke-dashoffset: 150.51;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-14 {
stroke-dashoffset: 175.44;
stroke-dashoffset: 148.78;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-15 {
stroke-dashoffset: 173.4;
stroke-dashoffset: 147.05;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-16 {
stroke-dashoffset: 171.36;
stroke-dashoffset: 145.32;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-17 {
stroke-dashoffset: 169.32;
stroke-dashoffset: 143.59;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-18 {
stroke-dashoffset: 167.28;
stroke-dashoffset: 141.86;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-19 {
stroke-dashoffset: 165.24;
stroke-dashoffset: 140.13;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-20 {
stroke-dashoffset: 163.2;
stroke-dashoffset: 138.4;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-21 {
stroke-dashoffset: 161.16;
stroke-dashoffset: 136.67;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-22 {
stroke-dashoffset: 159.12;
stroke-dashoffset: 134.94;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-23 {
stroke-dashoffset: 157.08;
stroke-dashoffset: 133.21;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-24 {
stroke-dashoffset: 155.04;
stroke-dashoffset: 131.48;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-25 {
stroke-dashoffset: 153;
stroke-dashoffset: 129.75;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-26 {
stroke-dashoffset: 150.96;
stroke-dashoffset: 128.02;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-27 {
stroke-dashoffset: 148.92;
stroke-dashoffset: 126.29;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-28 {
stroke-dashoffset: 146.88;
stroke-dashoffset: 124.56;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-29 {
stroke-dashoffset: 144.84;
stroke-dashoffset: 122.83;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-30 {
stroke-dashoffset: 142.8;
stroke-dashoffset: 121.1;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-31 {
stroke-dashoffset: 140.76;
stroke-dashoffset: 119.37;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-32 {
stroke-dashoffset: 138.72;
stroke-dashoffset: 117.64;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-33 {
stroke-dashoffset: 136.68;
stroke-dashoffset: 115.91;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-34 {
stroke-dashoffset: 134.64;
stroke-dashoffset: 114.18;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-35 {
stroke-dashoffset: 132.6;
stroke-dashoffset: 112.45;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-36 {
stroke-dashoffset: 130.56;
stroke-dashoffset: 110.72;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-37 {
stroke-dashoffset: 128.52;
stroke-dashoffset: 108.99;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-38 {
stroke-dashoffset: 126.48;
stroke-dashoffset: 107.26;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-39 {
stroke-dashoffset: 124.44;
stroke-dashoffset: 105.53;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-40 {
stroke-dashoffset: 122.4;
stroke-dashoffset: 103.8;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-41 {
stroke-dashoffset: 120.36;
stroke-dashoffset: 102.07;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-42 {
stroke-dashoffset: 118.32;
stroke-dashoffset: 100.34;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-43 {
stroke-dashoffset: 116.28;
stroke-dashoffset: 98.61;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-44 {
stroke-dashoffset: 114.24;
stroke-dashoffset: 96.88;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-45 {
stroke-dashoffset: 112.2;
stroke-dashoffset: 95.15;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-46 {
stroke-dashoffset: 110.16;
stroke-dashoffset: 93.42;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-47 {
stroke-dashoffset: 108.12;
stroke-dashoffset: 91.69;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-48 {
stroke-dashoffset: 106.08;
stroke-dashoffset: 89.96;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-49 {
stroke-dashoffset: 104.04;
stroke-dashoffset: 88.23;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-50 {
stroke-dashoffset: 102;
stroke-dashoffset: 86.5;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-51 {
stroke-dashoffset: 99.96;
stroke-dashoffset: 84.77;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-52 {
stroke-dashoffset: 97.92;
stroke-dashoffset: 83.04;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-53 {
stroke-dashoffset: 95.88;
stroke-dashoffset: 81.31;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-54 {
stroke-dashoffset: 93.84;
stroke-dashoffset: 79.58;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-55 {
stroke-dashoffset: 91.8;
stroke-dashoffset: 77.85;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-56 {
stroke-dashoffset: 89.76;
stroke-dashoffset: 76.12;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-57 {
stroke-dashoffset: 87.72;
stroke-dashoffset: 74.39;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-58 {
stroke-dashoffset: 85.68;
stroke-dashoffset: 72.66;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-59 {
stroke-dashoffset: 83.64;
stroke-dashoffset: 70.93;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-60 {
stroke-dashoffset: 81.6;
stroke-dashoffset: 69.2;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-61 {
stroke-dashoffset: 79.56;
stroke-dashoffset: 67.47;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-62 {
stroke-dashoffset: 77.52;
stroke-dashoffset: 65.74;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-63 {
stroke-dashoffset: 75.48;
stroke-dashoffset: 64.01;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-64 {
stroke-dashoffset: 73.44;
stroke-dashoffset: 62.28;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-65 {
stroke-dashoffset: 71.4;
stroke-dashoffset: 60.55;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-66 {
stroke-dashoffset: 69.36;
stroke-dashoffset: 58.82;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-67 {
stroke-dashoffset: 67.32;
stroke-dashoffset: 57.09;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-68 {
stroke-dashoffset: 65.28;
stroke-dashoffset: 55.36;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-69 {
stroke-dashoffset: 63.24;
stroke-dashoffset: 53.63;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-70 {
stroke-dashoffset: 61.2;
stroke-dashoffset: 51.9;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-71 {
stroke-dashoffset: 59.16;
stroke-dashoffset: 50.17;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-72 {
stroke-dashoffset: 57.12;
stroke-dashoffset: 48.44;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-73 {
stroke-dashoffset: 55.08;
stroke-dashoffset: 46.71;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-74 {
stroke-dashoffset: 53.04;
stroke-dashoffset: 44.98;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-75 {
stroke-dashoffset: 51;
stroke-dashoffset: 43.25;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-76 {
stroke-dashoffset: 48.96;
stroke-dashoffset: 41.52;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-77 {
stroke-dashoffset: 46.92;
stroke-dashoffset: 39.79;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-78 {
stroke-dashoffset: 44.88;
stroke-dashoffset: 38.06;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-79 {
stroke-dashoffset: 42.84;
stroke-dashoffset: 36.33;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-80 {
stroke-dashoffset: 40.8;
stroke-dashoffset: 34.6;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-81 {
stroke-dashoffset: 38.76;
stroke-dashoffset: 32.87;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-82 {
stroke-dashoffset: 36.72;
stroke-dashoffset: 31.14;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-83 {
stroke-dashoffset: 34.68;
stroke-dashoffset: 29.41;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-84 {
stroke-dashoffset: 32.64;
stroke-dashoffset: 27.68;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-85 {
stroke-dashoffset: 30.6;
stroke-dashoffset: 25.95;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-86 {
stroke-dashoffset: 28.56;
stroke-dashoffset: 24.22;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-87 {
stroke-dashoffset: 26.52;
stroke-dashoffset: 22.49;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-88 {
stroke-dashoffset: 24.48;
stroke-dashoffset: 20.76;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-89 {
stroke-dashoffset: 22.44;
stroke-dashoffset: 19.03;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-90 {
stroke-dashoffset: 20.4;
stroke-dashoffset: 17.3;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-91 {
stroke-dashoffset: 18.36;
stroke-dashoffset: 15.57;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-92 {
stroke-dashoffset: 16.32;
stroke-dashoffset: 13.84;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-93 {
stroke-dashoffset: 14.28;
stroke-dashoffset: 12.11;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-94 {
stroke-dashoffset: 12.24;
stroke-dashoffset: 10.38;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-95 {
stroke-dashoffset: 10.2;
stroke-dashoffset: 8.65;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-96 {
stroke-dashoffset: 8.16;
stroke-dashoffset: 6.92;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-97 {
stroke-dashoffset: 6.12;
stroke-dashoffset: 5.19;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-98 {
stroke-dashoffset: 4.08;
stroke-dashoffset: 3.46;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-99 {
stroke-dashoffset: 2.04;
stroke-dashoffset: 1.73;
}
.progress-chart-container .progress-doughnut .progress-indicator svg .circle.percent-100 {
stroke-dashoffset: 0;
}
.progress-chart-container .no-progress {
height: 80px;
width: 80px;
height: 70px;
width: 70px;
background-color: #eee;
border-radius: 50%;
position: relative;
@ -16317,8 +16317,8 @@ body {
margin: 0;
transform: translate(-45%, -45%);
color: #fff;
height: 40px;
width: 40px;
height: 35px;
width: 35px;
}
.block_myoverview .event-list-item .event-icon {
vertical-align: middle;