diff --git a/lms/envs/common.py b/lms/envs/common.py
index 3a6aa5246ea0acf3ebf077c9fcf04a474be8fdf8..442798e3942019015b9ed963f93fd18f67cd31db 100644
--- a/lms/envs/common.py
+++ b/lms/envs/common.py
@@ -547,6 +547,7 @@ MAIN_MAKO_TEMPLATES_BASE = [
OPENEDX_ROOT / 'core' / 'djangoapps' / 'cors_csrf' / 'templates',
OPENEDX_ROOT / 'core' / 'djangoapps' / 'dark_lang' / 'templates',
OPENEDX_ROOT / 'core' / 'lib' / 'license' / 'templates',
+ OPENEDX_ROOT / 'features' / 'course_experience' / 'templates',
]
@@ -1657,6 +1658,18 @@ PIPELINE_CSS = {
],
'output_filename': 'css/lms-learner-dashboard-rtl.css',
},
+ 'style-mobile': {
+ 'source_filenames': [
+ 'css/lms-mobile.css',
+ ],
+ 'output_filename': 'css/lms-mobile.css',
+ },
+ 'style-mobile-rtl': {
+ 'source_filenames': [
+ 'css/lms-mobile-rtl.css',
+ ],
+ 'output_filename': 'css/lms-mobile-rtl.css',
+ },
}
diff --git a/lms/static/sass/_build-mobile.scss b/lms/static/sass/_build-mobile.scss
new file mode 100644
index 0000000000000000000000000000000000000000..004a4159addf470d0348a42961fe65d2384311b9
--- /dev/null
+++ b/lms/static/sass/_build-mobile.scss
@@ -0,0 +1,6 @@
+// ------------------------------
+// Mobile: Shared Build Compile
+
+// Base build
+@import 'base/build';
+@import 'mobile/main';
diff --git a/lms/static/sass/lms-mobile-rtl.scss b/lms/static/sass/lms-mobile-rtl.scss
new file mode 100644
index 0000000000000000000000000000000000000000..26af472e935ebb026018b61a842be6f7d5675dbd
--- /dev/null
+++ b/lms/static/sass/lms-mobile-rtl.scss
@@ -0,0 +1,5 @@
+// ------------------------------
+// Mobile styling
+@import 'bourbon/bourbon';
+@import 'vendor/bi-app/bi-app-rtl'; // set the layout for right to left languages
+@import 'build-mobile';
diff --git a/lms/static/sass/lms-mobile.scss b/lms/static/sass/lms-mobile.scss
new file mode 100644
index 0000000000000000000000000000000000000000..0d5626de564401e9ad46f94f27546b2c366cbf64
--- /dev/null
+++ b/lms/static/sass/lms-mobile.scss
@@ -0,0 +1,5 @@
+// ------------------------------
+// Mobile styling
+@import 'bourbon/bourbon';
+@import 'vendor/bi-app/bi-app-ltr'; // set the layout for left to right languages
+@import 'build-mobile';
diff --git a/lms/static/sass/mobile/_main.scss b/lms/static/sass/mobile/_main.scss
new file mode 100644
index 0000000000000000000000000000000000000000..ba6cd22bde3ba25816dd0f9d3853791cc6d63a2a
--- /dev/null
+++ b/lms/static/sass/mobile/_main.scss
@@ -0,0 +1,6 @@
+body {
+ @include padding-left($baseline);
+ @include padding-right($baseline);
+
+ background: theme-color("inverse");
+}
diff --git a/openedx/features/course_experience/templates/course_experience/course-dates-fragment.html b/openedx/features/course_experience/templates/course_experience/course-dates-fragment.html
index a1295fff0e3563988647f84fe60cd3be0307e2f7..1339148c24b0d59aff7abd3353413142b3dab33b 100644
--- a/openedx/features/course_experience/templates/course_experience/course-dates-fragment.html
+++ b/openedx/features/course_experience/templates/course_experience/course-dates-fragment.html
@@ -11,28 +11,7 @@ from django.utils.translation import ugettext as _
## Should be organized by date, last date appearing at the bottom
% for course_date in course_date_blocks:
- <div class="date-summary-container">
- <div class="date-summary date-summary-${course_date.css_class}">
- % if course_date.title:
- % if course_date.title == 'current_datetime':
- <span class="hd hd-6 heading localized-datetime" data-datetime="${course_date.date}" data-string="${_(u'Today is {date}')}" data-timezone="${user_timezone}" data-language="${user_language}"></span>
- % else:
- <span class="hd hd-6 heading">${course_date.title}</span>
- % endif
- % endif
- % if course_date.date and course_date.title != 'current_datetime':
- <p class="hd hd-6 date localized-datetime" data-format="shortDate" data-datetime="${course_date.date}" data-timezone="${user_timezone}" data-language="${user_language}" data-string="${_(course_date.relative_datestring)}"></p>
- % endif
- % if course_date.description:
- <p class="description">${course_date.description}</p>
- % endif
- % if course_date.link and course_date.link_text:
- <span class="date-summary-link">
- <a href="${course_date.link}">${course_date.link_text}</a>
- </span>
- % endif
- </div>
- </div>
+ <%include file="dates-summary.html" args="course_date=course_date" />
% endfor
<%static:require_module_async module_name="js/dateutil_factory" class_name="DateUtilFactory">
diff --git a/openedx/features/course_experience/templates/course_experience/dates-summary.html b/openedx/features/course_experience/templates/course_experience/dates-summary.html
new file mode 100644
index 0000000000000000000000000000000000000000..b13035bad0bc436496bc519d87e45e5c6396b1d3
--- /dev/null
+++ b/openedx/features/course_experience/templates/course_experience/dates-summary.html
@@ -0,0 +1,26 @@
+<%!
+from django.utils.translation import ugettext as _
+%>
+<%page args="course_date" expression_filter="h"/>
+<div class="date-summary-container">
+ <div class="date-summary date-summary-${course_date.css_class}">
+ % if course_date.title:
+ % if course_date.title == 'current_datetime':
+ <span class="hd hd-6 heading localized-datetime" data-datetime="${course_date.date}" data-string="${_(u'Today is {date}')}" data-timezone="${user_timezone}" data-language="${user_language}"></span>
+ % else:
+ <span class="hd hd-6 heading">${course_date.title}</span>
+ % endif
+ % endif
+ % if course_date.date and course_date.title != 'current_datetime':
+ <p class="hd hd-6 date localized-datetime" data-format="shortDate" data-datetime="${course_date.date}" data-timezone="${user_timezone}" data-language="${user_language}" data-string="${_(course_date.relative_datestring)}"></p>
+ % endif
+ % if course_date.description:
+ <p class="description">${course_date.description}</p>
+ % endif
+ % if course_date.link and course_date.link_text:
+ <span class="date-summary-link">
+ <a href="${course_date.link}">${course_date.link_text}</a>
+ </span>
+ % endif
+ </div>
+</div>
diff --git a/openedx/features/course_experience/templates/course_experience/mobile/course-dates-fragment.html b/openedx/features/course_experience/templates/course_experience/mobile/course-dates-fragment.html
new file mode 100644
index 0000000000000000000000000000000000000000..5fb3e10f3d81e2a636387d7371b7db1237a2e148
--- /dev/null
+++ b/openedx/features/course_experience/templates/course_experience/mobile/course-dates-fragment.html
@@ -0,0 +1,13 @@
+## mako
+
+<%page expression_filter="h"/>
+
+<%namespace name="static" file="../../static_content.html"/>
+
+% for course_date in course_date_blocks:
+ <%include file="../dates-summary.html" args="course_date=course_date"/>
+% endfor
+
+<%static:require_module_async module_name="js/dateutil_factory" class_name="DateUtilFactory">
+ DateUtilFactory.transform(".localized-datetime");
+</%static:require_module_async>
diff --git a/openedx/features/course_experience/tests/views/test_course_dates.py b/openedx/features/course_experience/tests/views/test_course_dates.py
index c3670a857da0bc1832bb4ed2098e5abe627cc7f3..ab2fb356722c1d5aa9166916be9b2f96f0a7ea7b 100644
--- a/openedx/features/course_experience/tests/views/test_course_dates.py
+++ b/openedx/features/course_experience/tests/views/test_course_dates.py
@@ -38,7 +38,6 @@ class TestCourseDatesFragmentView(ModuleStoreTestCase):
def test_course_dates_fragment(self):
response = self.client.get(self.dates_fragment_url)
- self.assertContains(response, 'Important Course Dates')
self.assertContains(response, 'Today is')
self.assertContains(response, 'Course End')
diff --git a/openedx/features/course_experience/views/course_dates.py b/openedx/features/course_experience/views/course_dates.py
index a124830089784d17c6b3861fc62c285313725131..941f4fb2e0c78386601e01dd8524e3be715fb49e 100644
--- a/openedx/features/course_experience/views/course_dates.py
+++ b/openedx/features/course_experience/views/course_dates.py
@@ -3,6 +3,7 @@ Fragment for rendering the course dates sidebar.
"""
from django.http import Http404
from django.template.loader import render_to_string
+from django.utils.translation import get_language_bidi
from opaque_keys.edx.keys import CourseKey
from web_fragments.fragment import Fragment
@@ -14,6 +15,8 @@ class CourseDatesFragmentView(EdxFragmentView):
"""
A fragment to important dates within a course.
"""
+ template_name = 'course_experience/course-dates-fragment.html'
+
def render_to_fragment(self, request, course_id=None, **kwargs):
"""
Render the course dates fragment.
@@ -25,8 +28,11 @@ class CourseDatesFragmentView(EdxFragmentView):
context = {
'course_date_blocks': course_date_blocks
}
- html = render_to_string('course_experience/course-dates-fragment.html', context)
- return Fragment(html)
+ html = render_to_string(self.template_name, context)
+ dates_fragment = Fragment(html)
+ self.add_fragment_resource_urls(dates_fragment)
+
+ return dates_fragment
class CourseDatesFragmentMobileView(CourseDatesFragmentView):
@@ -39,8 +45,23 @@ class CourseDatesFragmentMobileView(CourseDatesFragmentView):
mechanism to automatically create/recreate session with the server for all
authenticated requests if the server returns 404.
"""
+ template_name = 'course_experience/mobile/course-dates-fragment.html'
+
def get(self, request, *args, **kwargs):
if not request.user.is_authenticated():
raise Http404
return super(CourseDatesFragmentMobileView, self).get(request, *args, **kwargs)
+
+ def css_dependencies(self):
+ """
+ Returns list of CSS files that this view depends on.
+
+ The helper function that it uses to obtain the list of CSS files
+ works in conjunction with the Django pipeline to ensure that in development mode
+ the files are loaded individually, but in production just the single bundle is loaded.
+ """
+ if get_language_bidi():
+ return self.get_css_dependencies('style-mobile-rtl')
+ else:
+ return self.get_css_dependencies('style-mobile')