Skip to content

Commit

Permalink
MDL-58251 block_myoverview: style courses view on clean theme
Browse files Browse the repository at this point in the history
Part of MDL-55611 epic.
  • Loading branch information
ryanwyllie authored and Damyon Wiese committed Apr 3, 2017
1 parent fece943 commit 6ef2ceb
Show file tree
Hide file tree
Showing 6 changed files with 93 additions and 25 deletions.
6 changes: 3 additions & 3 deletions blocks/myoverview/templates/course-summary.mustache
Expand Up @@ -29,15 +29,15 @@
}
}}
<div class="course-info-container" id="course-info-container-{{id}}">
<div class="hidden-sm-up">
<div class="hidden-sm-up hidden-tablet hidden-phone">
{{> block_myoverview/progress-chart}}
<h4 class="h5"><a href="{{viewurl}}">{{fullnamedisplay}}</a></h4>
</div>
<div class="hidden-sm-down">
<div class="hidden-sm-down hidden-tablet hidden-desktop">
{{> block_myoverview/progress-chart}}
<h4 class="h5"><a href="{{viewurl}}">{{fullnamedisplay}}</a></h4>
</div>
<div class="hidden-xs-down hidden-md-up">
<div class="hidden-xs-down hidden-md-up visible-tablet">
<div class="media">
<div class="media-left">
<div class="media-object">
Expand Down
4 changes: 2 additions & 2 deletions blocks/myoverview/templates/courses-view-course-item.mustache
Expand Up @@ -31,11 +31,11 @@
<div class="col-lg-6 col-xl-4">
<div class="card m-b-1">
<div class="card-block course-info-container" id="course-info-container-{{id}}">
<div class="hidden-sm-up">
<div class="hidden-sm-up hidden-phone">
{{> block_myoverview/progress-chart}}
<h4 class="h5"><a href="{{viewurl}}">{{fullnamedisplay}}</a></h4>
</div>
<div class="hidden-xs-down">
<div class="hidden-xs-down visible-phone">
<div class="media">
<div class="media-left">
<div class="media-object">
Expand Down
3 changes: 0 additions & 3 deletions blocks/myoverview/templates/paging-bar-item.mustache
Expand Up @@ -32,9 +32,6 @@
data-region="page-link">
{{$item-content}}
{{{page}}}
{{#active}}
<span class="sr-only">{{#str}}currentinparentheses, theme_boost{{/str}}</span>
{{/active}}
{{/item-content}}
</a>
</li>
2 changes: 1 addition & 1 deletion blocks/myoverview/templates/paging-content-item.mustache
Expand Up @@ -25,7 +25,7 @@
}}
<div data-region="paging-content-item"
data-page="{{page}}"
class="row {{#active}}active{{/active}}{{^active}}hidden{{/active}}">
class="{{#active}}active{{/active}}{{^active}}hidden{{/active}}">
{{$content}}
{{{content}}}
{{/content}}
Expand Down
32 changes: 16 additions & 16 deletions theme/bootstrapbase/templates/block_myoverview/main.mustache
Expand Up @@ -23,28 +23,28 @@
{}
}}

<div id="block-myoverview-{{uniqid}}" class="block-myoverview container-fluid" data-region="myoverview">
<div class="row">
<ul class="nav nav-tabs" role="tablist">
<li class="nav-item active">
<a class="nav-link" href="#myoverview_timeline_view" role="tab" data-toggle="tab">
{{#str}} timeline, block_myoverview {{/str}}
</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#myoverview_courses_view" role="tab" data-toggle="tab">
{{#str}} courses {{/str}}
</a>
</li>
</ul>
</div>
<div id="block-myoverview-{{uniqid}}" class="block-myoverview" data-region="myoverview">
<ul class="nav nav-tabs" role="tablist">
<li class="nav-item active">
<a class="nav-link" href="#myoverview_timeline_view" role="tab" data-toggle="tab">
{{#str}} timeline, block_myoverview {{/str}}
</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#myoverview_courses_view" role="tab" data-toggle="tab">
{{#str}} courses {{/str}}
</a>
</li>
</ul>

<div class="tab-content">
<div role="tabpanel" class="tab-pane fade in active" id="myoverview_timeline_view">
{{> block_myoverview/timeline-view }}
</div>
<div role="tabpanel" class="tab-pane fade" id="myoverview_courses_view">
{{> block_myoverview/courses-view }}
{{#coursesview}}
{{> block_myoverview/courses-view }}
{{/coursesview}}
</div>
</div>
</div>
71 changes: 71 additions & 0 deletions theme/bootstrapbase/templates/block_myoverview/paging-bar.mustache
@@ -0,0 +1,71 @@
{{!
This file is part of Moodle - http://moodle.org/
Moodle is free software: you can redistribute it and/or modify
it under the terms of the GNU General Public License as published by
the Free Software Foundation, either version 3 of the License, or
(at your option) any later version.
Moodle is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
GNU General Public License for more details.
You should have received a copy of the GNU General Public License
along with Moodle. If not, see <http://www.gnu.org/licenses/>.
}}
{{!
@template block_myoverview/paging-bar
This template renders the each course block containing a summary and calendar events.
Example context (json):
{
}
}}
{{#pagingbar}}
<div aria-label="{{label}}"
id="{{$pagingbarid}}paging-bar-{{uniqid}}{{/pagingbarid}}"
class="pagination"
data-region="paging-bar"
data-page-count="{{pagecount}}">

<ul>
{{#previous}}
{{< block_myoverview/paging-bar-item }}
{{$item-content}}
<span aria-hidden="true">&laquo;</span>
<span class="sr-only">{{#str}}previous{{/str}}</span>
{{/item-content}}
{{/ block_myoverview/paging-bar-item }}
{{/previous}}
{{#first}}
{{< block_myoverview/paging-bar-item }}
{{$pagenumber}}first{{/pagenumber}}
{{/ block_myoverview/paging-bar-item }}
{{/first}}
{{#pages}}
{{> block_myoverview/paging-bar-item }}
{{/pages}}
{{#last}}
{{< block_myoverview/paging-bar-item }}
{{$pagenumber}}last{{/pagenumber}}
{{/ block_myoverview/paging-bar-item }}
{{/last}}
{{#next}}
{{< block_myoverview/paging-bar-item }}
{{$item-content}}
<span aria-hidden="true">&raquo;</span>
<span class="sr-only">{{#str}}next{{/str}}</span>
{{/item-content}}
{{/ block_myoverview/paging-bar-item }}
{{/next}}
</ul>
</div>
{{#js}}
require(['jquery', 'block_myoverview/paging_bar'], function($, PagingBar) {
var root = $('#{{$pagingbarid}}paging-bar-{{uniqid}}{{/pagingbarid}}');
PagingBar.registerEventListeners(root);
});
{{/js}}
{{/pagingbar}}

0 comments on commit 6ef2ceb

Please sign in to comment.