MDL-73880 core_courseformat: fix section availability box

enovation · Mar 2, 2022 · ce88708 · ce88708
1 parent 7fe8e34
commit ce88708
Show file tree

Hide file tree

Showing 7 changed files with 14 additions and 6 deletions.
diff --git a/course/format/amd/build/local/content/section.min.js b/course/format/amd/build/local/content/section.min.js
diff --git a/course/format/amd/build/local/content/section.min.js.map b/course/format/amd/build/local/content/section.min.js.map
diff --git a/course/format/amd/src/local/content/section.js b/course/format/amd/src/local/content/section.js
@@ -37,10 +37,12 @@ export default class extends DndSection {
         this.selectors = {
             SECTION_ITEM: `[data-for='section_title']`,
             CM: `[data-for="cmitem"]`,
+            SECTIONINFO: `[data-for="sectioninfo"]`,
         };
         // Most classes will be loaded later by DndCmItem.
         this.classes = {
             LOCKED: 'editinprogress',
+            HASDESCRIPTION: 'description',
         };
 
         // We need our id to watch specific events.
@@ -120,5 +122,10 @@ export default class extends DndSection {
         this.element.classList.toggle(this.classes.DRAGGING, element.dragging ?? false);
         this.element.classList.toggle(this.classes.LOCKED, element.locked ?? false);
         this.locked = element.locked;
+        // The description box classes depends on the section state.
+        const sectioninfo = this.getElement(this.selectors.SECTIONINFO);
+        if (sectioninfo) {
+            sectioninfo.classList.toggle(this.classes.HASDESCRIPTION, element.hasrestrictions);
+        }
     }
 }
diff --git a/course/format/templates/local/content/section/content.mustache b/course/format/templates/local/content/section/content.mustache
@@ -128,7 +128,7 @@
     class="content {{^iscoursedisplaymultipage}}
         {{^sitehome}}course-content-item-content collapse {{^contentcollapsed}}show{{/contentcollapsed}}{{/sitehome}}
     {{/iscoursedisplaymultipage}}">
-    <div class="{{#hasavailability}}description small{{/hasavailability}} my-3">
+    <div class="{{#hasavailability}}description{{/hasavailability}} my-3" data-for="sectioninfo">
     {{#summary}}
         {{$ core_courseformat/local/content/section/summary }}
             {{> core_courseformat/local/content/section/summary }}

diff --git a/theme/boost/scss/moodle/course.scss b/theme/boost/scss/moodle/course.scss
@@ -1132,7 +1132,6 @@ span.editinstructions {
     }
 
     > div {
-        display: inline-block;
         float: right;
 
         > div {
@@ -1340,6 +1339,8 @@ $activity-add-hover: theme-color-level('primary', -10) !default;
 }
 
 .description .course-description-item {
+    @include font-size($small-font-size);
+
     background-color: $gray-100;
     padding-left: map-get($spacers, 3);
     padding-right: map-get($spacers, 3);

diff --git a/theme/boost/style/moodle.css b/theme/boost/style/moodle.css
@@ -14561,7 +14561,6 @@ span.editinstructions {
     display: inline-block;
     text-align: left; }
   .coursecat-management-header > div {
-    display: inline-block;
     float: right; }
     .coursecat-management-header > div > div {
       margin: 10px 0 10px 1em;
@@ -14707,6 +14706,7 @@ span.editinstructions {
     display: inline-block; }
 
 .description .course-description-item {
+  font-size: 80%;
   background-color: #f8f9fa;
   padding-left: 1rem;
   padding-right: 1rem; }

diff --git a/theme/classic/style/moodle.css b/theme/classic/style/moodle.css
@@ -14561,7 +14561,6 @@ span.editinstructions {
     display: inline-block;
     text-align: left; }
   .coursecat-management-header > div {
-    display: inline-block;
     float: right; }
     .coursecat-management-header > div > div {
       margin: 10px 0 10px 1em;
@@ -14707,6 +14706,7 @@ span.editinstructions {
     display: inline-block; }
 
 .description .course-description-item {
+  font-size: 80%;
   background-color: #f8f9fa;
   padding-left: 1rem;
   padding-right: 1rem; }