Commit c619e1ec by Chris Rodriguez

Adding UXPL classnames to headings

parent e3ddb02c
...@@ -55,9 +55,9 @@ def see_a_multi_step_component(step, category): ...@@ -55,9 +55,9 @@ def see_a_multi_step_component(step, category):
if category == 'HTML': if category == 'HTML':
html_matcher = { html_matcher = {
'Text': '\n \n', 'Text': '\n \n',
'Announcement': '<h3>Announcement Date</h3>', 'Announcement': '<h3 class="hd hd-2">Announcement Date</h3>',
'Zooming Image Tool': '<h3>Zooming Image Tool</h3>', 'Zooming Image Tool': '<h3 class="hd hd-2">Zooming Image Tool</h3>',
'E-text Written in LaTeX': '<h3>Example: E-text page</h3>', 'E-text Written in LaTeX': '<h3 class="hd hd-2">Example: E-text page</h3>',
'Raw HTML': '<p>This template is similar to the Text template. The only difference is', 'Raw HTML': '<p>This template is similar to the Text template. The only difference is',
} }
actual_html = world.css_html(selector, index=idx) actual_html = world.css_html(selector, index=idx)
......
...@@ -125,6 +125,9 @@ def my_display_name_change_is_persisted_on_save(step): ...@@ -125,6 +125,9 @@ def my_display_name_change_is_persisted_on_save(step):
@step('the problem display name is "(.*)"$') @step('the problem display name is "(.*)"$')
def verify_problem_display_name(step, name): def verify_problem_display_name(step, name):
"""
name is uppercased because the heading styles are uppercase in css
"""
assert_equal(name, world.browser.find_by_css('.problem-header').text) assert_equal(name, world.browser.find_by_css('.problem-header').text)
......
...@@ -75,6 +75,7 @@ ...@@ -75,6 +75,7 @@
// ==================== // ====================
@import 'xmodule/modules/css/module-styles.scss'; @import 'xmodule/modules/css/module-styles.scss';
@import 'xmodule/descriptors/css/module-styles.scss'; @import 'xmodule/descriptors/css/module-styles.scss';
@import 'xmodule/headings';
@import 'elements/xmodules'; // styling for Studio-specific contexts @import 'elements/xmodules'; // styling for Studio-specific contexts
@import 'developer'; // used for any developer-created scss that needs further polish/refactoring @import 'developer'; // used for any developer-created scss that needs further polish/refactoring
......
/*
* This comes from the UXPL, and is modified for use.
* The UXPL isn't available retroactively, so this shims
* the headings from the UXPL with what we're using in
* the platform to better sync things up in the meantime.
* It is scoped to #seq_content, specifically for xblock.
*
* Once the UXPl is fitted retroactively, this can be removed.
*/
$headings-count: 8;
$headings-font-weight-light: 200;
$headings-font-weight-normal: 400;
$headings-font-weight-bold: 600;
$headings-base-font-family: inherit;
$headings-base-color: $gray-d2;
%reset-headings {
margin: 0;
font-weight: $headings-font-weight-normal;
font-size: inherit;
line-height: inherit;
color: $headings-base-color;
}
%hd-1 {
margin-bottom: 1.41575em !important;
font-size: 2em !important;
line-height: 1.4em !important;
}
%hd-2 {
margin-bottom: 1em !important;
font-size: 1.5em !important;
font-weight: $headings-font-weight-normal !important;
line-height: 1.4em !important;
}
%hd-3 {
margin-bottom: ($baseline / 2) !important;
font-size: 1.35em !important;
font-weight: $headings-font-weight-normal !important;
line-height: 1.4em !important;
}
%hd-4 {
margin-bottom: ($baseline / 2) !important;
font-size: 1.25em !important;
font-weight: $headings-font-weight-bold !important;
line-height: 1.4em !important;
}
%hd-5 {
margin-bottom: ($baseline / 2) !important;
font-size: 1.1em !important;
font-weight: $headings-font-weight-bold !important;
line-height: 1.4em !important;
}
%hd-6 {
margin-bottom: ($baseline / 2) !important;
font-size: 1em !important;
font-weight: $headings-font-weight-bold !important;
line-height: 1.4em !important;
}
%hd-7 {
margin-bottom: ($baseline / 4);
font-size: 14px;
font-weight: $headings-font-weight-bold;
text-transform: uppercase;
line-height: 1.6em;
letter-spacing: 1px;
}
%hd-8 {
margin-bottom: ($baseline / 8);
font-size: 12px;
font-weight: $headings-font-weight-bold;
text-transform: uppercase;
line-height: 1.5em;
letter-spacing: 1px;
}
.wrapper-xblock {
.hd-1,
.hd-2,
.hd-3,
.hd-4,
.hd-5,
.hd-6,
.hd-7,
.hd-8 {
@extend %reset-headings;
}
// ----------------------------
// #CANNED
// ----------------------------
// canned heading classes
@for $i from 1 through $headings-count {
.hd-#{$i} {
@extend %hd-#{$i};
}
}
h3 {
@extend %hd-2;
font-weight: $headings-font-weight-normal !important;
// override external modules and xblocks that use inline CSS
text-transform: initial;
}
}
...@@ -336,7 +336,7 @@ ...@@ -336,7 +336,7 @@
<section id="problem_i4x-AndyA-ABT101-problem-46d2b65d793549e2876729d55df9a2cb" class="problems-wrapper" data-problem-id="i4x://AndyA/ABT101/problem/46d2b65d793549e2876729d55df9a2cb" data-url="/preview/xblock/i4x:;_;_AndyA;_ABT101;_problem;_46d2b65d793549e2876729d55df9a2cb/handler/xmodule_handler" data-progress_status="none" data-progress_detail="0/1"> <section id="problem_i4x-AndyA-ABT101-problem-46d2b65d793549e2876729d55df9a2cb" class="problems-wrapper" data-problem-id="i4x://AndyA/ABT101/problem/46d2b65d793549e2876729d55df9a2cb" data-url="/preview/xblock/i4x:;_;_AndyA;_ABT101;_problem;_46d2b65d793549e2876729d55df9a2cb/handler/xmodule_handler" data-progress_status="none" data-progress_detail="0/1">
<h3 class="problem-header"> <h3 class="hd hd-2 problem-header">
Multiple Choice Multiple Choice
</h3> </h3>
......
...@@ -13,11 +13,6 @@ $annotatable--body-font-size: em(14); ...@@ -13,11 +13,6 @@ $annotatable--body-font-size: em(14);
.annotatable-header { .annotatable-header {
margin-bottom: .5em; margin-bottom: .5em;
.annotatable-title {
font-size: em(22);
text-transform: uppercase;
padding: ($baseline/10) ($baseline/5);
}
} }
.annotatable-section { .annotatable-section {
......
<section class='xblock xblock-student_view xmodule_display xmodule_AnnotatableModule' data-type='Annotatable'> <section class='xblock xblock-student_view xmodule_display xmodule_AnnotatableModule' data-type='Annotatable'>
<div class="annotatable-wrapper"> <div class="annotatable-wrapper">
<div class="annotatable-header"> <div class="annotatable-header">
<div class="annotatable-title">First Annotation Exercise</div> <h3 class="hd hd-2 annotatable-title">First Annotation Exercise</h2>
</div> </div>
<div class="annotatable-section"> <div class="annotatable-section">
<div class="annotatable-section-title"> <div class="annotatable-section-title">
...@@ -32,4 +32,3 @@ ...@@ -32,4 +32,3 @@
<div class="problem"><a class="annotation-return" href="javascript:void(0)">Return to Annotation</a></div> <div class="problem"><a class="annotation-return" href="javascript:void(0)">Return to Annotation</a></div>
<div class="problem"><a class="annotation-return" href="javascript:void(0)">Return to Annotation</a></div> <div class="problem"><a class="annotation-return" href="javascript:void(0)">Return to Annotation</a></div>
<div class="problem"><a class="annotation-return" href="javascript:void(0)">Return to Annotation</a></div> <div class="problem"><a class="annotation-return" href="javascript:void(0)">Return to Annotation</a></div>
...@@ -8,7 +8,7 @@ ...@@ -8,7 +8,7 @@
<section id="problem_i4x-Me-19_002-problem-Numerical_Input" class="problems-wrapper" data-problem-id="i4x://Me/19.002/problem/Numerical_Input" data-url="/courses/Me/19.002/Test/modx/i4x://Me/19.002/problem/Numerical_Input" data-progress_status="done" data-progress_detail="1/1"> <section id="problem_i4x-Me-19_002-problem-Numerical_Input" class="problems-wrapper" data-problem-id="i4x://Me/19.002/problem/Numerical_Input" data-url="/courses/Me/19.002/Test/modx/i4x://Me/19.002/problem/Numerical_Input" data-progress_status="done" data-progress_detail="1/1">
<h3 class="problem-header"> <h3 class="hd hd-2 problem-header">
Numerical Input Numerical Input
</h3> </h3>
......
<h3 class="problem-header">Custom Javascript Display and Grading</h3> <h3 class="hd hd-2 problem-header">Custom Javascript Display and Grading</h3>
<div class="problem"> <div class="problem">
<div> <div>
......
<h3 class="problem-header">Problem Header</h3> <h3 class="hd hd-2 problem-header">Problem Header</h3>
<div class='problem-progress'></div> <div class='problem-progress'></div>
......
<h3 class="problem-header">Problem Header</h3> <h3 class="hd hd-2 problem-header">Problem Header</h3>
<div class='problem-progress'></div> <div class='problem-progress'></div>
......
...@@ -710,7 +710,7 @@ describe 'MarkdownEditingDescriptor', -> ...@@ -710,7 +710,7 @@ describe 'MarkdownEditingDescriptor', ->
""") """)
expect(data).toEqual("""<problem> expect(data).toEqual("""<problem>
<p>Not a header</p> <p>Not a header</p>
<h3 class="problem-header">A header</h3> <h3 class="hd hd-2 problem-header">A header</h3>
<p>Multiple choice w/ parentheticals</p> <p>Multiple choice w/ parentheticals</p>
<multiplechoiceresponse> <multiplechoiceresponse>
......
...@@ -202,7 +202,7 @@ class @MarkdownEditingDescriptor extends XModule.Descriptor ...@@ -202,7 +202,7 @@ class @MarkdownEditingDescriptor extends XModule.Descriptor
xml = xml.replace(/\r\n/g, '\n'); xml = xml.replace(/\r\n/g, '\n');
// replace headers // replace headers
xml = xml.replace(/(^.*?$)(?=\n\=\=+$)/gm, '<h3 class="problem-header">$1</h3>'); xml = xml.replace(/(^.*?$)(?=\n\=\=+$)/gm, '<h3 class="hd hd-2 problem-header">$1</h3>');
xml = xml.replace(/\n^\=\=+$/gm, ''); xml = xml.replace(/\n^\=\=+$/gm, '');
// Pull out demand hints, || a hint || // Pull out demand hints, || a hint ||
......
...@@ -5,14 +5,14 @@ data: | ...@@ -5,14 +5,14 @@ data: |
<p>To use this template, replace the example text with your own text.</p> <p>To use this template, replace the example text with your own text.</p>
<p>When you add the component, be sure to select <strong>Settings</strong> <p>When you add the component, be sure to select <strong>Settings</strong>
to specify a <strong>Display Name</strong> and other values that apply.</p> to specify a <strong>Display Name</strong> and other values that apply.</p>
<h3>Announcement Date</h3> <h3 class="hd hd-2">Announcement Date</h3>
<section class='update-description'> <section class='update-description'>
<section class='primary'> <section class='primary'>
<p>Short note that introduces the topic</p> <p>Short note that introduces the topic</p>
<p class='author'>Instructor's name</p> <p class='author'>Instructor's name</p>
</section> </section>
<h4>Heading for announcement 1</h4> <h4 class="hd hd-4">Heading for announcement 1</h4>
<p>Announcement 1 text</p> <p>Announcement 1 text</p>
<h4>Heading for announcement 2</h4> <h4 class="hd hd-4">Heading for announcement 2</h4>
<p>Announcement 2 text</p> <p>Announcement 2 text</p>
</section> </section>
\ No newline at end of file
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
metadata: metadata:
display_name: IFrame Tool display_name: IFrame Tool
data: | data: |
<h3>IFrame Tool</h3> <h3 class="hd hd-2">IFrame Tool</h3>
<p>Use the IFrame tool to embed an exercise or tool from any web site into your course content. For example, the tool below allows learners to experiment with how the shape of a triangle affects a line that is derived from the triangle.</p> <p>Use the IFrame tool to embed an exercise or tool from any web site into your course content. For example, the tool below allows learners to experiment with how the shape of a triangle affects a line that is derived from the triangle.</p>
<p>Exercises in an IFrame are not graded. To embed graded exercises, use a Custom JavaScript Problem.</p> <p>Exercises in an IFrame are not graded. To embed graded exercises, use a Custom JavaScript Problem.</p>
<p>The following code is the HTML format required to use the IFrame tool. For the IFrame in this template, you must replace the values in <i>italics</i>.</p> <p>The following code is the HTML format required to use the IFrame tool. For the IFrame in this template, you must replace the values in <i>italics</i>.</p>
......
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
metadata: metadata:
display_name: Full Screen Image Tool display_name: Full Screen Image Tool
data: | data: |
<h3>Full Screen Image Tool</h3> <h3 class="hd hd-2">Full Screen Image Tool</h3>
<p>Use the Full Screen Image tool to allow learners to open and zoom in on a larger version of an image in your course.</p> <p>Use the Full Screen Image tool to allow learners to open and zoom in on a larger version of an image in your course.</p>
<p>With the Full Screen Image tool, learners can see the image's details as well as its context within the unit.</p> <p>With the Full Screen Image tool, learners can see the image's details as well as its context within the unit.</p>
<p>To enable users to view the larger image, you wrap the smaller image in a link to the larger version of the image.</p> <p>To enable users to view the larger image, you wrap the smaller image in a link to the larger version of the image.</p>
......
...@@ -12,7 +12,7 @@ metadata: ...@@ -12,7 +12,7 @@ metadata:
data: | data: |
<html> <html>
<h3>Example: E-text page</h3> <h3 class="hd hd-2">Example: E-text page</h3>
<p>You can write complex equations in LaTeX.</p> <p>You can write complex equations in LaTeX.</p>
<p>When you add the component, be sure to select <strong>Settings</strong> <p>When you add the component, be sure to select <strong>Settings</strong>
to specify a <strong>Display Name</strong> and other values that apply.</p> to specify a <strong>Display Name</strong> and other values that apply.</p>
......
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
metadata: metadata:
display_name: Zooming Image Tool display_name: Zooming Image Tool
data: | data: |
<h3>Zooming Image Tool</h3> <h3 class="hd hd-2">Zooming Image Tool</h3>
<p>Use the Zooming Image Tool to enable learners to see details of large, complex images.</p> <p>Use the Zooming Image Tool to enable learners to see details of large, complex images.</p>
<p>With the Zooming Image Tool, the learner can move the mouse pointer over a part of the image to enlarge it and see more detail.</p> <p>With the Zooming Image Tool, the learner can move the mouse pointer over a part of the image to enlarge it and see more detail.</p>
<p>To use the Zooming Image Tool, you must first add the <a href="http://files.edx.org/jquery.loupeAndLightbox.js" target="_blank">jquery.loupeAndLightbox.js JavaScript file</a> to your course.</p> <p>To use the Zooming Image Tool, you must first add the <a href="http://files.edx.org/jquery.loupeAndLightbox.js" target="_blank">jquery.loupeAndLightbox.js JavaScript file</a> to your course.</p>
......
...@@ -20,45 +20,50 @@ ...@@ -20,45 +20,50 @@
scrollbar-track-color: #F5F5F5; scrollbar-track-color: #F5F5F5;
} }
.mce-content-body h1 { .mce-content-body h1,
.mce-content-body .hd-1 {
color: #3c3c3c; color: #3c3c3c;
font-weight: normal; font-weight: normal;
font-size: 2em; font-size: 2em;
line-height: 1.4em; line-height: 1.4em;
letter-spacing: 1px; margin: 0 0 1.41575em 0;
margin: 0 0 1.416em 0;
} }
.mce-content-body h2 { .mce-content-body h2,
.mce-content-body .hd-2,
.mce-content-body h3 {
color: #646464; color: #646464;
font-weight: 300; font-weight: 300;
font-size: 1.2em; font-size: 1.6em;
line-height: 1.2em; line-height: 1.4em;
letter-spacing: 1px; margin-bottom: 1.6em;
margin-bottom: 15px;
text-transform: uppercase; text-transform: uppercase;
-webkit-font-smoothing: antialiased;
} }
.mce-content-body h3, .mce-content-body h4, .mce-content-body h5, .mce-content-body h6 { .mce-content-body .hd-3,
.mce-content-body h4,
.mce-content-body .hd-4,
.mce-content-body h5,
.mce-content-body .hd-5,
.mce-content-body h6,
.mce-content-body .hd-6 {
margin: 0 0 10px 0; margin: 0 0 10px 0;
font-weight: 600; font-weight: 600;
} }
.mce-content-body h3 { .mce-content-body h4,
font-size: 1.2em; .mce-content-body .hd-4 {
} font-size: 1.4em;
.mce-content-body h4 {
font-size: 1em;
} }
.mce-content-body h5 { .mce-content-body h5,
font-size: .83em; .mce-content-body .hd-5 {
font-size: 1.2em;
} }
.mce-content-body h6 { .mce-content-body h6,
font-size: 0.75em; .mce-content-body .hd-6 {
font-size: 1em;
} }
.mce-content-body p { .mce-content-body p {
......
...@@ -44,5 +44,5 @@ class LibraryContentXBlockWrapper(PageObject): ...@@ -44,5 +44,5 @@ class LibraryContentXBlockWrapper(PageObject):
""" """
Gets headers of all child XBlocks as list of strings Gets headers of all child XBlocks as list of strings
""" """
child_blocks_headers = self.q(css=self._bounded_selector("div[data-id] h3.problem-header")) child_blocks_headers = self.q(css=self._bounded_selector("div[data-id] .problem-header"))
return frozenset(child.text for child in child_blocks_headers) return frozenset(child.text for child in child_blocks_headers)
...@@ -115,7 +115,7 @@ class AnnotatableProblemTest(UniqueCourseTest): ...@@ -115,7 +115,7 @@ class AnnotatableProblemTest(UniqueCourseTest):
self.courseware_page.visit() self.courseware_page.visit()
annotation_component_page = AnnotationComponentPage(self.browser) annotation_component_page = AnnotationComponentPage(self.browser)
self.assertEqual( self.assertEqual(
annotation_component_page.component_name, 'TEST ANNOTATION MODULE'.format() annotation_component_page.component_name, 'Test Annotation Module'.format()
) )
return annotation_component_page return annotation_component_page
......
...@@ -630,10 +630,11 @@ class YouTubeVideoTest(VideoBaseTest): ...@@ -630,10 +630,11 @@ class YouTubeVideoTest(VideoBaseTest):
""" """
Scenario: Multiple videos in sequentials all load and work, switching between sequentials Scenario: Multiple videos in sequentials all load and work, switching between sequentials
Given it has videos "A,B" in "Youtube" mode in position "1" of sequential Given it has videos "A,B" in "Youtube" mode in position "1" of sequential
And videos "E,F" in "Youtube" mode in position "2" of sequential And videos "C,D" in "Youtube" mode in position "2" of sequential
""" """
self.verticals = [ self.verticals = [
[{'display_name': 'A'}, {'display_name': 'B'}], [{'display_name': 'C'}, {'display_name': 'D'}] [{'display_name': 'A'}, {'display_name': 'B'}],
[{'display_name': 'C'}, {'display_name': 'D'}]
] ]
tab1_video_names = ['A', 'B'] tab1_video_names = ['A', 'B']
...@@ -651,15 +652,16 @@ class YouTubeVideoTest(VideoBaseTest): ...@@ -651,15 +652,16 @@ class YouTubeVideoTest(VideoBaseTest):
# go to video # go to video
self.navigate_to_video() self.navigate_to_video()
execute_video_steps(tab1_video_names) execute_video_steps(tab1_video_names)
# go to second sequential position # go to second sequential position
# import ipdb; ipdb.set_trace()
self.go_to_sequential_position(2) self.go_to_sequential_position(2)
execute_video_steps(tab2_video_names) execute_video_steps(tab2_video_names)
# go back to first sequential position # go back to first sequential position
# we are again playing tab 1 videos to ensure that switching didn't broke some video functionality. # we are again playing tab 1 videos to ensure that switching didn't broke some video functionality.
# import ipdb; ipdb.set_trace()
self.go_to_sequential_position(1) self.go_to_sequential_position(1)
execute_video_steps(tab1_video_names) execute_video_steps(tab1_video_names)
......
...@@ -115,6 +115,9 @@ def when_i_navigate_to_an_item_in_a_sequence(step): ...@@ -115,6 +115,9 @@ def when_i_navigate_to_an_item_in_a_sequence(step):
@step(u'I see the content of the section') @step(u'I see the content of the section')
def then_i_see_the_content_of_the_section(step): def then_i_see_the_content_of_the_section(step):
"""
Uppercasing the title here since CSS does it on the front-end
"""
wait_for_problem('Problem 2') wait_for_problem('Problem 2')
......
...@@ -40,6 +40,9 @@ def fill_inputs(_step): ...@@ -40,6 +40,9 @@ def fill_inputs(_step):
@step('I see the result with words count') @step('I see the result with words count')
def see_result(_step): def see_result(_step):
"""
Uppercasing since CSS capitalizes the headings
"""
strong_css = '.your_words strong' strong_css = '.your_words strong'
target_text = set([world.css_text(strong_css, i) for i in range(2)]) target_text = set([world.css_text(strong_css, i) for i in range(2)])
assert set(['text1', 'text2']) == target_text assert set(['text1', 'text2']) == target_text
......
...@@ -66,3 +66,6 @@ ...@@ -66,3 +66,6 @@
// responsive // responsive
@import 'base/layouts'; // temporary spot for responsive course @import 'base/layouts'; // temporary spot for responsive course
// xmodule
@import 'xmodule/headings';
/*
* This comes from the UXPL, and is modified for use.
* The UXPL isn't available retroactively, so this shims
* the headings from the UXPL with what we're using in
* the platform to better sync things up in the meantime.
* It is scoped to #seq_content, specifically for xblock.
*
* Once the UXPl is fitted retroactively, this can be removed.
*/
$headings-count: 8;
$headings-font-weight-light: 200;
$headings-font-weight-normal: 400;
$headings-font-weight-bold: 600;
$headings-base-font-family: inherit;
$headings-base-color: $gray-d2;
%reset-headings {
margin: 0;
font-weight: $headings-font-weight-normal;
font-size: inherit;
line-height: inherit;
color: $headings-base-color;
}
%hd-1 {
margin-bottom: 1.41575em !important;
font-size: 2em !important;
line-height: 1.4em !important;
}
%hd-2 {
margin-bottom: 1em !important;
font-size: 1.5em !important;
font-weight: $headings-font-weight-normal !important;
line-height: 1.4em !important;
}
%hd-3 {
margin-bottom: ($baseline / 2) !important;
font-size: 1.35em !important;
font-weight: $headings-font-weight-normal !important;
line-height: 1.4em !important;
}
%hd-4 {
margin-bottom: ($baseline / 2) !important;
font-size: 1.25em !important;
font-weight: $headings-font-weight-bold !important;
line-height: 1.4em !important;
}
%hd-5 {
margin-bottom: ($baseline / 2) !important;
font-size: 1.1em !important;
font-weight: $headings-font-weight-bold !important;
line-height: 1.4em !important;
}
%hd-6 {
margin-bottom: ($baseline / 2) !important;
font-size: 1em !important;
font-weight: $headings-font-weight-bold !important;
line-height: 1.4em !important;
}
%hd-7 {
margin-bottom: ($baseline / 4);
font-size: 14px;
font-weight: $headings-font-weight-bold;
text-transform: uppercase;
line-height: 1.6em;
letter-spacing: 1px;
}
%hd-8 {
margin-bottom: ($baseline / 8);
font-size: 12px;
font-weight: $headings-font-weight-bold;
text-transform: uppercase;
line-height: 1.5em;
letter-spacing: 1px;
}
#seq_content {
.hd-1,
.hd-2,
.hd-3,
.hd-4,
.hd-5,
.hd-6,
.hd-7,
.hd-8 {
@extend %reset-headings;
}
// ----------------------------
// #CANNED
// ----------------------------
// canned heading classes
@for $i from 1 through $headings-count {
.hd-#{$i} {
@extend %hd-#{$i};
}
}
h3 {
@extend %hd-2;
font-weight: $headings-font-weight-normal !important;
// override external modules and xblocks that use inline CSS
text-transform: initial;
}
}
...@@ -3,7 +3,7 @@ ...@@ -3,7 +3,7 @@
<div class="annotatable-wrapper"> <div class="annotatable-wrapper">
<div class="annotatable-header"> <div class="annotatable-header">
% if display_name is not UNDEFINED and display_name is not None: % if display_name is not UNDEFINED and display_name is not None:
<div class="annotatable-title">${display_name}</div> <h3 class="hd hd-3 annotatable-title">${display_name}</h3>
% endif % endif
</div> </div>
......
...@@ -9,7 +9,7 @@ ...@@ -9,7 +9,7 @@
<% }) %> <% }) %>
</nav> </nav>
<% } %> <% } %>
<h3 class="page-title"><%- title %></h3> <h3 class="hd hd-2 page-title"><%- title %></h3>
<p class="page-description"><%- description %></p> <p class="page-description"><%- description %></p>
</div> </div>
<div class="page-header-secondary"></div> <div class="page-header-secondary"></div>
......
...@@ -11,7 +11,7 @@ ...@@ -11,7 +11,7 @@
<div class="annotatable-wrapper"> <div class="annotatable-wrapper">
<div class="annotatable-header"> <div class="annotatable-header">
% if display_name is not UNDEFINED and display_name is not None: % if display_name is not UNDEFINED and display_name is not None:
<div class="annotatable-title">${display_name}</div> <h3 class="hd hd-2 annotatable-title">${display_name}</h3>
% endif % endif
</div> </div>
% if instructions_html is not UNDEFINED and instructions_html is not None: % if instructions_html is not UNDEFINED and instructions_html is not None:
...@@ -27,12 +27,12 @@ ...@@ -27,12 +27,12 @@
% endif % endif
<div class="annotatable-section"> <div class="annotatable-section">
<div class="annotatable-content"> <div class="annotatable-content">
<div id="imageHolder" class="openseadragon1"> <div id="imageHolder" class="openseadragon1">
<%namespace name='static' file='/static_content.html'/> <%namespace name='static' file='/static_content.html'/>
${static.css(group='style-vendor-tinymce-content', raw=True)} ${static.css(group='style-vendor-tinymce-content', raw=True)}
${static.css(group='style-vendor-tinymce-skin', raw=True)} ${static.css(group='style-vendor-tinymce-skin', raw=True)}
${static.css(group='style-xmodule-annotations', raw=True)} ${static.css(group='style-xmodule-annotations', raw=True)}
</div> </div>
<div id="catchDIV"> <div id="catchDIV">
<div class="annotationListContainer">${_('Note: only instructors may annotate.')}</div> <div class="annotationListContainer">${_('Note: only instructors may annotate.')}</div>
</div> </div>
...@@ -57,9 +57,9 @@ ...@@ -57,9 +57,9 @@
$(this).parents('.annotatable-section:first').find('.annotatable-instructions')[slideMethod](); $(this).parents('.annotatable-section:first').find('.annotatable-instructions')[slideMethod]();
} }
$('.annotatable-toggle-instructions').on('click', onClickHideInstructions); $('.annotatable-toggle-instructions').on('click', onClickHideInstructions);
//Grab uri of the course //Grab uri of the course
var parts = window.location.href.split("/"), var parts = window.location.href.split("/"),
uri = '', uri = '',
courseid; courseid;
for (var index = 0; index <= 9; index += 1) uri += parts[index]+"/"; //Get the unit url for (var index = 0; index <= 9; index += 1) uri += parts[index]+"/"; //Get the unit url
...@@ -79,16 +79,16 @@ ...@@ -79,16 +79,16 @@
optionsAnnotator: { optionsAnnotator: {
permissions:{ permissions:{
user: { user: {
id:"${user.email}", id:"${user.email}",
name:"${user.username}" name:"${user.username}"
}, },
userString: function (user) { userString: function (user) {
if (user && user.name) if (user && user.name)
return user.name; return user.name;
return user; return user;
}, },
userId: function (user) { userId: function (user) {
if (user && user.id) if (user && user.id)
return user.id; return user.id;
return user; return user;
}, },
...@@ -112,7 +112,7 @@ ...@@ -112,7 +112,7 @@
} }
for (_i = 0, _len = tokens.length; _i < _len; _i++) { for (_i = 0, _len = tokens.length; _i < _len; _i++) {
token = tokens[_i]; token = tokens[_i];
if (this.userId(user) === token) { if (this.userId(user) === token) {
return true; return true;
...@@ -199,7 +199,7 @@ ...@@ -199,7 +199,7 @@
window.osda = osda; window.osda = osda;
// END TODO // END TODO
var userId = ('${default_tab}'.toLowerCase() === 'instructor') ? var userId = ('${default_tab}'.toLowerCase() === 'instructor') ?
'${instructor_email}': '${instructor_email}':
'${user.email}'; '${user.email}';
......
...@@ -3,7 +3,7 @@ import json ...@@ -3,7 +3,7 @@ import json
from django.utils.translation import ugettext as _ from django.utils.translation import ugettext as _
%> %>
<h3 class="problem-header"> <h3 class="hd hd-2 problem-header">
## Translators: "External resource" means that this learning module is hosted on a platform external to the edX LMS ## Translators: "External resource" means that this learning module is hosted on a platform external to the edX LMS
${display_name} (${_('External resource')}) ${display_name} (${_('External resource')})
</h3> </h3>
...@@ -51,13 +51,13 @@ from django.utils.translation import ugettext as _ ...@@ -51,13 +51,13 @@ from django.utils.translation import ugettext as _
></iframe> ></iframe>
% endif % endif
% elif not hide_launch: % elif not hide_launch:
<h4 class="error_message"> <h4 class="hd hd-4 error_message">
${_('Please provide launch_url. Click "Edit", and fill in the required fields.')} ${_('Please provide launch_url. Click "Edit", and fill in the required fields.')}
</h4> </h4>
% endif % endif
% if has_score and comment: % if has_score and comment:
<h4 class="problem-feedback-label">${_("Feedback on your work from the grader:")}</h4> <h4 class="hd hd-4 problem-feedback-label">${_("Feedback on your work from the grader:")}</h4>
<div class="problem-feedback"> <div class="problem-feedback">
## sanitized with bleach in view ## sanitized with bleach in view
${comment} ${comment}
......
<%! from django.utils.translation import ugettext as _ %> <%! from django.utils.translation import ugettext as _ %>
<%namespace name='static' file='static_content.html'/> <%namespace name='static' file='static_content.html'/>
<h3 class="problem-header"> <h3 class="hd hd-2 problem-header">
${ problem['name'] } ${ problem['name'] }
</h3> </h3>
......
...@@ -7,7 +7,7 @@ ${static.css(group='style-xmodule-annotations', raw=True)} ...@@ -7,7 +7,7 @@ ${static.css(group='style-xmodule-annotations', raw=True)}
<div class="annotatable-wrapper"> <div class="annotatable-wrapper">
<div class="annotatable-header"> <div class="annotatable-header">
% if display_name is not UNDEFINED and display_name is not None: % if display_name is not UNDEFINED and display_name is not None:
<div class="annotatable-title">${display_name}</div> <h3 class="hd hd-2 annotatable-title">${display_name}</h3>
% endif % endif
</div> </div>
% if instructions_html is not UNDEFINED and instructions_html is not None: % if instructions_html is not UNDEFINED and instructions_html is not None:
...@@ -186,10 +186,10 @@ ${static.css(group='style-xmodule-annotations', raw=True)} ...@@ -186,10 +186,10 @@ ${static.css(group='style-xmodule-annotations', raw=True)}
window.ova = ova; window.ova = ova;
// END TODO // END TODO
if (typeof Annotator.Plugin["Grouping"] === 'function') if (typeof Annotator.Plugin["Grouping"] === 'function')
ova.annotator.addPlugin("Grouping"); ova.annotator.addPlugin("Grouping");
var userId = ('${default_tab}'.toLowerCase() === 'instructor') ? var userId = ('${default_tab}'.toLowerCase() === 'instructor') ?
'${instructor_email}': '${instructor_email}':
'${user.email}'; '${user.email}';
......
<%! from django.utils.translation import ugettext as _ %> <%! from django.utils.translation import ugettext as _ %>
% if display_name is not UNDEFINED and display_name is not None: % if display_name is not UNDEFINED and display_name is not None:
<h3>${display_name}</h3> <h3 class="hd hd-2">${display_name}</h3>
% endif % endif
<div <div
...@@ -23,7 +23,7 @@ ...@@ -23,7 +23,7 @@
<div class="video-player-pre"></div> <div class="video-player-pre"></div>
<section class="video-player"> <section class="video-player">
<div id="${id}"></div> <div id="${id}"></div>
<h4 class="video-error hidden">${_('No playable video sources found.')}</h4> <h4 class="hd hd-4 video-error hidden">${_('No playable video sources found.')}</h4>
</section> </section>
<div class="video-player-post"></div> <div class="video-player-post"></div>
<div class="closed-captions"></div> <div class="closed-captions"></div>
......
...@@ -7,7 +7,7 @@ ${static.css(group='style-xmodule-annotations', raw=True)} ...@@ -7,7 +7,7 @@ ${static.css(group='style-xmodule-annotations', raw=True)}
<div class="annotatable-wrapper"> <div class="annotatable-wrapper">
<div class="annotatable-header"> <div class="annotatable-header">
% if display_name is not UNDEFINED and display_name is not None: % if display_name is not UNDEFINED and display_name is not None:
<div class="annotatable-title">${display_name}</div> <h3 class="hd hd-2 annotatable-title">${display_name}</h3>
% endif % endif
</div> </div>
% if instructions_html is not UNDEFINED and instructions_html is not None: % if instructions_html is not UNDEFINED and instructions_html is not None:
...@@ -184,7 +184,7 @@ ${static.css(group='style-xmodule-annotations', raw=True)} ...@@ -184,7 +184,7 @@ ${static.css(group='style-xmodule-annotations', raw=True)}
// END TODO // END TODO
ova.annotator.addPlugin('Tags'); ova.annotator.addPlugin('Tags');
var userId = ('${default_tab}'.toLowerCase() === 'instructor') ? var userId = ('${default_tab}'.toLowerCase() === 'instructor') ?
'${instructor_email}': '${instructor_email}':
'${user.email}'; '${user.email}';
......
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