L-electron-Rare/moodle
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

MDL-57585 block_myoverview: responsive layout for course summary

Browse Source 
This is for the 'Sort by courses' view.

Part of MDL-55611 epic.
This commit is contained in:
Barbara Ramiro
2017-04-03 11:37:06 +08:00
committed by Damyon Wiese
parent 90b030461f
commit ff582ae512
3 changed files with 28 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files
blocks/myoverview/templates/course-summary.mustache
+26 -14
View File
@@ -28,20 +28,32 @@
"summary": "It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout."
}
}}
<div class="d-inline-block m-x-1">
<div class="course-info-container" id="course-info-container-{{id}}">
<div class="row m-b-1">
{{> block_myoverview/progress-chart}}
</div>
<div class="row m-b-1">
<h3><a href="{{viewurl}}">{{fullnamedisplay}}</a></h3>
</div>
<div class="row text-muted m-b-1">
{{#userdate}}{{startdate}}, {{#str}}strftimedate, langconfig{{/str}}{{/userdate}} -
{{#userdate}}{{enddate}}, {{#str}}strftimedate, langconfig{{/str}}{{/userdate}}
</div>
<div class="row text-muted">
{{#shortentext}} 140, {{{summary}}}{{/shortentext}}
<div class="course-info-container" id="course-info-container-{{id}}">
<div class="hidden-sm-up">
{{> block_myoverview/progress-chart}}
<h4 class="h5"><a href="{{viewurl}}">{{fullnamedisplay}}</a></h4>
</div>
<div class="hidden-sm-down">
{{> block_myoverview/progress-chart}}
<h4 class="h5"><a href="{{viewurl}}">{{fullnamedisplay}}</a></h4>
</div>
<div class="hidden-xs-down hidden-md-up">
<div class="media">
<div class="media-left">
<div class="media-object">
{{> block_myoverview/progress-chart}}
</div>
</div>
<div class="media-body">
<h4 class="h5"><a href="{{viewurl}}">{{fullnamedisplay}}</a></h4>
</div>
</div>
</div>
<p class="text-muted">
{{#userdate}}{{startdate}}, {{#str}}strftimedate, langconfig{{/str}}{{/userdate}} -
{{#userdate}}{{enddate}}, {{#str}}strftimedate, langconfig{{/str}}{{/userdate}}
</p>
<p class="text-muted">
{{#shortentext}} 140, {{{summary}}}{{/shortentext}}
</p>
</div>
blocks/myoverview/templates/progress-chart.mustache
+1 -1
View File
@@ -24,7 +24,7 @@
"progress": "60",
}
}}
<div class="progress-chart-container">
<div class="progress-chart-container m-b-1">
{{#hasprogress}}
<div class="progress-doughnut">
<div class="progress-text {{#progress}}has-percent{{/progress}}">{{progress}}&#37;</div>
theme/boost/scss/moodle/blocks.scss
+1 -1
View File
@@ -71,7 +71,7 @@ $blocks-plus-gutter: $blocks-column-width + $grid-gutter-width;
}
}
$chart-size: 80px;
$chart-size: 70px;
$doughnut-border-size: 15px;
$doughnut-dasharray: 204;
$doughnut-empty-colour: $gray-lighter;