Merge pull request #17470 from edx/sofiya/2095-2
Auto-open course outline to last viewed block
This commit is contained in:
@@ -353,7 +353,7 @@
|
||||
.details {
|
||||
font-size: $body-font-size;
|
||||
color: theme-color("secondary");
|
||||
margin-left: 35px;
|
||||
margin-left: 34px;
|
||||
}
|
||||
.prerequisite {
|
||||
color: theme-color("secondary");
|
||||
@@ -362,7 +362,7 @@
|
||||
}
|
||||
|
||||
.vertical {
|
||||
@include margin-left(10px);
|
||||
@include margin-left(16px);
|
||||
|
||||
list-style-type: none;
|
||||
border: 1px solid transparent;
|
||||
@@ -398,7 +398,7 @@
|
||||
}
|
||||
|
||||
// Course outline accordion
|
||||
button.accordion-trigger {
|
||||
button.accordion-trigger, button.prerequisite-button {
|
||||
margin: 2px;
|
||||
padding: 10px 0 10px 0;
|
||||
border: none;
|
||||
|
||||
@@ -16,18 +16,19 @@ from openedx.core.djangolib.markup import HTML, Text
|
||||
% if blocks.get('children'):
|
||||
<ol class="block-tree accordion" role="presentation">
|
||||
% for section in blocks.get('children'):
|
||||
<% section_is_auto_opened = section.get('resume_block') is True %>
|
||||
<li
|
||||
class="outline-item section"
|
||||
role="heading"
|
||||
>
|
||||
<button class="section-name accordion-trigger"
|
||||
aria-expanded="false"
|
||||
aria-expanded="${ 'true' if section_is_auto_opened else 'false' }"
|
||||
aria-controls="${ section['id'] }_contents"
|
||||
id="${ section['id'] }">
|
||||
<span class="fa fa-chevron-right" aria-hidden="true"></span>
|
||||
<span class="fa fa-chevron-right ${ 'fa-rotate-90' if section_is_auto_opened else '' }" aria-hidden="true"></span>
|
||||
<h3 class="section-title">${ section['display_name'] }</h3>
|
||||
</button>
|
||||
<ol class="outline-item accordion-panel is-hidden"
|
||||
<ol class="outline-item accordion-panel ${ '' if section_is_auto_opened else 'is-hidden' }"
|
||||
id="${ section['id'] }_contents"
|
||||
role="region"
|
||||
aria-labelledby="${ section['id'] }"
|
||||
@@ -36,32 +37,16 @@ from openedx.core.djangolib.markup import HTML, Text
|
||||
<%
|
||||
gated_subsection = subsection['id'] in gated_content
|
||||
completed_prereqs = gated_content[subsection['id']]['completed_prereqs'] if gated_subsection else False
|
||||
subsection_is_auto_opened = subsection.get('resume_block') is True
|
||||
%>
|
||||
<li class="subsection accordion ${ 'current' if subsection['resume_block'] else '' }" role="heading">
|
||||
% if gated_subsection and not completed_prereqs:
|
||||
<button class="subsection-text accordion-trigger"
|
||||
id="${ subsection['id'] }"
|
||||
>
|
||||
% else:
|
||||
<button class="subsection-text accordion-trigger"
|
||||
id="${ subsection['id'] }"
|
||||
aria-expanded="false"
|
||||
aria-controls="${ subsection['id'] }_contents"
|
||||
>
|
||||
% endif
|
||||
## Subsection title
|
||||
% if gated_subsection:
|
||||
% if completed_prereqs:
|
||||
<span class="menu-icon icon fa fa-unlock"
|
||||
aria-hidden="true">
|
||||
</span>
|
||||
<span class="subsection-title">
|
||||
${ subsection['display_name'] }
|
||||
</span>
|
||||
<span class="sr"> ${_("Unlocked")}</span>
|
||||
% else:
|
||||
<a href="${ subsection['lms_web_url'] }">
|
||||
<button class="subsection-text prerequisite-button"
|
||||
id="${ subsection['id'] }"
|
||||
>
|
||||
<span class="menu-icon icon fa fa-lock"
|
||||
aria-hidden="true">
|
||||
aria-hidden="true">
|
||||
</span>
|
||||
<span class="subsection-title">
|
||||
${ subsection['display_name'] }
|
||||
@@ -74,13 +59,18 @@ from openedx.core.djangolib.markup import HTML, Text
|
||||
%>
|
||||
${ prerequisite_name }
|
||||
</div>
|
||||
% endif
|
||||
% else:
|
||||
<span class="fa fa-chevron-right" aria-hidden="true"></span>
|
||||
% else:
|
||||
<button class="subsection-text accordion-trigger"
|
||||
id="${ subsection['id'] }"
|
||||
aria-expanded="${ 'true' if subsection_is_auto_opened else 'false' }"
|
||||
aria-controls="${ subsection['id'] }_contents"
|
||||
>
|
||||
<span class="fa fa-chevron-right ${ 'fa-rotate-90' if subsection_is_auto_opened else '' }"
|
||||
aria-hidden="true"></span>
|
||||
<span class="subsection-title">
|
||||
${ subsection['display_name'] }
|
||||
</span>
|
||||
% endif
|
||||
% endif
|
||||
<div class="details">
|
||||
|
||||
## There are behavior differences between rendering of subsections which have
|
||||
@@ -139,8 +129,11 @@ from openedx.core.djangolib.markup import HTML, Text
|
||||
% endif
|
||||
</div> <!-- /details -->
|
||||
</button> <!-- /subsection-text -->
|
||||
% if gated_subsection and not completed_prereqs:
|
||||
</a>
|
||||
% endif
|
||||
% if not gated_subsection or (gated_subsection and completed_prereqs):
|
||||
<ol class="outline-item accordion-panel is-hidden"
|
||||
<ol class="outline-item accordion-panel ${ '' if subsection_is_auto_opened else 'is-hidden' }"
|
||||
id="${ subsection['id'] }_contents"
|
||||
role="region"
|
||||
aria-labelledby="${ subsection['id'] }"
|
||||
|
||||
Reference in New Issue
Block a user