diff --git a/course/classes/management_renderer.php b/course/classes/management_renderer.php index 162a68de549..6370b818200 100644 --- a/course/classes/management_renderer.php +++ b/course/classes/management_renderer.php @@ -208,17 +208,18 @@ class core_course_management_renderer extends plugin_renderer_base { } $courseicon = $this->output->pix_icon('i/course', get_string('courses')); $bcatinput = array( + 'id' => 'categorylistitem' . $category->id, 'type' => 'checkbox', 'name' => 'bcat[]', 'value' => $category->id, - 'class' => 'bulk-action-checkbox', - 'aria-label' => get_string('bulkactionselect', 'moodle', $text), + 'class' => 'bulk-action-checkbox custom-control-input', 'data-action' => 'select' ); + $checkboxclass = ''; if (!$category->can_resort_subcategories() && !$category->has_manage_capability()) { // Very very hardcoded here. - $bcatinput['style'] = 'visibility:hidden'; + $checkboxclass = 'd-none'; } $viewcaturl = new moodle_url('/course/management.php', array('categoryid' => $category->id)); @@ -260,8 +261,14 @@ class core_course_management_renderer extends plugin_renderer_base { $html = html_writer::start_tag('li', $attributes); $html .= html_writer::start_div('clearfix'); - $html .= html_writer::start_div('float-left ba-checkbox'); - $html .= html_writer::empty_tag('input', $bcatinput).' '; + $html .= html_writer::start_div('float-left ' . $checkboxclass); + $html .= html_writer::start_div('custom-control custom-checkbox mr-1 '); + $html .= html_writer::empty_tag('input', $bcatinput); + $html .= html_writer::tag('label', '', array( + 'aria-label' => get_string('bulkactionselect', 'moodle', $text), + 'class' => 'custom-control-label', + 'for' => 'categorylistitem' . $category->id)); + $html .= html_writer::end_div(); $html .= html_writer::end_div(); $html .= $icon; if ($hasactions) { @@ -275,7 +282,7 @@ class core_course_management_renderer extends plugin_renderer_base { $html .= html_writer::link($viewcaturl, $text, $textattributes); $html .= html_writer::start_div('float-right d-flex'); if ($category->idnumber) { - $html .= html_writer::tag('span', s($category->idnumber), array('class' => 'dimmed idnumber')); + $html .= html_writer::tag('span', s($category->idnumber), array('class' => 'text-muted idnumber')); } if ($hasactions) { $html .= $this->category_listitem_actions($category, $actions); @@ -285,7 +292,7 @@ class core_course_management_renderer extends plugin_renderer_base { html_writer::span($category->get_courses_count()) . html_writer::span(get_string('courses'), 'accesshide', array('id' => $countid)) . $courseicon, - 'course-count dimmed', + 'course-count text-muted', array('aria-labelledby' => $countid) ); $html .= html_writer::end_div(); @@ -574,7 +581,7 @@ class core_course_management_renderer extends plugin_renderer_base { $a->total = $totalcourses; $str = get_string('showingxofycourses', 'moodle', $a); } - $html .= html_writer::div($str, 'listing-pagination-totals dimmed'); + $html .= html_writer::div($str, 'listing-pagination-totals text-muted'); } if ($viewmode !== 'default') { @@ -609,16 +616,18 @@ class core_course_management_renderer extends plugin_renderer_base { ); $bulkcourseinput = array( + 'id' => 'courselistitem' . $course->id, 'type' => 'checkbox', 'name' => 'bc[]', 'value' => $course->id, - 'class' => 'bulk-action-checkbox', - 'aria-label' => get_string('bulkactionselect', 'moodle', $text), + 'class' => 'bulk-action-checkbox custom-control-input', 'data-action' => 'select' ); + + $checkboxclass = ''; if (!$category->has_manage_capability()) { // Very very hardcoded here. - $bulkcourseinput['style'] = 'visibility:hidden'; + $checkboxclass = 'd-none'; } $viewcourseurl = new moodle_url($this->page->url, array('courseid' => $course->id)); @@ -631,13 +640,19 @@ class core_course_management_renderer extends plugin_renderer_base { $html .= html_writer::div($this->output->pix_icon('i/move_2d', get_string('dndcourse')), 'float-left drag-handle'); } - $html .= html_writer::start_div('ba-checkbox float-left'); - $html .= html_writer::empty_tag('input', $bulkcourseinput).' '; + $html .= html_writer::start_div('float-left ' . $checkboxclass); + $html .= html_writer::start_div('custom-control custom-checkbox mr-1 '); + $html .= html_writer::empty_tag('input', $bulkcourseinput); + $html .= html_writer::tag('label', '', array( + 'aria-label' => get_string('bulkactionselect', 'moodle', $text), + 'class' => 'custom-control-label', + 'for' => 'courselistitem' . $course->id)); + $html .= html_writer::end_div(); $html .= html_writer::end_div(); $html .= html_writer::link($viewcourseurl, $text, array('class' => 'float-left coursename')); $html .= html_writer::start_div('float-right'); if ($course->idnumber) { - $html .= html_writer::tag('span', s($course->idnumber), array('class' => 'dimmed idnumber')); + $html .= html_writer::tag('span', s($course->idnumber), array('class' => 'text-muted idnumber')); } $html .= $this->course_listitem_actions($category, $course); $html .= html_writer::end_div(); @@ -1123,7 +1138,7 @@ class core_course_management_renderer extends plugin_renderer_base { $a->total = $totalcourses; $str = get_string('showingxofycourses', 'moodle', $a); } - $html .= html_writer::div($str, 'listing-pagination-totals dimmed'); + $html .= html_writer::div($str, 'listing-pagination-totals text-muted'); } if ($totalcourses < $perpage) { @@ -1186,10 +1201,10 @@ class core_course_management_renderer extends plugin_renderer_base { if (core_course_category::get($course->category)->can_move_courses_out_of()) { $bulkcourseinput = array( 'type' => 'checkbox', + 'id' => 'coursesearchlistitem' . $course->id, 'name' => 'bc[]', 'value' => $course->id, - 'class' => 'bulk-action-checkbox', - 'aria-label' => get_string('bulkactionselect', 'moodle', $text), + 'class' => 'bulk-action-checkbox custom-control-input', 'data-action' => 'select' ); } @@ -1200,14 +1215,20 @@ class core_course_management_renderer extends plugin_renderer_base { $html .= html_writer::start_div('clearfix'); $html .= html_writer::start_div('float-left'); if ($bulkcourseinput) { - $html .= html_writer::empty_tag('input', $bulkcourseinput).' '; + $html .= html_writer::start_div('custom-control custom-checkbox mr-1'); + $html .= html_writer::empty_tag('input', $bulkcourseinput); + $html .= html_writer::tag('label', '', array( + 'aria-label' => get_string('bulkactionselect', 'moodle', $text), + 'class' => 'custom-control-label', + 'for' => 'coursesearchlistitem' . $course->id)); + $html .= html_writer::end_div(); } $html .= html_writer::end_div(); $html .= html_writer::link($viewcourseurl, $text, array('class' => 'float-left coursename')); - $html .= html_writer::tag('span', $categoryname, array('class' => 'float-left categoryname')); + $html .= html_writer::tag('span', $categoryname, array('class' => 'float-left ml-3 text-muted')); $html .= html_writer::start_div('float-right'); $html .= $this->search_listitem_actions($course); - $html .= html_writer::tag('span', s($course->idnumber), array('class' => 'dimmed idnumber')); + $html .= html_writer::tag('span', s($course->idnumber), array('class' => 'text-muted idnumber')); $html .= html_writer::end_div(); $html .= html_writer::end_div(); $html .= html_writer::end_tag('li'); diff --git a/theme/boost/scss/moodle/course.scss b/theme/boost/scss/moodle/course.scss index 24a9585af57..3168d3b4bca 100644 --- a/theme/boost/scss/moodle/course.scss +++ b/theme/boost/scss/moodle/course.scss @@ -849,10 +849,8 @@ span.editinstructions { .listitem { &[data-selected='1'] { - background-color: $table-bg-accent; - &:hover { - background-color: $table-bg-hover; - } + border-left: calc(#{$list-group-border-width} + 5px) solid map-get($theme-colors, 'info'); + padding-left: calc(#{$list-group-item-padding-x} - 5px); } } @@ -899,7 +897,6 @@ span.editinstructions { } .idnumber { - color: #a1a1a8; margin-right: 2em; } } @@ -964,25 +961,6 @@ span.editinstructions { } .listitem { - > div { - > .ba-checkbox { - width: 2.2em; - text-align: center; - margin: -1px 0.5em 0 0; - padding-top: 2px; - } - } - - &.highlight > div > .ba-checkbox { - background-color: $table-bg-hover; - } - - &[data-selected='1'] > div > .ba-checkbox { - margin: 0 0.5em 0 0; - padding: 0; - background-color: inherit; - } - &:first-child > div .item-actions .action-moveup, &:last-child > div .item-actions .action-movedown { display: none; diff --git a/theme/boost/style/moodle.css b/theme/boost/style/moodle.css index 10bace69884..8da4def6e47 100644 --- a/theme/boost/style/moodle.css +++ b/theme/boost/style/moodle.css @@ -13296,9 +13296,8 @@ span.editinstructions { #course-category-listings ul.ml ul.ml { margin: 0; } #course-category-listings .listitem[data-selected='1'] { - background-color: rgba(0, 0, 0, 0.05); } - #course-category-listings .listitem[data-selected='1']:hover { - background-color: rgba(0, 0, 0, 0.075); } + border-left: calc(1px + 5px) solid #5bc0de; + padding-left: calc(1.25rem - 5px); } #course-category-listings .item-actions { margin-right: 1em; display: inline-block; } @@ -13319,7 +13318,6 @@ span.editinstructions { #course-category-listings .listitem > div .without-actions { color: #333; } #course-category-listings .listitem > div .idnumber { - color: #a1a1a8; margin-right: 2em; } #course-category-listings .listitem[data-visible="0"] > div .item-actions .action-show { display: inline; } @@ -13344,17 +13342,6 @@ span.editinstructions { margin: -2px 6px 0 0; } #course-category-listings #category-listing .listitem.collapsed > ul.ml { display: none; } - #course-category-listings #category-listing .listitem > div > .ba-checkbox { - width: 2.2em; - text-align: center; - margin: -1px 0.5em 0 0; - padding-top: 2px; } - #course-category-listings #category-listing .listitem.highlight > div > .ba-checkbox { - background-color: rgba(0, 0, 0, 0.075); } - #course-category-listings #category-listing .listitem[data-selected='1'] > div > .ba-checkbox { - margin: 0 0.5em 0 0; - padding: 0; - background-color: inherit; } #course-category-listings #category-listing .listitem:first-child > div .item-actions .action-moveup, #course-category-listings #category-listing .listitem:last-child > div .item-actions .action-movedown { display: none; } diff --git a/theme/classic/style/moodle.css b/theme/classic/style/moodle.css index abe5d58a32c..6b03d51fd4b 100644 --- a/theme/classic/style/moodle.css +++ b/theme/classic/style/moodle.css @@ -13538,9 +13538,8 @@ span.editinstructions { #course-category-listings ul.ml ul.ml { margin: 0; } #course-category-listings .listitem[data-selected='1'] { - background-color: rgba(0, 0, 0, 0.05); } - #course-category-listings .listitem[data-selected='1']:hover { - background-color: rgba(0, 0, 0, 0.075); } + border-left: calc(1px + 5px) solid #5bc0de; + padding-left: calc(1.25rem - 5px); } #course-category-listings .item-actions { margin-right: 1em; display: inline-block; } @@ -13561,7 +13560,6 @@ span.editinstructions { #course-category-listings .listitem > div .without-actions { color: #333; } #course-category-listings .listitem > div .idnumber { - color: #a1a1a8; margin-right: 2em; } #course-category-listings .listitem[data-visible="0"] > div .item-actions .action-show { display: inline; } @@ -13586,17 +13584,6 @@ span.editinstructions { margin: -2px 6px 0 0; } #course-category-listings #category-listing .listitem.collapsed > ul.ml { display: none; } - #course-category-listings #category-listing .listitem > div > .ba-checkbox { - width: 2.2em; - text-align: center; - margin: -1px 0.5em 0 0; - padding-top: 2px; } - #course-category-listings #category-listing .listitem.highlight > div > .ba-checkbox { - background-color: rgba(0, 0, 0, 0.075); } - #course-category-listings #category-listing .listitem[data-selected='1'] > div > .ba-checkbox { - margin: 0 0.5em 0 0; - padding: 0; - background-color: inherit; } #course-category-listings #category-listing .listitem:first-child > div .item-actions .action-moveup, #course-category-listings #category-listing .listitem:last-child > div .item-actions .action-movedown { display: none; }