-
Bug
-
Resolution: Fixed
-
Minor
-
3.4, 3.4.3, 3.5
-
MOODLE_34_STABLE, MOODLE_35_STABLE
-
MOODLE_34_STABLE, MOODLE_35_STABLE
-
MDL-61019-master -
There are a couple of issues with the styling of lessons in the boost theme up to and including 3.4.
- When resuming a lesson, the Yes No buttons for continuing when left off are not styles (Attachment 1).
- The progress bar at the bottom of a lesson is not styled (Attachment 2)
- Check box questions wrap the question text beneath the check box. (Attachment 2)
- Drop down questions need more space to the left of the actual box (Attachment 3). This is related to the problem above.
- Vertically aligning content buttons does nothing. (Attachments 4 & 5)\
I have some CSS fixes that correct these problems, although I suspect hitting the underlying renderers would be more efficient:
- Yes no buttons:
body#page-mod-lesson-view .lessonbutton {
background-color: #fff;
{{ border-color: #ccc; }}
{{ border-radius: 3.5px; }}
{{ border-style: solid; }}
{{ border-width: 1px; }}
{{ color: #373a3c; }}
{{ display: inline-block; }}
font-size: 14px;
{{ line-height: 17.5px; }}
{{ padding: 7px 14px; }}
{{ text-align: center; }}
vertical-align: middle;
}
{{body#page-mod-lesson-view .lessonbutton:hover { }}
{{ background-color: #e6e6e6; }}
{{ color: #333; }}
}
2. Progress bar:
{{.progress_bar_completed { }}
{{ background: green; }}
{{ color: white; }}
{{ text-align: right; }}
}
3. Check and radio questions (this fix is almost certainly how it should not be done in the source, but it does correct the issue with custom CSS)
{{body#page-mod-lesson-view [type="checkbox"], body#page-mod-lesson-view [type="radio"] { }}
{{ float: left; }}
margin-right: 1rem;
}
{{body#page-mod-lesson-view .answeroption label { display: initial; }}}
4. Drop down questions. Again, this is not how it should be fixed in the renderers as I'm fooling with the bootstrap columns to fix the issue, but works in custom CSS.
{{body#page-mod-lesson-view .answeroption .col-md-3 { width: auto; display: inline; float: none; }}}
{{body#page-mod-lesson-view .answeroption .col-md-9 { width: auto; display: inline; float: none; }}}
body#page-mod-lesson-view .answeroption label { width: 70%; display: inline-block !important }anchor
5. Vertical align content buttons
{{body#page-mod-lesson-view .vertical .singlebutton { display: block; margin-bottom: 0.1rem; }}}
{{body#page-mod-lesson-view .vertical .singlebutton + .singlebutton { margin-left: 0; }}}
{{body#page-mod-lesson-view .vertical .singlebutton .btn-secondary { min-width: 15em; }}}
- Testing discovered
-
MDL-62935 Lesson + Boost + Slideshow problem
- Closed
- will be (partly) resolved by
-
MDL-39486 Length of left pairs text too narrow in match questions
- Closed
-
MDL-61581 Lesson 'Do you want to start at the last page you saw?' buttons are not styled
- Closed
- will help resolve
-
MDL-62901 Lesson content buttons vertical does nothing in Boost theme
- Closed