MDL-61019 Theme boost: lesson display issues with buttons/progress bar.

robjoyce · Jul 13, 2018 · 9004441 · 9004441
1 parent 8c51626
commit 9004441
Show file tree

Hide file tree

Showing 3 changed files with 23 additions and 4 deletions.
diff --git a/mod/lesson/renderer.php b/mod/lesson/renderer.php
@@ -505,10 +505,14 @@ public function progress_bar(lesson $lesson, $progress = null) {
             $progress = $lesson->calculate_progress();
         }
 
-        // print out the Progress Bar.  Attempted to put as much as possible in the style sheets.
-        $content = '<br />' . html_writer::tag('div', $progress . '%', array('class' => 'progress_bar_completed', 'style' => 'width: '. $progress . '%;'));
-        $printprogress = html_writer::tag('div', get_string('progresscompleted', 'lesson', $progress) . $content, array('class' => 'progress_bar'));
-
+        $content = html_writer::start_tag('div');
+        $content .= html_writer::start_tag('div', array('class' => 'progress'));
+        $content .= html_writer::start_tag('div', array('class' => 'progress-bar bar', 'role' => 'progressbar',
+            'style' => 'width: ' . $progress .'%', 'aria-valuenow' => $progress, 'aria-valuemin' => 0, 'aria-valuemax' => 100));
+        $content .= $progress . "%";
+        $content .= html_writer::end_tag('div');
+        $content .= html_writer::end_tag('div');
+        $printprogress = html_writer::tag('div', get_string('progresscompleted', 'lesson', $progress) . $content);
         return $this->output->box($printprogress, 'progress_bar');
     }
 

diff --git a/theme/boost/scss/moodle/modules.scss b/theme/boost/scss/moodle/modules.scss
@@ -240,6 +240,15 @@ div#dock {
 #page-mod-lesson-view .branchbuttoncontainer .singlebutton button[type="submit"] {
     white-space: normal;
 }
+#page-mod-lesson-view {
+    .vertical .singlebutton {
+        display: block;
+        + .singlebutton {
+            margin-left: 0;
+            margin-top: 1rem;
+        }
+    }
+}
 .path-mod-lesson .generaltable td {
     vertical-align: middle;
     label {

diff --git a/theme/boost/style/moodle.css b/theme/boost/style/moodle.css
@@ -15414,6 +15414,12 @@ div#dock {
 #page-mod-lesson-view .branchbuttoncontainer .singlebutton button[type="submit"] {
   white-space: normal; }
 
+#page-mod-lesson-view .vertical .singlebutton {
+  display: block; }
+  #page-mod-lesson-view .vertical .singlebutton + .singlebutton {
+    margin-left: 0;
+    margin-top: 1rem; }
+
 .path-mod-lesson .generaltable td {
   vertical-align: middle; }
   .path-mod-lesson .generaltable td label {