From c22677c1712bffd57d9abc1bdbd0d88a36b92ead Mon Sep 17 00:00:00 2001
From: Peter Fogg <pfogg@edx.org>
Date: Mon, 16 Nov 2015 14:20:59 -0500
Subject: [PATCH] Move Course Handouts to Course Resources and Tools.
The existing course handouts section is moved underneath Course
Updates and News, with updated styling.
ECOM-2808
---
common/lib/xmodule/xmodule/course_module.py | 4 ++--
common/test/acceptance/pages/studio/settings_advanced.py | 2 +-
lms/static/sass/course/_info.scss | 189 ++++++++++++++++++++++++++++++++++++++++++++++++++-------------------------------------------------------------------------------------------------------------------------------------------
lms/templates/courseware/info.html | 72 ++++++++++++++++++++++++++++++++++--------------------------------------
4 files changed, 87 insertions(+), 180 deletions(-)
diff --git a/common/lib/xmodule/xmodule/course_module.py b/common/lib/xmodule/xmodule/course_module.py
index 3061f29..fd99968 100644
--- a/common/lib/xmodule/xmodule/course_module.py
+++ b/common/lib/xmodule/xmodule/course_module.py
@@ -423,13 +423,13 @@ class CourseFields(object):
scope=Scope.settings
)
has_children = True
- info_sidebar_name = String(
+ info_section_name = String(
display_name=_("Course Home Sidebar Name"),
help=_(
"Enter the heading that you want students to see above your course handouts on the Course Home page. "
"Your course handouts appear in the right panel of the page."
),
- scope=Scope.settings, default='Course Handouts')
+ scope=Scope.settings, default=_('Course Resources and Tools'))
show_timezone = Boolean(
help=_(
"True if timezones should be shown on dates in the courseware. "
diff --git a/common/test/acceptance/pages/studio/settings_advanced.py b/common/test/acceptance/pages/studio/settings_advanced.py
index 10b3939..2962dbb 100644
--- a/common/test/acceptance/pages/studio/settings_advanced.py
+++ b/common/test/acceptance/pages/studio/settings_advanced.py
@@ -176,7 +176,7 @@ class AdvancedSettingsPage(CoursePage):
'advertised_start',
'announcement',
'display_name',
- 'info_sidebar_name',
+ 'info_section_name',
'is_new',
'issue_badges',
'max_student_enrollments_allowed',
diff --git a/lms/static/sass/course/_info.scss b/lms/static/sass/course/_info.scss
index 7831d5d..afa626f 100644
--- a/lms/static/sass/course/_info.scss
+++ b/lms/static/sass/course/_info.scss
@@ -44,6 +44,7 @@
div.info-wrapper {
background-color: $homepage-background;
+ border-top: none;
section.updates {
@extend .content;
@@ -54,7 +55,8 @@ div.info-wrapper {
@include text-align(left);
@extend %t-strong;
@extend %t-title6;
- margin-bottom: $baseline;
+ margin-bottom: 0;
+ @include padding(12px, 26px, 20px, 0);
font-style: normal;
}
@@ -72,7 +74,6 @@ div.info-wrapper {
padding: $baseline;
list-style-type: none;
margin-bottom: lh(1.5);
- background-color: $white;
ol, ul {
ol,ul {
@@ -128,24 +129,20 @@ div.info-wrapper {
}
}
- section.handouts {
- padding: 20px 30px;
+ section.course-dates {
+ @include padding(32px, 30px, 20px, 30px);
margin: 0;
@extend .sidebar;
background: rgba(0, 0, 0, 0);
box-shadow: none;
font-size: 14px;
- a {
- color: $link-color;
- }
-
&:after {
left: -1px;
right: auto;
}
- h1 {
+ .course-info-heading {
@include text-align(left);
@extend %t-strong;
@extend %t-title6;
@@ -154,146 +151,60 @@ div.info-wrapper {
font-style: normal;
}
- ul {
- margin-bottom: 14px;
+ @media print {
+ background: transparent !important;
}
+ }
- ol {
- margin-bottom: 14px;
- li {
- @include text-align(left);
-
- a {
- display: block;
- padding: 0;
- color: $link-color;
-
- &:hover,
- &:focus {
- background: transparent;
- }
- }
-
- &.expandable,
- &.collapsable {
- margin: 0 16px 14px 16px;
- @include transition(all .2s linear 0s);
-
- h4 {
- color: $link-color;
- font-size: 1em;
- font-weight: normal;
- padding-left: 30px;
- }
- }
-
- &.collapsable {
- background: $white;
- border-radius: 3px;
- padding: 14px 0;
- box-shadow: 0 0 1px 1px $shadow-l1, 0 1px 3px rgba(0, 0, 0, .25);
-
- h4 {
- margin-bottom: 16px;
- }
- }
-
- &.multiple {
-
- a {
- display: inline-block;
- padding: 0;
-
- &:hover,
- &:focus {
- background: transparent;
- }
- }
- }
-
- ul {
- background: none;
- margin: 0;
-
- li {
- border-bottom: 0;
- border-top: 1px solid #e6e6e6;
- font-size: 0.9em;
- margin: 0;
- padding: 15px 30px;
-
- a {
- display: inline-block;
- padding: 0;
-
- &:hover,
- &:focus {
- background: transparent;
- }
- }
- }
- }
+ section.handouts {
+ margin: $baseline;
+ border-top: ($baseline/4) solid $gray-l5;
- div.hitarea {
- background-image: url('#{$static-path}/images/treeview-default.gif') no-repeat;
- display: block;
- height: 100%;
- margin-left: 0;
- max-height: 20px;
- position: absolute;
- width: 100%;
-
- &:hover,
- &:focus {
- opacity: 0.6;
- filter: alpha(opacity=60);
-
- + h4 {
- @extend a:hover;
- text-decoration: underline;
- }
- }
+ .course-info-heading {
+ @include text-align(left);
+ @extend %t-strong;
+ @extend %t-title6;
+ margin-top: $baseline;
+ margin-bottom: ($baseline/2);
+ padding: 0;
+ font-style: normal;
+ }
- &.expandable-hitarea {
- background-position: -72px 0px;
- }
+ h1 {
+ @include text-align(left);
+ @extend %t-strong;
+ @extend %t-title7;
+ margin-bottom: 0;
+ }
- &.collapsable-hitarea {
- background-position: -55px -23px;
- }
- }
+ a {
+ color: $link-color;
+ }
- h3 {
- border-bottom: 0;
- box-shadow: none;
- color: #888;
- font-size: 1em;
- margin-bottom: 0;
- }
+ ul {
+ margin: ($baseline/2) 0;
+ padding: 0;
+ list-style: none;
- p {
- letter-spacing: 0;
- margin: 0;
- text-transform: none;
+ > li {
+ margin: ($baseline/4) 0;
+ }
+ }
- a {
- padding-right: 8px;
+ ol {
+ margin: 0;
+ padding: 0;
+ display: inline-block;
+ list-style: none;
+ @include font-size(14);
- &:before {
- color: $gray-l3;
- content: "•";
- display: inline-block;
- padding-right: 8px;
- }
+ > li {
+ margin: ($baseline/4) 0;
+ border-bottom: 2px solid $gray-l4;
+ }
- &:first-child {
- &:before {
- content: "";
- padding-right: 0;
- }
- }
- }
- }
+ li:last-child {
+ border: none;
}
}
diff --git a/lms/templates/courseware/info.html b/lms/templates/courseware/info.html
index 9891959..e51d1b7 100644
--- a/lms/templates/courseware/info.html
+++ b/lms/templates/courseware/info.html
@@ -34,15 +34,6 @@ from openedx.core.djangoapps.self_paced.models import SelfPacedConfiguration
<%include file="/courseware/course_navigation.html" args="active_page='info'" />
-<%block name="js_extra">
-<script type="text/javascript" src="${static.url('js/jquery.treeview.js')}"></script>
-<script type="text/javascript" charset="utf-8">
- $(document).ready(function(){
- $(".handouts").treeview({collapsed:true, unique:true/*, cookieId: "treeview-book-nav", persist: "cookie"*/});
- });
-</script>
-</%block>
-
<%block name="bodyclass">view-in-course view-course-info ${course.css_class or ''}</%block>
<section class="container">
<div class="home">
@@ -59,37 +50,42 @@ from openedx.core.djangoapps.self_paced.models import SelfPacedConfiguration
% endif
</div>
<div class="info-wrapper">
- % if user.is_authenticated():
- <section class="updates">
- % if studio_url is not None and masquerade and masquerade.role == 'staff':
- <div class="wrap-instructor-info studio-view">
- <a class="instructor-info-action" href="${studio_url}">
- ${_("View Updates in Studio")}
- </a>
- </div>
+ <div class="course-updates">
+ % if user.is_authenticated():
+ <section class="updates">
+ % if studio_url is not None and masquerade and masquerade.role == 'staff':
+ <div class="wrap-instructor-info studio-view">
+ <a class="instructor-info-action" href="${studio_url}">
+ ${_("View Updates in Studio")}
+ </a>
+ </div>
+ % endif
+ <h1 class="course-info-heading">${_("Course Updates and News")}</h1>
+ ${get_course_info_section(request, masquerade_user, course, 'updates')}
+ </section>
+ % if SelfPacedConfiguration.current().enable_course_home_improvements:
+ <section aria-label="${_('Important Course Dates')}" class="course-dates">
+ <h1 class="course-info-heading">${_("Important Course Dates")}</h1>
+ ${get_course_date_summary(course, user)}
+ </section>
+ % endif
+ % else:
+ <section class="updates">
+ <h1 class="course-info-heading">${_("Course Updates and News")}</h1>
+ ${get_course_info_section(request, masquerade_user, course, 'guest_updates')}
+ </section>
% endif
-
- <h1>${_("Course Updates and News")}</h1>
- ${get_course_info_section(request, masquerade_user, course, 'updates')}
- </section>
- <section aria-label="${_('Handout Navigation')}" class="handouts">
- % if SelfPacedConfiguration.current().enable_course_home_improvements:
- <h1>${_("Important Course Dates")}</h1>
- ${get_course_date_summary(course, user)}
- % endif
-
- <h1>${_(course.info_sidebar_name)}</h1>
- ${get_course_info_section(request, masquerade_user, course, 'handouts')}
- </section>
+ </div>
+ % if user.is_authenticated():
+ <section aria-label="${_('Handout Navigation')}" class="handouts">
+ <h1 class="course-info-heading">${_(course.info_section_name)}</h1>
+ ${get_course_info_section(request, masquerade_user, course, 'handouts')}
+ </section>
% else:
- <section class="updates">
- <h1>${_("Course Updates & News")}</h1>
- ${get_course_info_section(request, masquerade_user, course, 'guest_updates')}
- </section>
- <section aria-label="${_('Handout Navigation')}" class="handouts">
- <h1>${_("Course Handouts")}</h1>
- ${get_course_info_section(request, masquerade_user, course, 'guest_handouts')}
- </section>
+ <section aria-label="${_('Handout Navigation')}" class="handouts">
+ <h1 class='course-info-heading'>${_("Course Handouts")}</h1>
+ ${get_course_info_section(request, course, 'guest_handouts')}
+ </section>
% endif
</div>
</section>
--
libgit2 0.26.0