From 5b76eb6900e34ab163d53ec0ffaefe5418a459e4 Mon Sep 17 00:00:00 2001 From: Bas Brands Date: Tue, 23 Nov 2021 15:53:18 +0100 Subject: [PATCH] MDL-71291 theme_boost: minimal frontpage styling tweaks --- course/renderer.php | 25 ++- .../moodle-course-categoryexpander-debug.js | 2 +- .../moodle-course-categoryexpander-min.js | 2 +- .../moodle-course-categoryexpander.js | 2 +- .../categoryexpander/js/categoryexpander.js | 2 +- theme/boost/scss/moodle/course.scss | 161 ++++++------------ theme/boost/style/moodle.css | 128 +++++--------- theme/classic/style/moodle.css | 128 +++++--------- 8 files changed, 146 insertions(+), 304 deletions(-) diff --git a/course/renderer.php b/course/renderer.php index 1366e78c297..363001e91ee 100644 --- a/course/renderer.php +++ b/course/renderer.php @@ -1191,8 +1191,8 @@ class core_course_renderer extends plugin_renderer_base { $rolenames = array_map(function ($role) { return $role->displayname; }, $coursecontact['roles']); - $name = implode(", ", $rolenames).': '. - html_writer::link(new moodle_url('/user/view.php', + $name = html_writer::tag('span', implode(", ", $rolenames).': ', ['class' => 'font-weight-bold']); + $name .= html_writer::link(new moodle_url('/user/view.php', ['id' => $coursecontact['user']->id, 'course' => SITEID]), $coursecontact['username']); $content .= html_writer::tag('li', $name); @@ -1246,8 +1246,8 @@ class core_course_renderer extends plugin_renderer_base { if ($chelper->get_show_courses() == self::COURSECAT_SHOW_COURSES_EXPANDED_WITH_CAT) { if ($cat = core_course_category::get($course->category, IGNORE_MISSING)) { $content .= html_writer::start_tag('div', ['class' => 'coursecat']); - $content .= get_string('category').': '. - html_writer::link(new moodle_url('/course/index.php', ['categoryid' => $cat->id]), + $content .= html_writer::tag('span', get_string('category').': ', ['class' => 'font-weight-bold']); + $content .= html_writer::link(new moodle_url('/course/index.php', ['categoryid' => $cat->id]), $cat->get_formatted_name(), ['class' => $cat->visible ? '' : 'dimmed']); $content .= html_writer::end_tag('div'); } @@ -1287,11 +1287,15 @@ class core_course_renderer extends plugin_renderer_base { if ($course instanceof stdClass) { $course = new core_course_list_element($course); } - $content = $this->course_summary($chelper, $course); + $content = \html_writer::start_tag('div', ['class' => 'd-flex']); $content .= $this->course_overview_files($course); + $content .= \html_writer::start_tag('div', ['class' => 'flex-grow-1']); + $content .= $this->course_summary($chelper, $course); $content .= $this->course_contacts($course); $content .= $this->course_category_name($chelper, $course); $content .= $this->course_custom_fields($course); + $content .= \html_writer::end_tag('div'); + $content .= \html_writer::end_tag('div'); return $content; } @@ -1348,8 +1352,11 @@ class core_course_renderer extends plugin_renderer_base { } else if ($viewmoreurl = $chelper->get_courses_display_option('viewmoreurl')) { // the option for 'View more' link was specified, display more link $viewmoretext = $chelper->get_courses_display_option('viewmoretext', new lang_string('viewmore')); - $morelink = html_writer::tag('div', html_writer::link($viewmoreurl, $viewmoretext), - array('class' => 'paging paging-morelink')); + $morelink = html_writer::tag( + 'div', + html_writer::link($viewmoreurl, $viewmoretext, ['class' => 'btn btn-secondary']), + ['class' => 'paging paging-morelink'] + ); } } else if (($totalcount > $CFG->coursesperpage) && $paginationurl && $paginationallowall) { // there are more than one page of results and we are in 'view all' mode, suggest to go back to paginated view mode @@ -1684,7 +1691,7 @@ class core_course_renderer extends plugin_renderer_base { $output .= html_writer::start_tag('div', array('class' => 'categorypicker')); $select = new single_select(new moodle_url('/course/index.php'), 'categoryid', core_course_category::make_categories_list(), $coursecat->id, null, 'switchcategory'); - $select->set_label(get_string('categories').':'); + $select->set_label(get_string('categories').':', ['class' => 'sr-only']); $output .= $this->render($select); $output .= html_writer::end_tag('div'); // .categorypicker } @@ -1943,7 +1950,7 @@ class core_course_renderer extends plugin_renderer_base { $output = ''; $output .= html_writer::start_tag('div', array('class' => 'coursebox remotecoursebox clearfix')); $output .= html_writer::start_tag('div', array('class' => 'info')); - $output .= html_writer::start_tag('h3', array('class' => 'name')); + $output .= html_writer::start_tag('h3', array('class' => 'coursename')); $output .= html_writer::link($url, format_string($course->fullname), array('title' => get_string('entercourse'))); $output .= html_writer::end_tag('h3'); // .name $output .= html_writer::tag('div', '', array('class' => 'moreinfo')); diff --git a/course/yui/build/moodle-course-categoryexpander/moodle-course-categoryexpander-debug.js b/course/yui/build/moodle-course-categoryexpander/moodle-course-categoryexpander-debug.js index e4f866cc737..50bfde0dbde 100644 --- a/course/yui/build/moodle-course-categoryexpander/moodle-course-categoryexpander-debug.js +++ b/course/yui/build/moodle-course-categoryexpander/moodle-course-categoryexpander-debug.js @@ -36,7 +36,7 @@ var CSS = { COLLAPSEEXPAND: '.collapseexpand', COURSEBOX: '.coursebox', COURSEBOXLISTENLINK: '.coursebox .moreinfo', - COURSEBOXSPINNERLOCATION: '.coursename a', + COURSEBOXSPINNERLOCATION: '.info .moreinfo', COURSECATEGORYTREE: '.course_category_tree', PARENTWITHCHILDREN: '.category' }, diff --git a/course/yui/build/moodle-course-categoryexpander/moodle-course-categoryexpander-min.js b/course/yui/build/moodle-course-categoryexpander/moodle-course-categoryexpander-min.js index d179445dcd9..5026add5ec8 100644 --- a/course/yui/build/moodle-course-categoryexpander/moodle-course-categoryexpander-min.js +++ b/course/yui/build/moodle-course-categoryexpander/moodle-course-categoryexpander-min.js @@ -1 +1 @@ -YUI.add("moodle-course-categoryexpander",function(i,e){var a="collapse-all",t="disabled",l="loaded",r="notloaded",s="collapsed",c="with_children",o=".with_children",d=".with_children.loaded",p=".content",n=".category .info .categoryname",g=".categoryname",_=".category.with_children.collapsed",u=".category.with_children.loaded.collapsed",h=".category.with_children.loaded:not(.collapsed)",x=".collapseexpand",f=".coursebox",y=".coursebox .moreinfo",m=".coursename a",v=".course_category_tree",b=".category",C=i.namespace("Moodle.course.categoryexpander"),w=M.cfg.wwwroot+"/course/category.ajax.php";C.init=function(){var e=i.one(i.config.doc);e.delegate("click",this.toggle_category_expansion,n,this),e.delegate("click",this.toggle_coursebox_expansion,y,this),e.delegate("click",this.collapse_expand_all,x,this),e.once("key",this.setup_keyboard_listeners,"tab",this)},C.setup_keyboard_listeners=function(){i.one(i.config.doc).all(n,y,x).setAttribute("tabindex","0"),i.one(i.config.doc).delegate("key",this.toggle_category_expansion,"enter",n,this),i.one(i.config.doc).delegate("key",this.toggle_coursebox_expansion,"enter",y,this),i.one(i.config.doc).delegate("key",this.collapse_expand_all,"enter",x,this)},C.expand_category=function(e){i.use("io-base","json-parse","moodle-core-notification","anim-node-plugin",function(){C.expand_category=C._expand_category,C.expand_category(e)})},C._expand_category=function(e){var n,o;e.hasClass(c)&&(e.hasClass(l)?this.run_expansion(e):(n=e.getData("categoryid"),o=e.getData("depth"),void 0!==n&&void 0!==o&&this._toggle_generic_expansion({parentnode:e,childnode:e.one(p),spinnerhandle:g,data:{categoryid:n,depth:o,showcourses:e.getData("showcourses"),type:0}})))},C.toggle_category_expansion=function(e){i.use("io-base","json-parse","moodle-core-notification","anim-node-plugin",function(){C.toggle_category_expansion=C._toggle_category_expansion,C.toggle_category_expansion(e)})},C.toggle_coursebox_expansion=function(e){i.use("io-base","json-parse","moodle-core-notification","anim-node-plugin",function(){C.toggle_coursebox_expansion=C._toggle_coursebox_expansion,C.toggle_coursebox_expansion(e)}),e.preventDefault()},C._toggle_coursebox_expansion=function(e){var n;n=e.target.ancestor(f,!0),e.preventDefault(),n.hasClass(l)?this.run_expansion(n):this._toggle_generic_expansion({parentnode:n,childnode:n.one(p),spinnerhandle:m,data:{courseid:n.getData("courseid"),type:1}})},C._toggle_category_expansion=function(e){var n,o,a;e.target.test("a")||e.target.test("img")||(n=e.target.ancestor(b,!0)).hasClass(c)&&(n.hasClass(l)?this.run_expansion(n):(o=n.getData("categoryid"),a=n.getData("depth"),void 0!==o&&void 0!==a&&this._toggle_generic_expansion({parentnode:n,childnode:n.one(p),spinnerhandle:g,data:{categoryid:o,depth:a,showcourses:n.getData("showcourses"),type:0}})))},C._toggle_generic_expansion=function(e){var n;e.spinnerhandle&&(n=M.util.add_spinner(i,e.parentnode.one(e.spinnerhandle)).show()),i.io(w,{method:"POST",context:this,on:{complete:this.process_results},data:e.data,arguments:{parentnode:e.parentnode,childnode:e.childnode,spinner:n}})},C.run_expansion=function(e){var n=e.one(p),o=this,a=e.ancestor(v);this.add_animation(n),e.hasClass(s)?(n.setStyle("height","0"),e.removeClass(s),e.setAttribute("aria-expanded","true"),n.fx.set("reverse",!1)):(n.fx.set("reverse",!0),n.fx.once("end",function(e,n){n.addClass(s),n.setAttribute("aria-expanded","false")},this,e)),n.fx.once("end",function(e,n){n.setStyles({height:"",opacity:""}),this.destroy(),o.update_collapsible_actions(a)},n.fx,n),n.fx.run()},C.collapse_expand_all=function(e){i.use("io-base","json-parse","moodle-core-notification","anim-node-plugin",function(){C.collapse_expand_all=C._collapse_expand_all,C.collapse_expand_all(e)}),e.preventDefault()},C._collapse_expand_all=function(e){var n;e.preventDefault(),e.currentTarget.hasClass(t)||(n=e.currentTarget.ancestor(v))&&(n.one(x).hasClass(a)?this.collapse_all(n):this.expand_all(n),this.update_collapsible_actions(n))},C.expand_all=function(e){var n=[];e.all(_).each(function(e){e.ancestor(_)?(e.removeClass(s),e.all(o).removeClass(s)):n.push(e)},this),i.all(n).each(function(e){this.expand_category(e)},this)},C.collapse_all=function(e){var n=[];e.all(h).each(function(e){e.ancestor(h)?n.push(e):this.run_expansion(e)},this),i.all(n).each(function(e){e.addClass(s),e.all(d).addClass(s)},this)},C.update_collapsible_actions=function(e){var n=!1,o=e.one(x);o&&(e.all(h).each(function(e){return!e.ancestor(u)&&(n=!0)}),n?o.setHTML(M.util.get_string("collapseall","moodle")).addClass(a).removeClass(t):o.setHTML(M.util.get_string("expandall","moodle")).removeClass(a).removeClass(t))},C.process_results=function(e,n,o){var a,t;try{if((t=i.JSON.parse(n.responseText)).error)return new M.core.ajaxException(t)}catch(s){return new M.core.exception(s)}a=i.Node.create(t),o.childnode.appendChild(a),o.parentnode.addClass(l).removeClass(r),this.run_expansion(o.parentnode),o.spinner&&o.spinner.hide().destroy()},C.add_animation=function(e){return"undefined"!=typeof e.fx||e.plug(i.Plugin.NodeFX,{from:{height:0,opacity:0},to:{height:function(e){return e.get("scrollHeight")},opacity:1},duration:.2}),e}},"@VERSION@",{requires:["node","event-key"]}); \ No newline at end of file +YUI.add("moodle-course-categoryexpander",function(i,e){var a="collapse-all",t="disabled",l="loaded",r="notloaded",s="collapsed",c="with_children",n=".with_children",d=".with_children.loaded",p=".content",o=".category .info .categoryname",g=".categoryname",_=".category.with_children.collapsed",h=".category.with_children.loaded.collapsed",u=".category.with_children.loaded:not(.collapsed)",x=".collapseexpand",f=".coursebox",y=".coursebox .moreinfo",m=".info .moreinfo",v=".course_category_tree",b=".category",C=i.namespace("Moodle.course.categoryexpander"),w=M.cfg.wwwroot+"/course/category.ajax.php";C.init=function(){var e=i.one(i.config.doc);e.delegate("click",this.toggle_category_expansion,o,this),e.delegate("click",this.toggle_coursebox_expansion,y,this),e.delegate("click",this.collapse_expand_all,x,this),e.once("key",this.setup_keyboard_listeners,"tab",this)},C.setup_keyboard_listeners=function(){i.one(i.config.doc).all(o,y,x).setAttribute("tabindex","0"),i.one(i.config.doc).delegate("key",this.toggle_category_expansion,"enter",o,this),i.one(i.config.doc).delegate("key",this.toggle_coursebox_expansion,"enter",y,this),i.one(i.config.doc).delegate("key",this.collapse_expand_all,"enter",x,this)},C.expand_category=function(e){i.use("io-base","json-parse","moodle-core-notification","anim-node-plugin",function(){C.expand_category=C._expand_category,C.expand_category(e)})},C._expand_category=function(e){var o,n;e.hasClass(c)&&(e.hasClass(l)?this.run_expansion(e):(o=e.getData("categoryid"),n=e.getData("depth"),void 0!==o&&void 0!==n&&this._toggle_generic_expansion({parentnode:e,childnode:e.one(p),spinnerhandle:g,data:{categoryid:o,depth:n,showcourses:e.getData("showcourses"),type:0}})))},C.toggle_category_expansion=function(e){i.use("io-base","json-parse","moodle-core-notification","anim-node-plugin",function(){C.toggle_category_expansion=C._toggle_category_expansion,C.toggle_category_expansion(e)})},C.toggle_coursebox_expansion=function(e){i.use("io-base","json-parse","moodle-core-notification","anim-node-plugin",function(){C.toggle_coursebox_expansion=C._toggle_coursebox_expansion,C.toggle_coursebox_expansion(e)}),e.preventDefault()},C._toggle_coursebox_expansion=function(e){var o;o=e.target.ancestor(f,!0),e.preventDefault(),o.hasClass(l)?this.run_expansion(o):this._toggle_generic_expansion({parentnode:o,childnode:o.one(p),spinnerhandle:m,data:{courseid:o.getData("courseid"),type:1}})},C._toggle_category_expansion=function(e){var o,n,a;e.target.test("a")||e.target.test("img")||(o=e.target.ancestor(b,!0)).hasClass(c)&&(o.hasClass(l)?this.run_expansion(o):(n=o.getData("categoryid"),a=o.getData("depth"),void 0!==n&&void 0!==a&&this._toggle_generic_expansion({parentnode:o,childnode:o.one(p),spinnerhandle:g,data:{categoryid:n,depth:a,showcourses:o.getData("showcourses"),type:0}})))},C._toggle_generic_expansion=function(e){var o;e.spinnerhandle&&(o=M.util.add_spinner(i,e.parentnode.one(e.spinnerhandle)).show()),i.io(w,{method:"POST",context:this,on:{complete:this.process_results},data:e.data,arguments:{parentnode:e.parentnode,childnode:e.childnode,spinner:o}})},C.run_expansion=function(e){var o=e.one(p),n=this,a=e.ancestor(v);this.add_animation(o),e.hasClass(s)?(o.setStyle("height","0"),e.removeClass(s),e.setAttribute("aria-expanded","true"),o.fx.set("reverse",!1)):(o.fx.set("reverse",!0),o.fx.once("end",function(e,o){o.addClass(s),o.setAttribute("aria-expanded","false")},this,e)),o.fx.once("end",function(e,o){o.setStyles({height:"",opacity:""}),this.destroy(),n.update_collapsible_actions(a)},o.fx,o),o.fx.run()},C.collapse_expand_all=function(e){i.use("io-base","json-parse","moodle-core-notification","anim-node-plugin",function(){C.collapse_expand_all=C._collapse_expand_all,C.collapse_expand_all(e)}),e.preventDefault()},C._collapse_expand_all=function(e){var o;e.preventDefault(),e.currentTarget.hasClass(t)||(o=e.currentTarget.ancestor(v))&&(o.one(x).hasClass(a)?this.collapse_all(o):this.expand_all(o),this.update_collapsible_actions(o))},C.expand_all=function(e){var o=[];e.all(_).each(function(e){e.ancestor(_)?(e.removeClass(s),e.all(n).removeClass(s)):o.push(e)},this),i.all(o).each(function(e){this.expand_category(e)},this)},C.collapse_all=function(e){var o=[];e.all(u).each(function(e){e.ancestor(u)?o.push(e):this.run_expansion(e)},this),i.all(o).each(function(e){e.addClass(s),e.all(d).addClass(s)},this)},C.update_collapsible_actions=function(e){var o=!1,n=e.one(x);n&&(e.all(u).each(function(e){return!e.ancestor(h)&&(o=!0)}),o?n.setHTML(M.util.get_string("collapseall","moodle")).addClass(a).removeClass(t):n.setHTML(M.util.get_string("expandall","moodle")).removeClass(a).removeClass(t))},C.process_results=function(e,o,n){var a,t;try{if((t=i.JSON.parse(o.responseText)).error)return new M.core.ajaxException(t)}catch(s){return new M.core.exception(s)}a=i.Node.create(t),n.childnode.appendChild(a),n.parentnode.addClass(l).removeClass(r),this.run_expansion(n.parentnode),n.spinner&&n.spinner.hide().destroy()},C.add_animation=function(e){return"undefined"!=typeof e.fx||e.plug(i.Plugin.NodeFX,{from:{height:0,opacity:0},to:{height:function(e){return e.get("scrollHeight")},opacity:1},duration:.2}),e}},"@VERSION@",{requires:["node","event-key"]}); \ No newline at end of file diff --git a/course/yui/build/moodle-course-categoryexpander/moodle-course-categoryexpander.js b/course/yui/build/moodle-course-categoryexpander/moodle-course-categoryexpander.js index 38a5b34bdf3..8830672381f 100644 --- a/course/yui/build/moodle-course-categoryexpander/moodle-course-categoryexpander.js +++ b/course/yui/build/moodle-course-categoryexpander/moodle-course-categoryexpander.js @@ -36,7 +36,7 @@ var CSS = { COLLAPSEEXPAND: '.collapseexpand', COURSEBOX: '.coursebox', COURSEBOXLISTENLINK: '.coursebox .moreinfo', - COURSEBOXSPINNERLOCATION: '.coursename a', + COURSEBOXSPINNERLOCATION: '.info .moreinfo', COURSECATEGORYTREE: '.course_category_tree', PARENTWITHCHILDREN: '.category' }, diff --git a/course/yui/src/categoryexpander/js/categoryexpander.js b/course/yui/src/categoryexpander/js/categoryexpander.js index 2176497558b..6086a777c73 100644 --- a/course/yui/src/categoryexpander/js/categoryexpander.js +++ b/course/yui/src/categoryexpander/js/categoryexpander.js @@ -34,7 +34,7 @@ var CSS = { COLLAPSEEXPAND: '.collapseexpand', COURSEBOX: '.coursebox', COURSEBOXLISTENLINK: '.coursebox .moreinfo', - COURSEBOXSPINNERLOCATION: '.coursename a', + COURSEBOXSPINNERLOCATION: '.info .moreinfo', COURSECATEGORYTREE: '.course_category_tree', PARENTWITHCHILDREN: '.category' }, diff --git a/theme/boost/scss/moodle/course.scss b/theme/boost/scss/moodle/course.scss index 032ff112f2d..ff9c7dd56ef 100644 --- a/theme/boost/scss/moodle/course.scss +++ b/theme/boost/scss/moodle/course.scss @@ -705,38 +705,42 @@ span.editinstructions { } .coursebox { - padding: $spacer / 2; + display: flex; + flex-direction: column; + .info { + display: flex; + align-items: center; + } } -.coursebox > .info > .coursename a { - display: block; - background-image: url([[pix:moodle|i/course]]); - background-repeat: no-repeat; - padding-left: 21px; - background-position: left 0.2em; +#frontpage-available-course-list, +#frontpage-course-list, +.course-search-result { + margin-top: $spacer / 2; + .coursebox { + padding: $spacer / 2; + border: $border-width solid $border-color; + margin-bottom: $spacer / 2; + + @include border-radius(); + } } -.coursebox > .info > .coursename, -.coursebox .content .teachers, -.coursebox .content .courseimage, -.coursebox .content .coursefile, -.coursebox .content .customfields-container { - float: left; - clear: left; -} - -.coursebox .content .teachers, -.coursebox .content .courseimage, -.coursebox .content .coursefile, -.coursebox .content .customfields-container { - width: 40%; -} - -.coursebox > .info > h3.coursename { - margin: 5px; +.subcategories, +#frontpage-category-names, +#frontpage-category-combo { + .coursebox > .info > .coursename a { + display: block; + background-image: url([[pix:moodle|i/course]]); + background-repeat: no-repeat; + padding-left: 21px; + background-position: left 0.2em; + } } .coursebox > .info > .coursename { + font-size: $font-size-base; + font-weight: normal; margin: 5px; padding: 0; } @@ -747,34 +751,9 @@ span.editinstructions { margin: 0; } -.coursebox .moreinfo, -.coursebox .enrolmenticons { - padding: 3px 0; - float: right; -} - -.coursebox .moreinfo img { - margin: 0 .2em; -} - -.coursebox .content { - clear: both; -} - -.coursebox .content .summary, -.coursebox .content .coursecat { - float: right; - width: 55%; -} - -.coursebox .content .coursecat { - text-align: right; - clear: right; -} - -.coursebox.remotecoursebox .remotecourseinfo { - float: left; - width: 40%; +.coursebox .customfieldname, +.coursebox .customfieldseparator { + font-weight: $font-weight-bold; } .coursebox .content .courseimage img { @@ -793,29 +772,22 @@ span.editinstructions { padding: 0; } -.coursebox.remotehost > .info > .categoryname a { - background-image: url([[pix:moodle|i/mnethost]]); -} - -.coursebox.collapsed { - margin-bottom: 0; +.category-browse { + .coursebox .content .coursecat, + .coursebox .content .summary, + .coursebox .content .courseimage, + .coursebox .content .coursefile, + .coursebox .content .teachers, + .coursebox.remotecoursebox .remotecourseinfo, + .coursebox .content .customfields-container { + margin-top: 0; + } } .coursebox.collapsed > .content { display: none; } -.courses .coursebox { - &.collapsed { - padding-top: $spacer / 2; - padding-bottom: $spacer / 2; - } - - &.even { - background-color: $table-accent-bg; - } -} - .courses > .paging.paging-morelink { text-align: center; padding: $spacer; @@ -825,36 +797,11 @@ span.editinstructions { font-size: $font-size-sm; } -.course_category_tree .controls { - visibility: hidden; -} - -.course_category_tree .controls div { - display: inline; - cursor: pointer; -} - -.jsenabled .course_category_tree .controls { - visibility: visible; -} - -.course_category_tree .controls { - margin-bottom: 5px; - text-align: right; - float: right; -} - -.course_category_tree .controls div { - padding-right: 2em; - font-size: 75%; -} - .course_category_tree .category > .info > .categoryname { - background-image: url([[pix:moodle|t/collapsed_empty]]); - background-repeat: no-repeat; + margin: 5px; + font-size: $font-size-base; + font-weight: normal; padding: 2px 18px; - margin: 3px; - background-position: center left; } /* rtl:raw: .course_category_tree .category > .info > .categoryname { @@ -863,7 +810,8 @@ span.editinstructions { */ .course_category_tree .category.with_children > .info > .categoryname { background-image: url([[pix:moodle|t/expanded]]); - cursor: pointer; + background-repeat: no-repeat; + background-position: center left; } .course_category_tree .category.with_children.collapsed > .info > .categoryname { @@ -878,24 +826,11 @@ span.editinstructions { display: none; } -.course_category_tree .category > .info { - clear: both; -} - .course_category_tree .category > .content { padding-left: 16px; } -#page-course-index-category .generalbox.info { - margin-bottom: 15px; - border: 1px dotted #ddd; - - @include border-radius(4px); - padding: 5px; -} - #page-course-index-category .categorypicker { - text-align: center; margin: 10px 0 20px; } @@ -1311,4 +1246,4 @@ span.editinstructions { #changenumsections { border-top: $border-width solid $primary-light-border; -} \ No newline at end of file +} diff --git a/theme/boost/style/moodle.css b/theme/boost/style/moodle.css index 64f5b69b381..06e9f659279 100644 --- a/theme/boost/style/moodle.css +++ b/theme/boost/style/moodle.css @@ -14177,33 +14177,36 @@ span.editinstructions { white-space: nowrap; } .coursebox { - padding: 0.5rem; } + display: flex; + flex-direction: column; } + .coursebox .info { + display: flex; + align-items: center; } -.coursebox > .info > .coursename a { +#frontpage-available-course-list, +#frontpage-course-list, +.course-search-result { + margin-top: 0.5rem; } + #frontpage-available-course-list .coursebox, + #frontpage-course-list .coursebox, + .course-search-result .coursebox { + padding: 0.5rem; + border: 1px solid #dee2e6; + margin-bottom: 0.5rem; + border-radius: 0.25rem; } + +.subcategories .coursebox > .info > .coursename a, +#frontpage-category-names .coursebox > .info > .coursename a, +#frontpage-category-combo .coursebox > .info > .coursename a { display: block; background-image: url([[pix:moodle|i/course]]); background-repeat: no-repeat; padding-left: 21px; background-position: left 0.2em; } -.coursebox > .info > .coursename, -.coursebox .content .teachers, -.coursebox .content .courseimage, -.coursebox .content .coursefile, -.coursebox .content .customfields-container { - float: left; - clear: left; } - -.coursebox .content .teachers, -.coursebox .content .courseimage, -.coursebox .content .coursefile, -.coursebox .content .customfields-container { - width: 40%; } - -.coursebox > .info > h3.coursename { - margin: 5px; } - .coursebox > .info > .coursename { + font-size: 0.9375rem; + font-weight: normal; margin: 5px; padding: 0; } @@ -14212,29 +14215,9 @@ span.editinstructions { padding: 0; margin: 0; } -.coursebox .moreinfo, -.coursebox .enrolmenticons { - padding: 3px 0; - float: right; } - -.coursebox .moreinfo img { - margin: 0 .2em; } - -.coursebox .content { - clear: both; } - -.coursebox .content .summary, -.coursebox .content .coursecat { - float: right; - width: 55%; } - -.coursebox .content .coursecat { - text-align: right; - clear: right; } - -.coursebox.remotecoursebox .remotecourseinfo { - float: left; - width: 40%; } +.coursebox .customfieldname, +.coursebox .customfieldseparator { + font-weight: 700; } .coursebox .content .courseimage img { max-width: 100px; @@ -14250,22 +14233,18 @@ span.editinstructions { margin: 15px 5px 5px; padding: 0; } -.coursebox.remotehost > .info > .categoryname a { - background-image: url([[pix:moodle|i/mnethost]]); } - -.coursebox.collapsed { - margin-bottom: 0; } +.category-browse .coursebox .content .coursecat, +.category-browse .coursebox .content .summary, +.category-browse .coursebox .content .courseimage, +.category-browse .coursebox .content .coursefile, +.category-browse .coursebox .content .teachers, +.category-browse .coursebox.remotecoursebox .remotecourseinfo, +.category-browse .coursebox .content .customfields-container { + margin-top: 0; } .coursebox.collapsed > .content { display: none; } -.courses .coursebox.collapsed { - padding-top: 0.5rem; - padding-bottom: 0.5rem; } - -.courses .coursebox.even { - background-color: rgba(0, 0, 0, 0.03); } - .courses > .paging.paging-morelink { text-align: center; padding: 1rem; } @@ -14273,31 +14252,11 @@ span.editinstructions { .course_category_tree .category .numberofcourse { font-size: 0.8203125rem; } -.course_category_tree .controls { - visibility: hidden; } - -.course_category_tree .controls div { - display: inline; - cursor: pointer; } - -.jsenabled .course_category_tree .controls { - visibility: visible; } - -.course_category_tree .controls { - margin-bottom: 5px; - text-align: right; - float: right; } - -.course_category_tree .controls div { - padding-right: 2em; - font-size: 75%; } - .course_category_tree .category > .info > .categoryname { - background-image: url([[pix:moodle|t/collapsed_empty]]); - background-repeat: no-repeat; - padding: 2px 18px; - margin: 3px; - background-position: center left; } + margin: 5px; + font-size: 0.9375rem; + font-weight: normal; + padding: 2px 18px; } /* rtl:raw: .course_category_tree .category > .info > .categoryname { @@ -14306,7 +14265,8 @@ span.editinstructions { */ .course_category_tree .category.with_children > .info > .categoryname { background-image: url([[pix:moodle|t/expanded]]); - cursor: pointer; } + background-repeat: no-repeat; + background-position: center left; } .course_category_tree .category.with_children.collapsed > .info > .categoryname { background-image: url([[pix:moodle|t/collapsed]]); } @@ -14319,20 +14279,10 @@ span.editinstructions { .course_category_tree .category.collapsed > .content { display: none; } -.course_category_tree .category > .info { - clear: both; } - .course_category_tree .category > .content { padding-left: 16px; } -#page-course-index-category .generalbox.info { - margin-bottom: 15px; - border: 1px dotted #ddd; - border-radius: 4px; - padding: 5px; } - #page-course-index-category .categorypicker { - text-align: center; margin: 10px 0 20px; } /** diff --git a/theme/classic/style/moodle.css b/theme/classic/style/moodle.css index 1caaa038dba..5b1c4e2653c 100644 --- a/theme/classic/style/moodle.css +++ b/theme/classic/style/moodle.css @@ -14177,33 +14177,36 @@ span.editinstructions { white-space: nowrap; } .coursebox { - padding: 0.5rem; } + display: flex; + flex-direction: column; } + .coursebox .info { + display: flex; + align-items: center; } -.coursebox > .info > .coursename a { +#frontpage-available-course-list, +#frontpage-course-list, +.course-search-result { + margin-top: 0.5rem; } + #frontpage-available-course-list .coursebox, + #frontpage-course-list .coursebox, + .course-search-result .coursebox { + padding: 0.5rem; + border: 1px solid #dee2e6; + margin-bottom: 0.5rem; + border-radius: 0.25rem; } + +.subcategories .coursebox > .info > .coursename a, +#frontpage-category-names .coursebox > .info > .coursename a, +#frontpage-category-combo .coursebox > .info > .coursename a { display: block; background-image: url([[pix:moodle|i/course]]); background-repeat: no-repeat; padding-left: 21px; background-position: left 0.2em; } -.coursebox > .info > .coursename, -.coursebox .content .teachers, -.coursebox .content .courseimage, -.coursebox .content .coursefile, -.coursebox .content .customfields-container { - float: left; - clear: left; } - -.coursebox .content .teachers, -.coursebox .content .courseimage, -.coursebox .content .coursefile, -.coursebox .content .customfields-container { - width: 40%; } - -.coursebox > .info > h3.coursename { - margin: 5px; } - .coursebox > .info > .coursename { + font-size: 0.9375rem; + font-weight: normal; margin: 5px; padding: 0; } @@ -14212,29 +14215,9 @@ span.editinstructions { padding: 0; margin: 0; } -.coursebox .moreinfo, -.coursebox .enrolmenticons { - padding: 3px 0; - float: right; } - -.coursebox .moreinfo img { - margin: 0 .2em; } - -.coursebox .content { - clear: both; } - -.coursebox .content .summary, -.coursebox .content .coursecat { - float: right; - width: 55%; } - -.coursebox .content .coursecat { - text-align: right; - clear: right; } - -.coursebox.remotecoursebox .remotecourseinfo { - float: left; - width: 40%; } +.coursebox .customfieldname, +.coursebox .customfieldseparator { + font-weight: 700; } .coursebox .content .courseimage img { max-width: 100px; @@ -14250,22 +14233,18 @@ span.editinstructions { margin: 15px 5px 5px; padding: 0; } -.coursebox.remotehost > .info > .categoryname a { - background-image: url([[pix:moodle|i/mnethost]]); } - -.coursebox.collapsed { - margin-bottom: 0; } +.category-browse .coursebox .content .coursecat, +.category-browse .coursebox .content .summary, +.category-browse .coursebox .content .courseimage, +.category-browse .coursebox .content .coursefile, +.category-browse .coursebox .content .teachers, +.category-browse .coursebox.remotecoursebox .remotecourseinfo, +.category-browse .coursebox .content .customfields-container { + margin-top: 0; } .coursebox.collapsed > .content { display: none; } -.courses .coursebox.collapsed { - padding-top: 0.5rem; - padding-bottom: 0.5rem; } - -.courses .coursebox.even { - background-color: rgba(0, 0, 0, 0.03); } - .courses > .paging.paging-morelink { text-align: center; padding: 1rem; } @@ -14273,31 +14252,11 @@ span.editinstructions { .course_category_tree .category .numberofcourse { font-size: 0.8203125rem; } -.course_category_tree .controls { - visibility: hidden; } - -.course_category_tree .controls div { - display: inline; - cursor: pointer; } - -.jsenabled .course_category_tree .controls { - visibility: visible; } - -.course_category_tree .controls { - margin-bottom: 5px; - text-align: right; - float: right; } - -.course_category_tree .controls div { - padding-right: 2em; - font-size: 75%; } - .course_category_tree .category > .info > .categoryname { - background-image: url([[pix:moodle|t/collapsed_empty]]); - background-repeat: no-repeat; - padding: 2px 18px; - margin: 3px; - background-position: center left; } + margin: 5px; + font-size: 0.9375rem; + font-weight: normal; + padding: 2px 18px; } /* rtl:raw: .course_category_tree .category > .info > .categoryname { @@ -14306,7 +14265,8 @@ span.editinstructions { */ .course_category_tree .category.with_children > .info > .categoryname { background-image: url([[pix:moodle|t/expanded]]); - cursor: pointer; } + background-repeat: no-repeat; + background-position: center left; } .course_category_tree .category.with_children.collapsed > .info > .categoryname { background-image: url([[pix:moodle|t/collapsed]]); } @@ -14319,20 +14279,10 @@ span.editinstructions { .course_category_tree .category.collapsed > .content { display: none; } -.course_category_tree .category > .info { - clear: both; } - .course_category_tree .category > .content { padding-left: 16px; } -#page-course-index-category .generalbox.info { - margin-bottom: 15px; - border: 1px dotted #ddd; - border-radius: 4px; - padding: 5px; } - #page-course-index-category .categorypicker { - text-align: center; margin: 10px 0 20px; } /**