Skip to content

E
edx-platform
Commit 793dae53 by Dave St.Germain
Options

Merge pull request #2439 from edx/dcs/a11y-vivisections 

Reduce the usage of <section> tags, to increase accessibility
LMS-2161
parents 9132009f a6797899
Showing with 79 additions and 80 deletions
cms/djangoapps/contentstore/features/component.py
...@@ -28,7 +28,7 @@ def see_a_single_step_component(step): ...@@ -28,7 +28,7 @@ def see_a_single_step_component(step):
for step_hash in step.hashes: for step_hash in step.hashes:
component = step_hash['Component'] component = step_hash['Component']
assert_in(component, ['Discussion', 'Video']) assert_in(component, ['Discussion', 'Video'])
component_css = 'section.xmodule_{}Module'.format(component) component_css = 'div.xmodule_{}Module'.format(component)
assert_true(world.is_css_present(component_css), assert_true(world.is_css_present(component_css),
"{} couldn't be found".format(component)) "{} couldn't be found".format(component))
...@@ -48,7 +48,7 @@ def add_a_multi_step_component(step, is_advanced, category): ...@@ -48,7 +48,7 @@ def add_a_multi_step_component(step, is_advanced, category):
def see_a_multi_step_component(step, category): def see_a_multi_step_component(step, category):
# Wait for all components to finish rendering # Wait for all components to finish rendering
selector = 'li.component section.xblock-student_view' selector = 'li.component div.xblock-student_view'
world.wait_for(lambda _: len(world.css_find(selector)) == len(step.hashes)) world.wait_for(lambda _: len(world.css_find(selector)) == len(step.hashes))
for idx, step_hash in enumerate(step.hashes): for idx, step_hash in enumerate(step.hashes):
...@@ -73,11 +73,11 @@ def see_a_multi_step_component(step, category): ...@@ -73,11 +73,11 @@ def see_a_multi_step_component(step, category):
@step(u'I see a "([^"]*)" Problem component$') @step(u'I see a "([^"]*)" Problem component$')
def see_a_problem_component(step, category): def see_a_problem_component(step, category):
component_css = 'section.xmodule_CapaModule' component_css = 'div.xmodule_CapaModule'
assert_true(world.is_css_present(component_css), assert_true(world.is_css_present(component_css),
'No problem was added to the unit.') 'No problem was added to the unit.')
problem_css = 'li.component section.xblock-student_view' problem_css = 'li.component div.xblock-student_view'
actual_text = world.css_text(problem_css) actual_text = world.css_text(problem_css)
assert_in(category.upper(), actual_text) assert_in(category.upper(), actual_text)
...@@ -150,7 +150,7 @@ def duplicated_component(step, ordinal): ...@@ -150,7 +150,7 @@ def duplicated_component(step, ordinal):
@step(u'I see a Problem component with display name "([^"]*)" in position "([^"]*)"$') @step(u'I see a Problem component with display name "([^"]*)" in position "([^"]*)"$')
def see_component_in_position(step, display_name, index): def see_component_in_position(step, display_name, index):
component_css = 'section.xmodule_CapaModule' component_css = 'div.xmodule_CapaModule'
def find_problem(_driver): def find_problem(_driver):
return world.css_text(component_css, int(index)).startswith(display_name.upper()) return world.css_text(component_css, int(index)).startswith(display_name.upper())
......
cms/djangoapps/contentstore/features/component_settings_editor_helpers.py
...@@ -23,9 +23,9 @@ def create_component_instance(step, category, component_type=None, is_advanced=F ...@@ -23,9 +23,9 @@ def create_component_instance(step, category, component_type=None, is_advanced=F
component_button_css = 'span.large-{}-icon'.format(category.lower()) component_button_css = 'span.large-{}-icon'.format(category.lower())
if category == 'problem': if category == 'problem':
module_css = 'section.xmodule_CapaModule' module_css = 'div.xmodule_CapaModule'
else: else:
module_css = 'section.xmodule_{}Module'.format(category.title()) module_css = 'div.xmodule_{}Module'.format(category.title())
# Count how many of that module is on the page. Later we will # Count how many of that module is on the page. Later we will
# assert that one more was added. # assert that one more was added.
......
cms/djangoapps/contentstore/features/static-pages.py
...@@ -21,14 +21,14 @@ def add_page(step): ...@@ -21,14 +21,14 @@ def add_page(step):
@step(u'I should see a static page named "([^"]*)"$') @step(u'I should see a static page named "([^"]*)"$')
def see_a_static_page_named_foo(step, name): def see_a_static_page_named_foo(step, name):
pages_css = 'section.xmodule_StaticTabModule' pages_css = 'div.xmodule_StaticTabModule'
page_name_html = world.css_html(pages_css) page_name_html = world.css_html(pages_css)
assert_equal(page_name_html, '\n {name}\n'.format(name=name)) assert_equal(page_name_html, '\n {name}\n'.format(name=name))
@step(u'I should not see any static pages$') @step(u'I should not see any static pages$')
def not_see_any_static_pages(step): def not_see_any_static_pages(step):
pages_css = 'section.xmodule_StaticTabModule' pages_css = 'div.xmodule_StaticTabModule'
assert (world.is_css_not_present(pages_css, wait_time=30)) assert (world.is_css_not_present(pages_css, wait_time=30))
......
common/djangoapps/xmodule_modifiers.py
...@@ -76,6 +76,7 @@ def wrap_xblock(runtime_class, block, view, frag, context, display_name_only=Fal ...@@ -76,6 +76,7 @@ def wrap_xblock(runtime_class, block, view, frag, context, display_name_only=Fal
template_context = { template_context = {
'content': block.display_name if display_name_only else frag.content, 'content': block.display_name if display_name_only else frag.content,
'classes': css_classes, 'classes': css_classes,
'display_name': block.display_name_with_default,
'data_attributes': ' '.join(u'data-{}="{}"'.format(key, value) for key, value in data.items()), 'data_attributes': ' '.join(u'data-{}="{}"'.format(key, value) for key, value in data.items()),
} }
......
common/lib/xmodule/xmodule/css/capa/display.scss
...@@ -29,7 +29,7 @@ iframe[seamless]{ ...@@ -29,7 +29,7 @@ iframe[seamless]{
color: darken($error-red, 11%); color: darken($error-red, 11%);
} }
section.problem-progress { div.problem-progress {
display: inline-block; display: inline-block;
padding-left: 5px; padding-left: 5px;
color: #999; color: #999;
...@@ -37,7 +37,7 @@ section.problem-progress { ...@@ -37,7 +37,7 @@ section.problem-progress {
font-size: em(16); font-size: em(16);
} }
section.problem { div.problem {
@media print { @media print {
display: block; display: block;
padding: 0; padding: 0;
...@@ -579,7 +579,7 @@ section.problem { ...@@ -579,7 +579,7 @@ section.problem {
border: 1px solid #ccc; border: 1px solid #ccc;
} }
section.action { div.action {
margin-top: $baseline; margin-top: $baseline;
.save, .check, .show, .reset { .save, .check, .show, .reset {
......
common/lib/xmodule/xmodule/css/combinedopenended/display.scss
...@@ -818,7 +818,7 @@ section.open-ended-child { ...@@ -818,7 +818,7 @@ section.open-ended-child {
width: auto; width: auto;
} }
section.action { div.action {
margin-top: $baseline; margin-top: $baseline;
input.save { input.save {
......
common/lib/xmodule/xmodule/css/sequence/display.scss
...@@ -393,7 +393,7 @@ nav.sequence-bottom { ...@@ -393,7 +393,7 @@ nav.sequence-bottom {
} }
} }
.xmodule_VerticalModule ol.vert-mod > li ul.sequence-nav-buttons { .xmodule_VerticalModule div.vert-mod > div ul.sequence-nav-buttons {
list-style: none !important; list-style: none !important;
} }
......
common/lib/xmodule/xmodule/js/fixtures/annotatable.html
...@@ -29,7 +29,7 @@ ...@@ -29,7 +29,7 @@
</div> </div>
</section> </section>
<section class="problem"><a class="annotation-return" href="javascript:void(0)">Return to Annotation</a></section> <div class="problem"><a class="annotation-return" href="javascript:void(0)">Return to Annotation</a></div>
<section class="problem"><a class="annotation-return" href="javascript:void(0)">Return to Annotation</a></section> <div class="problem"><a class="annotation-return" href="javascript:void(0)">Return to Annotation</a></div>
<section class="problem"><a class="annotation-return" href="javascript:void(0)">Return to Annotation</a></section> <div class="problem"><a class="annotation-return" href="javascript:void(0)">Return to Annotation</a></div>
common/lib/xmodule/xmodule/js/fixtures/problem_content.html
<h2 class="problem-header">${_("Problem Header")}</h2> <h2 class="problem-header">${_("Problem Header")}</h2>
<section class='problem-progress'> <div class='problem-progress'></div>
</section>
<section class="problem"> <div class="problem">
<p>${_("Problem Content")}</p> <p>${_("Problem Content")}</p>
<section class="action"> <div class="action">
<input type="hidden" name="problem_id" value="1"> <input type="hidden" name="problem_id" value="1">
<input type="text" name="input_example_1" id="input_example_1" value="" class="math" /> <input type="text" name="input_example_1" id="input_example_1" value="" class="math" />
...@@ -18,6 +17,6 @@ ...@@ -18,6 +17,6 @@
<input class="save" type="button" value="${_('Save')}"> <input class="save" type="button" value="${_('Save')}">
<button class="show"><span class="show-label">${_("Show Answer(s)")}</span> <span class="sr">(for question(s) above - adjacent to each field)</span></button> <button class="show"><span class="show-label">${_("Show Answer(s)")}</span> <span class="sr">(for question(s) above - adjacent to each field)</span></button>
<a href="/courseware/6.002_Spring_2012/${ explain }" class="new-page">${_("Explanation")}</a> <a href="/courseware/6.002_Spring_2012/${ explain }" class="new-page">${_("Explanation")}</a>
<section class="submission_feedback"></section> <div class="submission_feedback"></div>
</section> </div>
</section> </div>
common/lib/xmodule/xmodule/js/spec/capa/display_spec.coffee
...@@ -52,19 +52,19 @@ describe 'Problem', -> ...@@ -52,19 +52,19 @@ describe 'Problem', ->
expect(window.update_schematics).toHaveBeenCalled() expect(window.update_schematics).toHaveBeenCalled()
it 'bind answer refresh on button click', -> it 'bind answer refresh on button click', ->
expect($('section.action input:button')).toHandleWith 'click', @problem.refreshAnswers expect($('div.action input:button')).toHandleWith 'click', @problem.refreshAnswers
it 'bind the check button', -> it 'bind the check button', ->
expect($('section.action input.check')).toHandleWith 'click', @problem.check_fd expect($('div.action input.check')).toHandleWith 'click', @problem.check_fd
it 'bind the reset button', -> it 'bind the reset button', ->
expect($('section.action input.reset')).toHandleWith 'click', @problem.reset expect($('div.action input.reset')).toHandleWith 'click', @problem.reset
it 'bind the show button', -> it 'bind the show button', ->
expect($('section.action button.show')).toHandleWith 'click', @problem.show expect($('div.action button.show')).toHandleWith 'click', @problem.show
it 'bind the save button', -> it 'bind the save button', ->
expect($('section.action input.save')).toHandleWith 'click', @problem.save expect($('div.action input.save')).toHandleWith 'click', @problem.save
it 'bind the math input', -> it 'bind the math input', ->
expect($('input.math')).toHandleWith 'keyup', @problem.refreshMath expect($('input.math')).toHandleWith 'keyup', @problem.refreshMath
......
common/lib/xmodule/xmodule/js/src/capa/display.coffee
...@@ -19,11 +19,11 @@ class @Problem ...@@ -19,11 +19,11 @@ class @Problem
problem_prefix = @element_id.replace(/problem_/,'') problem_prefix = @element_id.replace(/problem_/,'')
@inputs = @$("[id^=input_#{problem_prefix}_]") @inputs = @$("[id^=input_#{problem_prefix}_]")
@$('section.action input:button').click @refreshAnswers @$('div.action input:button').click @refreshAnswers
@$('section.action input.check').click @check_fd @$('div.action input.check').click @check_fd
@$('section.action input.reset').click @reset @$('div.action input.reset').click @reset
@$('section.action button.show').click @show @$('div.action button.show').click @show
@$('section.action input.save').click @save @$('div.action input.save').click @save
@bindResetCorrectness() @bindResetCorrectness()
......
common/lib/xmodule/xmodule/js/src/poll/poll_main.js
...@@ -272,7 +272,7 @@ function PollMain(el) { ...@@ -272,7 +272,7 @@ function PollMain(el) {
c1 += 1; c1 += 1;
if ( if (
(tempEl.tagName.toLowerCase() === 'section') && (tempEl.tagName.toLowerCase() === 'div') &&
($(tempEl).hasClass('xmodule_WrapperModule') === true) ($(tempEl).hasClass('xmodule_WrapperModule') === true)
) { ) {
_this.wrapperSectionEl = tempEl; _this.wrapperSectionEl = tempEl;
......
common/lib/xmodule/xmodule/js/src/vertical/edit.coffee
...@@ -6,4 +6,4 @@ class @VerticalDescriptor extends XModule.Descriptor ...@@ -6,4 +6,4 @@ class @VerticalDescriptor extends XModule.Descriptor
) )
save: -> save: ->
children: $('.vert-mod li', @element).map((idx, el) -> $(el).data('id')).toArray() children: $('.vert-mod div', @element).map((idx, el) -> $(el).data('id')).toArray()
common/lib/xmodule/xmodule/js/src/wrapper/edit.coffee
...@@ -7,4 +7,4 @@ class @WrapperDescriptor extends XModule.Descriptor ...@@ -7,4 +7,4 @@ class @WrapperDescriptor extends XModule.Descriptor
) )
save: -> save: ->
children: $('.vert-mod li', @element).map((idx, el) -> $(el).data('id')).toArray() children: $('.vert-mod div', @element).map((idx, el) -> $(el).data('id')).toArray()
common/templates/xblock_wrapper.html
<section class="${' '.join(classes)}" ${data_attributes}> <div class="${' '.join(classes)}" ${data_attributes} aria-label="${display_name}">
${content} ${content}
</section> </div>
common/test/acceptance/pages/lms/course_nav.py
...@@ -15,7 +15,7 @@ class CourseNavPage(PageObject): ...@@ -15,7 +15,7 @@ class CourseNavPage(PageObject):
url = None url = None
def is_browser_on_page(self): def is_browser_on_page(self):
return self.is_css_present('section.course-index') return self.is_css_present('div.course-index')
@property @property
def sections(self): def sections(self):
......
lms/djangoapps/courseware/features/annotatable.py
...@@ -139,7 +139,7 @@ class AnnotatableSteps(object): ...@@ -139,7 +139,7 @@ class AnnotatableSteps(object):
self.active_problem = problem self.active_problem = problem
def active_problem_selector(self, subselector): def active_problem_selector(self, subselector):
return 'section[data-problem-id="{}"] {}'.format( return 'div[data-problem-id="{}"] {}'.format(
world.scenario_dict['PROBLEMS'][self.active_problem].location.url(), world.scenario_dict['PROBLEMS'][self.active_problem].location.url(),
subselector, subselector,
) )
......
lms/djangoapps/courseware/features/problems.py
...@@ -121,7 +121,7 @@ def press_the_button_with_label(_step, buttonname): ...@@ -121,7 +121,7 @@ def press_the_button_with_label(_step, buttonname):
@step(u'The "([^"]*)" button does( not)? appear') @step(u'The "([^"]*)" button does( not)? appear')
def action_button_present(_step, buttonname, doesnt_appear): def action_button_present(_step, buttonname, doesnt_appear):
button_css = 'section.action input[value*="%s"]' % buttonname button_css = 'div.action input[value*="%s"]' % buttonname
if bool(doesnt_appear): if bool(doesnt_appear):
assert world.is_css_not_present(button_css) assert world.is_css_not_present(button_css)
else: else:
...@@ -141,7 +141,7 @@ def see_score(_step, score): ...@@ -141,7 +141,7 @@ def see_score(_step, score):
# The problem progress is changed by # The problem progress is changed by
# cms/static/xmodule_js/src/capa/display.js # cms/static/xmodule_js/src/capa/display.js
# so give it some time to render on the page. # so give it some time to render on the page.
score_css = 'section.problem-progress' score_css = 'div.problem-progress'
expected_text = '({})'.format(score) expected_text = '({})'.format(score)
world.wait_for(lambda _: world.css_has_text(score_css, expected_text)) world.wait_for(lambda _: world.css_has_text(score_css, expected_text))
......
lms/djangoapps/courseware/tests/test_module_render.py
...@@ -406,7 +406,7 @@ class TestHtmlModifiers(ModuleStoreTestCase): ...@@ -406,7 +406,7 @@ class TestHtmlModifiers(ModuleStoreTestCase):
) )
result_fragment = module.render('student_view') result_fragment = module.render('student_view')
self.assertIn('section class="xblock xblock-student_view xmodule_display xmodule_HtmlModule"', result_fragment.content) self.assertIn('div class="xblock xblock-student_view xmodule_display xmodule_HtmlModule"', result_fragment.content)
def test_xmodule_display_wrapper_disabled(self): def test_xmodule_display_wrapper_disabled(self):
module = render.get_module( module = render.get_module(
...@@ -419,7 +419,7 @@ class TestHtmlModifiers(ModuleStoreTestCase): ...@@ -419,7 +419,7 @@ class TestHtmlModifiers(ModuleStoreTestCase):
) )
result_fragment = module.render('student_view') result_fragment = module.render('student_view')
self.assertNotIn('section class="xblock xblock-student_view xmodule_display xmodule_HtmlModule"', result_fragment.content) self.assertNotIn('div class="xblock xblock-student_view xmodule_display xmodule_HtmlModule"', result_fragment.content)
def test_static_link_rewrite(self): def test_static_link_rewrite(self):
module = render.get_module( module = render.get_module(
......
lms/static/sass/course/courseware/_courseware.scss
...@@ -125,7 +125,7 @@ div.course-wrapper { ...@@ -125,7 +125,7 @@ div.course-wrapper {
} }
} }
section.xmodule_WrapperModule ol.vert-mod > li { section.xmodule_WrapperModule div.vert-mod > div {
border-bottom: none; border-bottom: none;
} }
...@@ -193,7 +193,7 @@ div.course-wrapper { ...@@ -193,7 +193,7 @@ div.course-wrapper {
} }
&.closed { &.closed {
section.course-index { div.course-index {
width: flex-grid(.6); width: flex-grid(.6);
overflow: hidden; overflow: hidden;
......
lms/static/sass/course/courseware/_sidebar.scss
section.course-index { .course-index {
@extend .sidebar; @extend .sidebar;
@extend .tran; @extend .tran;
border-radius: 3px 0 0 3px; border-radius: 3px 0 0 3px;
......
lms/static/sass/ie.scss
...@@ -159,7 +159,7 @@ ...@@ -159,7 +159,7 @@
display: block !important; display: block !important;
section.course-content, section.course-content,
section.course-index { div.course-index {
display: block !important; display: block !important;
float: left; float: left;
} }
......
lms/templates/courseware/courseware.html
...@@ -185,28 +185,28 @@ ${fragment.foot_html()} ...@@ -185,28 +185,28 @@ ${fragment.foot_html()}
<%include file="/courseware/course_navigation.html" args="active_page='courseware'" /> <%include file="/courseware/course_navigation.html" args="active_page='courseware'" />
% endif % endif
<section class="container"> <div class="container">
<div class="course-wrapper"> <div class="course-wrapper">
% if accordion: % if accordion:
<section aria-label="${_('Course Navigation')}" class="course-index"> <div class="course-index">
<header id="open_close_accordion"> <header id="open_close_accordion">
<a href="#">${_("close")}</a> <a href="#">${_("close")}</a>
</header> </header>
<div id="accordion" style="display: none"> <div id="accordion" style="display: none">
<nav> <nav aria-label="${_('Course Navigation')}">
${accordion} ${accordion}
</nav> </nav>
</div> </div>
</section> </div>
% endif % endif
<section class="course-content"> <section class="course-content">
${fragment.body_html()} ${fragment.body_html()}
</section> </section>
</div> </div>
</section> </div>
% if show_chat: % if show_chat:
<div id="chat-wrapper"> <div id="chat-wrapper">
......
lms/templates/poll.html
<section <div
id="poll_${element_id}" id="poll_${element_id}"
class="${element_class}" class="${element_class}"
data-ajax-url="${ajax_url}" data-ajax-url="${ajax_url}"
> >
<!-- Hidden field to read configuration JSON from. --> <!-- Hidden field to read configuration JSON from. -->
<div class="${element_class}_div" id="${element_id}_json" style="display: none;">${configuration_json}</div> <div class="${element_class}_div" id="${element_id}_json" style="display: none;">${configuration_json}</div>
</section> </div>
\ No newline at end of file \ No newline at end of file
lms/templates/problem.html
...@@ -5,13 +5,12 @@ ...@@ -5,13 +5,12 @@
${ problem['name'] } ${ problem['name'] }
</h2> </h2>
<section class="problem-progress"> <div class="problem-progress"></div>
</section>
<section class="problem"> <div class="problem">
${ problem['html'] } ${ problem['html'] }
<section class="action"> <div class="action">
<input type="hidden" name="problem_id" value="${ problem['name'] }" /> <input type="hidden" name="problem_id" value="${ problem['name'] }" />
% if check_button: % if check_button:
...@@ -27,9 +26,9 @@ ...@@ -27,9 +26,9 @@
<button class="show"><span class="show-label">${_('Show Answer(s)')}</span> <span class="sr">${_("(for question(s) above - adjacent to each field)")}</span></button> <button class="show"><span class="show-label">${_('Show Answer(s)')}</span> <span class="sr">${_("(for question(s) above - adjacent to each field)")}</span></button>
% endif % endif
% if attempts_allowed : % if attempts_allowed :
<section class="submission_feedback"> <div class="submission_feedback">
${_("You have used {num_used} of {num_total} submissions").format(num_used=attempts_used, num_total=attempts_allowed)} ${_("You have used {num_used} of {num_total} submissions").format(num_used=attempts_used, num_total=attempts_allowed)}
</section> </div>
% endif % endif
</section> </div>
</section> </div>
lms/templates/problem_ajax.html
<section id="problem_${element_id}" class="problems-wrapper" data-problem-id="${id}" data-url="${ajax_url}" data-progress_status="${progress_status}" data-progress_detail="${progress_detail}"></section> <div id="problem_${element_id}" class="problems-wrapper" data-problem-id="${id}" data-url="${ajax_url}" data-progress_status="${progress_status}" data-progress_detail="${progress_detail}"></div>
lms/templates/registration/password_reset_complete.html
...@@ -56,8 +56,8 @@ ...@@ -56,8 +56,8 @@
</nav> </nav>
</header> </header>
<section class="content-wrapper"> <div class="content-wrapper">
<section class="passwordreset container"> <div class="passwordreset container">
<section class="introduction"> <section class="introduction">
<header> <header>
<h1>{% trans "Your Password Reset is Complete" %}</h1> <h1>{% trans "Your Password Reset is Complete" %}</h1>
...@@ -65,11 +65,11 @@ ...@@ -65,11 +65,11 @@
</section> </section>
{% block content %} {% block content %}
<section role="main" class="content"> <div role="main" class="content">
{% blocktrans with link_start='<a href="/login">' link_end='</a>' %} {% blocktrans with link_start='<a href="/login">' link_end='</a>' %}
Your password has been set. You may go ahead and {{ link_start }}log in{{ link_end }} now. Your password has been set. You may go ahead and {{ link_start }}log in{{ link_end }} now.
{% endblocktrans %} {% endblocktrans %}
</section> </div>
{% endblock %} {% endblock %}
</section> </div>
</section> </div>
lms/templates/seq_module.html
<%! from django.utils.translation import ugettext as _ %> <%! from django.utils.translation import ugettext as _ %>
<div id="sequence_${element_id}" class="sequence" data-id="${item_id}" data-position="${position}" data-ajax-url="${ajax_url}" > <div id="sequence_${element_id}" class="sequence" data-id="${item_id}" data-position="${position}" data-ajax-url="${ajax_url}" >
<nav aria-label="${_('Section Navigation')}" class="sequence-nav"> <nav class="sequence-nav">
<ul class="sequence-nav-buttons"> <ul class="sequence-nav-buttons">
<li class="prev"><a href="#">${_('Previous')}</a></li> <li class="prev"><a href="#">${_('Previous')}</a></li>
</ul> </ul>
<div class="sequence-list-wrapper"> <div class="sequence-list-wrapper">
<ol id="sequence-list"> <ol aria-label="${_('Section Navigation')}" id="sequence-list">
% for idx, item in enumerate(items): % for idx, item in enumerate(items):
## TODO (vshnayder): add item.progress_detail either to the title or somewhere else. ## TODO (vshnayder): add item.progress_detail either to the title or somewhere else.
## Make sure it gets updated after ajax calls. ## Make sure it gets updated after ajax calls.
## implementation note: will need to figure out how to handle combining detail ## implementation note: will need to figure out how to handle combining detail
## statuses of multiple modules in js. ## statuses of multiple modules in js.
<li> <li aria-label="${item['title']}">
<a class="seq_${item['type']} inactive progress-${item['progress_status']}" <a class="seq_${item['type']} inactive progress-${item['progress_status']}"
data-id="${item['id']}" data-id="${item['id']}"
data-element="${idx+1}" data-element="${idx+1}"
data-title="${item['title']}" data-title="${item['title']}"
href="javascript:void(0);"> href="javascript:void(0);">
<p aria-hidden="false">${item['title']}<span class="sr">, ${item['type']}</span></p> <p aria-hidden="false">${item['title']}<span class="sr" aria-hidden="true">, ${item['type']}</span></p>
</a> </a>
</li> </li>
% endfor % endfor
......
lms/templates/vert_module.html
<ol class="vert-mod"> <div class="vert-mod">
% for idx, item in enumerate(items): % for idx, item in enumerate(items):
<li id="vert-${idx}" data-id="${item['id']}"> <div id="vert-${idx}" data-id="${item['id']}">
${item['content']} ${item['content']}
</li> </div>
% endfor % endfor
</ol> </div>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment