Skip to content

E
edx-platform
Commit c4e8673d by Marco Morales Committed by Andy Armstrong
Options

creation of a courseware preview menu to contain staff view toggle.

parent 55d2f1d5
Showing with 94 additions and 71 deletions
lms/static/sass/base/_base.scss
// lms - base
// ====================
// html {
// overflow-y: scroll;
// }
......
lms/static/sass/base/_variables.scss
......@@ -360,12 +360,14 @@ $dashboard-course-cover-border: $light-gray;
// MISC: course assets
$content-wrapper-bg: $white;
$course-bg-color: #d6d6d6;
$course-bg-image: url(../images/bg-texture.png);
$course-bg-color: #f2f2f2;
$account-content-wrapper-bg: shade($body-bg, 2%);
$course-profile-bg: rgb(245,245,245);
$course-header-bg: rgba(255,255,255, 0.93);
// MISC: course background texture
//$course-bg-image: url(../images/bg-texture.png);
// MISC: borders
$border-color-1: rgb(190,190,190);
$border-color-2: rgb(200,200,200);
......
lms/static/sass/course-rtl.scss.mako
......@@ -32,6 +32,7 @@
// course - base
@import 'course/layout/courseware_header';
@import 'course/layout/courseware_preview';
@import 'course/layout/footer';
@import 'course/base/mixins';
@import 'course/base/base';
......
lms/static/sass/course.scss.mako
......@@ -31,6 +31,7 @@
// course - base
@import 'course/layout/courseware_header';
@import 'course/layout/courseware_preview';
@import 'course/layout/footer';
@import 'course/base/mixins';
@import 'course/base/base';
......
lms/static/sass/course/base/_base.scss
// lms - course - base
// ====================
body {
min-width: 980px;
min-height: 100%;
background-image: $course-bg-image;
background-color: $course-bg-color;
//for background texture:
//background-image: $course-bg-image;
}
body, h1, h2, h3, h4, h5, h6, p, p a:link, p a:visited, a, label {
......@@ -27,7 +32,7 @@ a {
}
.container {
padding: 20px 0 0 0;
padding: 0;
> div {
display: table;
......@@ -53,6 +58,7 @@ form.choicegroup {
}
}
textarea,
input[type="text"],
input[type="email"],
......
lms/static/sass/course/base/_extends.scss
// lms - course - extends
// ====================
// lms inner wrapper
%inner-wrapper {
margin: 0 auto;
max-width: 1180px;
width: flex-grid(12);
}
// Older Course Extends - to review/remove with LMS cleanup
h1.top-header {
border-bottom: 1px solid $border-color-2;
@include text-align(left);
......
lms/static/sass/course/layout/_courseware_header.scss
nav.course-material {
.wrapper-course-material {
@include clearfix();
@include box-sizing(border-box);
border-bottom: none;
margin: 0px auto 0px;
padding: 0px;
margin: 0 auto 0;
padding: 0;
width: 100%;
.inner-wrapper {
margin: 0 auto;
max-width: 1200px;
width: flex-grid(12);
.course-material{
@extend %inner-wrapper;
}
ol.course-tabs {
@include border-top-radius(4px);
@include clearfix();
padding: 28px 0 10px 0;
@include margin-left(10px);
padding: ($baseline*0.75) 0 ($baseline*0.75) 0;
li {
@include float(left);
......@@ -30,7 +28,7 @@ nav.course-material {
}
&.prominent + li {
padding-left: 15px;
padding-left: ($baseline*0.75);
border-left: 1px solid #333;
}
......@@ -39,7 +37,7 @@ nav.course-material {
color: #555;
display: block;
text-align: center;
padding: 10px 13px 12px;
padding: ($baseline/2) 13px 12px;
font-size: 14px;
font-weight: bold;
text-decoration: none;
......@@ -74,7 +72,7 @@ nav.course-material {
header.global.slim {
box-shadow: 0 1px 2px $shadow-l1;
height: auto;
padding: 5px 0 10px 0;
padding: ($baseline/4) 0 ($baseline/2) 0;
border-bottom: 1px solid $outer-border-color;
background: $header-bg;
......@@ -119,7 +117,7 @@ header.global.slim {
}
h1.logo {
margin: 0 10px 0 13px;
margin: 0 ($baseline/2) 0 0;
@include padding-right(20px);
&:before {
......
lms/static/sass/course/layout/_courseware_preview.scss 0 → 100644
.wrapper-preview-menu {
@include clearfix();
@include box-sizing(border-box);
margin: 0 auto 0;
padding: ($baseline*0.75);
width: 100%;
background-color: $gray-l3;
.preview-menu {
@extend %inner-wrapper;
}
.preview-actions {
display: inline-block;
.action-preview {
display: inline-block;
.action-preview-label {
display: inline-block;
margin-right: ($baseline/2);
margin-bottom: 0;
vertical-align: middle;
}
}
}
}
lms/static/sass/course/layout/_courseware_subnav.scss deleted 100644 → 0
nav.course-material {
@include clearfix();
@include box-sizing(border-box);
background: none;
margin: 0px auto 0px;
padding: 0px;
width: 100%;
.inner-wrapper {
margin: 0 auto;
max-width: 1200px;
width: flex-grid(12);
}
ol.course-tabs {
@include border-top-radius(4px);
@include clearfix();
padding: 10px 0 0 0;
li {
@include float(left);
list-style: none;
a {
color: darken($lighter-base-font-color, 20%);
display: block;
text-align: center;
padding: 8px 13px 12px;
font-size: 14px;
font-weight: 400;
text-decoration: none;
text-shadow: 0 1px rgb(255,255,255);
&:hover, &:focus {
color: $base-font-color;
}
&.active {
color: $blue;
}
}
}
}
}
.course-content {
margin-top: ($baseline*1.5);
.courseware {
min-height: 300px;
}
}
lms/static/sass/ie.scss
......@@ -139,7 +139,7 @@
}
// active navigation
nav.course-material ol.course-tabs li a.active, nav.course-material .xmodule_SequenceModule nav.sequence-nav ol.course-tabs li a.seq_video.active, .xmodule_SequenceModule nav.sequence-nav nav.course-material ol.course-tabs li a.seq_video.active {
nav.wrapper-course-material ol.course-tabs li a.active, nav.wrapper-course-material .xmodule_SequenceModule nav.sequence-nav ol.course-tabs li a.seq_video.active, .xmodule_SequenceModule nav.sequence-nav nav.wrapper-course-material ol.course-tabs li a.seq_video.active {
background-color: #333;
background-color: rgba(0, 0, 0, .4);
}
......
lms/templates/courseware/course_navigation.html
......@@ -23,9 +23,35 @@ def url_class(is_active):
user_is_enrolled = user.is_authenticated() and CourseEnrollment.is_enrolled(user, course.id)
%>
% if show_preview_menu:
<nav class="wrapper-preview-menu">
<div class="preview-menu">
<ol class="preview-actions">
<li class="action-preview">
<form action="#" class="action-preview-form" method="post">
<label for="action-preview-select" class="action-preview-label">${_("previewing as:")}</label>
<select class="action-preview-select" id="action-preview-select" name="select">
<option value="staff" ${"selected" if not is_student_masquerade else ""}>${_("Staff")}</option>
<option value="student" ${"selected" if is_student_masquerade and not masquerade_group_id else ""}>${_("Student")}</option>
% if cohorted_user_partition:
% for group in sorted(cohorted_user_partition.groups, key=lambda group: group.name):
<option value="group.id" data-group-id="${group.id}" ${"selected" if masquerade_group_id == group.id else ""}>
${_("Student in {content_group}").format(content_group=group.name)}
</option>
% endfor
% endif
</select>
<button type="submit" class="sr" name="submit" value="submit">${_("set preview mode")}</button>
</form>
</li>
</ol>
</div>
</nav>
% endif
% if disable_tabs is UNDEFINED or not disable_tabs:
<nav class="${active_page} course-material">
<div class="inner-wrapper">
<nav class="${active_page} wrapper-course-material">
<div class="course-material">
<ol class="course-tabs">
% for tab in CourseTabList.iterate_displayable(course, settings, user.is_authenticated(), has_access(user, 'staff', course, course.id), user_is_enrolled):
<%
......
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