Skip to content

E
edx-platform
Commit 828430d6 by David Ormsbee
Options

Merge pull request #557 from MITx/feature/tomg/courseware_signin 

Added a log in button to the courseware when unauthenticated
parents d095b777 4a06deca
Showing with 144 additions and 57 deletions
common/lib/xmodule/xmodule/css/sequence/display.scss
...@@ -61,13 +61,12 @@ nav.sequence-nav { ...@@ -61,13 +61,12 @@ nav.sequence-nav {
min-width: 20px; min-width: 20px;
a { a {
width: 34px; width: 100%;
height: 34px; height: 42px;
margin: 4px auto; margin: 0;
background-position: center 10px; background-position: center 14px;
background-repeat: no-repeat; background-repeat: no-repeat;
border: 1px solid transparent; border: 1px solid transparent;
@include border-radius(35px);
cursor: pointer; cursor: pointer;
display: block; display: block;
padding: 0; padding: 0;
...@@ -82,7 +81,7 @@ nav.sequence-nav { ...@@ -82,7 +81,7 @@ nav.sequence-nav {
&:hover { &:hover {
background-color: #fff; background-color: #fff;
background-repeat: no-repeat; background-repeat: no-repeat;
background-position: center 10px; background-position: center 14px;
} }
&.active { &.active {
...@@ -103,7 +102,7 @@ nav.sequence-nav { ...@@ -103,7 +102,7 @@ nav.sequence-nav {
&:hover { &:hover {
background-color: #fff; background-color: #fff;
background-repeat: no-repeat; background-repeat: no-repeat;
background-position: center 10px; background-position: center 14px;
} }
} }
...@@ -298,14 +297,16 @@ nav.sequence-bottom { ...@@ -298,14 +297,16 @@ nav.sequence-bottom {
ul { ul {
@extend .clearfix; @extend .clearfix;
border: 1px solid $border-color;
@include border-radius(3px);
@include inline-block(); @include inline-block();
width: 100px; width: 103px;
li { li {
float: left; float: left;
width: 50%; width: 50px;
height: 44px;
border: 1px solid #ccc;
@include linear-gradient(top, #eee, #ddd);
@include box-shadow(0 1px 0 rgba(255, 255, 255, .7) inset);
&.prev, &.next { &.prev, &.next {
margin-bottom: 0; margin-bottom: 0;
...@@ -318,38 +319,39 @@ nav.sequence-bottom { ...@@ -318,38 +319,39 @@ nav.sequence-bottom {
padding: lh(.5) 4px; padding: lh(.5) 4px;
text-indent: -9999px; text-indent: -9999px;
@include transition(all, .2s, $ease-in-out-quad); @include transition(all, .2s, $ease-in-out-quad);
outline: 0;
&:hover { &:hover {
background-color: #ddd;
color: #000;
opacity: .5; opacity: .5;
text-decoration: none; background-position: center 15px;
} }
&.disabled { &.disabled {
opacity: .4; opacity: .4;
} }
&:focus {
outline: 0;
}
} }
} }
&.prev { &.prev {
border-radius: 35px 0 0 35px;
a { a {
background-image: url('../images/sequence-nav/previous-icon.png'); background-image: url('../images/sequence-nav/previous-icon.png');
border-right: 1px solid lighten(#c6c6c6, 10%); background-position: center 15px;
&:hover {
background-color: none;
}
} }
} }
&.next { &.next {
border-radius: 0 35px 35px 0;
border-left: none;
a { a {
background-image: url('../images/sequence-nav/next-icon.png'); background-image: url('../images/sequence-nav/next-icon.png');
background-position: center 15px;
&:hover {
background-color: none;
}
} }
} }
} }
...@@ -360,5 +362,12 @@ div.course-wrapper section.course-content ol.vert-mod > li ul.sequence-nav-butto ...@@ -360,5 +362,12 @@ div.course-wrapper section.course-content ol.vert-mod > li ul.sequence-nav-butto
list-style: none !important; list-style: none !important;
} }
.xmodule_SequenceModule nav.sequence-bottom ul li.next a,
.xmodule_SequenceModule nav.sequence-bottom ul li.prev a {
outline: 0;
&:focus {
outline: 0;
}
}
common/lib/xmodule/xmodule/js/src/sequence/display.coffee
...@@ -55,6 +55,7 @@ class @Sequence ...@@ -55,6 +55,7 @@ class @Sequence
element.removeClass('progress-none') element.removeClass('progress-none')
.removeClass('progress-some') .removeClass('progress-some')
.removeClass('progress-done') .removeClass('progress-done')
switch progress switch progress
when 'none' then element.addClass('progress-none') when 'none' then element.addClass('progress-none')
when 'in_progress' then element.addClass('progress-some') when 'in_progress' then element.addClass('progress-some')
......
lms/static/coffee/src/navigation.coffee
...@@ -13,9 +13,10 @@ class @Navigation ...@@ -13,9 +13,10 @@ class @Navigation
active: active active: active
header: 'h3' header: 'h3'
autoHeight: false autoHeight: false
$('#accordion .ui-state-active').closest('.chapter').addClass('is-open')
$('#open_close_accordion a').click @toggle $('#open_close_accordion a').click @toggle
$('#accordion').show() $('#accordion').show()
$('#accordion a').click @setChapter
log: (event, ui) -> log: (event, ui) ->
log_event 'accordion', log_event 'accordion',
...@@ -24,3 +25,8 @@ class @Navigation ...@@ -24,3 +25,8 @@ class @Navigation
toggle: -> toggle: ->
$('.course-wrapper').toggleClass('closed') $('.course-wrapper').toggleClass('closed')
setChapter: ->
$('#accordion .is-open').removeClass('is-open')
$(this).closest('.chapter').addClass('is-open')
\ No newline at end of file
lms/static/js/jquery.gradebook.js
...@@ -4,13 +4,16 @@ ...@@ -4,13 +4,16 @@
var Gradebook = function($element) { var Gradebook = function($element) {
var _this = this; var _this = this;
var $element = $element; var $element = $element;
var $body = $('body');
var $grades = $element.find('.grades'); var $grades = $element.find('.grades');
var $studentTable = $element.find('.student-table');
var $gradeTable = $element.find('.grade-table'); var $gradeTable = $element.find('.grade-table');
var $search = $element.find('.student-search-field');
var $leftShadow = $('<div class="left-shadow"></div>'); var $leftShadow = $('<div class="left-shadow"></div>');
var $rightShadow = $('<div class="right-shadow"></div>'); var $rightShadow = $('<div class="right-shadow"></div>');
var tableHeight = $gradeTable.height(); var tableHeight = $gradeTable.height();
var maxScroll = $gradeTable.width() - $grades.width(); var maxScroll = $gradeTable.width() - $grades.width();
var $body = $('body');
var mouseOrigin; var mouseOrigin;
var tableOrigin; var tableOrigin;
...@@ -58,12 +61,35 @@ var Gradebook = function($element) { ...@@ -58,12 +61,35 @@ var Gradebook = function($element) {
var targetLeft = clamp($gradeTable.position().left, -maxScroll, 0); var targetLeft = clamp($gradeTable.position().left, -maxScroll, 0);
updateHorizontalPosition(targetLeft); updateHorizontalPosition(targetLeft);
setShadows(targetLeft); setShadows(targetLeft);
} };
var updateHorizontalPosition = function(left) { var updateHorizontalPosition = function(left) {
$gradeTable.css({ $gradeTable.css({
'left': left + 'px' 'left': left + 'px'
}); });
};
var highlightRow = function(e) {
$element.find('.highlight').removeClass('highlight');
var index = $(this).index();
$studentTable.find('tr').eq(index + 1).addClass('highlight');
$gradeTable.find('tr').eq(index + 1).addClass('highlight');
};
var filter = function(e) {
var term = $(this).val();
if(term.length > 0) {
$studentTable.find('tbody tr').hide();
$gradeTable.find('tbody tr').hide();
$studentTable.find('tbody tr:contains(' + term + ')').each(function(i) {
$(this).show();
$gradeTable.find('tr').eq($(this).index() + 1).show();
});
} else {
$studentTable.find('tbody tr').show();
$gradeTable.find('tbody tr').show();
}
} }
$leftShadow.css('height', tableHeight + 'px'); $leftShadow.css('height', tableHeight + 'px');
...@@ -72,5 +98,11 @@ var Gradebook = function($element) { ...@@ -72,5 +98,11 @@ var Gradebook = function($element) {
setShadows(0); setShadows(0);
$grades.css('height', tableHeight); $grades.css('height', tableHeight);
$gradeTable.bind('mousedown', startDrag); $gradeTable.bind('mousedown', startDrag);
$element.find('tr').bind('mouseover', highlightRow);
$search.bind('keyup', filter);
$(window).bind('resize', updateWidths); $(window).bind('resize', updateWidths);
} }
\ No newline at end of file
lms/static/js/jquery.sequence.js
...@@ -27,11 +27,6 @@ var SequenceNav = function($element) { ...@@ -27,11 +27,6 @@ var SequenceNav = function($element) {
var offset = e.pageX - mouseOrigin; var offset = e.pageX - mouseOrigin;
var targetLeft = clamp(listOrigin + offset, -maxScroll, 0); var targetLeft = clamp(listOrigin + offset, -maxScroll, 0);
console.log('---------------');
console.log('offset: ' + offset);
console.log('target left: ' + targetLeft);
console.log('max: ' + maxScroll);
updateHorizontalPosition(targetLeft); updateHorizontalPosition(targetLeft);
setShadows(targetLeft); setShadows(targetLeft);
......
lms/static/sass/_discussion.scss
...@@ -150,7 +150,8 @@ $tag-text-color: #5b614f; ...@@ -150,7 +150,8 @@ $tag-text-color: #5b614f;
//user profile //user profile
.user-profile{ .user-profile {
@extend .sidebar;
margin-top: 24px; margin-top: 24px;
} }
...@@ -158,6 +159,7 @@ $tag-text-color: #5b614f; ...@@ -158,6 +159,7 @@ $tag-text-color: #5b614f;
font-size: 1.5em; font-size: 1.5em;
font-weight: bold; font-weight: bold;
line-height: 1.5em; line-height: 1.5em;
margin-top: 20px;
} }
.sidebar-user-roles { .sidebar-user-roles {
......
lms/static/sass/course/_gradebook.scss
...@@ -133,18 +133,6 @@ div.gradebook-wrapper { ...@@ -133,18 +133,6 @@ div.gradebook-wrapper {
box-shadow: 0 1px 0 $table-border-color inset, 0 2px 0 rgba(255, 255, 255, .7) inset; box-shadow: 0 1px 0 $table-border-color inset, 0 2px 0 rgba(255, 255, 255, .7) inset;
border-left: 1px solid #ccc; border-left: 1px solid #ccc;
// &:before {
// content: '';
// display: block;
// position: absolute;
// left: 0;
// top: 0;
// z-index: 9999;
// width: 1px;
// height: 50px;
// @include linear-gradient(top, rgba(0, 0, 0, 0) 30%, rgba(0, 0, 0, .15));
// }
&:first-child { &:first-child {
border-radius: 5px 0 0 0; border-radius: 5px 0 0 0;
box-shadow: 1px 1px 0 $table-border-color inset, 1px 2px 0 rgba(255, 255, 255, .7) inset; box-shadow: 1px 1px 0 $table-border-color inset, 1px 2px 0 rgba(255, 255, 255, .7) inset;
...@@ -205,6 +193,19 @@ div.gradebook-wrapper { ...@@ -205,6 +193,19 @@ div.gradebook-wrapper {
@extend .top-header; @extend .top-header;
} }
} }
.student-table tr:hover td,
.grade-table tr:hover td,
.student-table tr.highlight td,
.grade-table tr.highlight td {
border-color: #74b7d6;
@include linear-gradient(#8ed6f7, #76cbf4);
color: #333;
a {
color: #333;
}
}
} }
lms/static/sass/course/courseware/_courseware.scss
...@@ -13,6 +13,7 @@ div.course-wrapper { ...@@ -13,6 +13,7 @@ div.course-wrapper {
section.course-content { section.course-content {
@extend .content; @extend .content;
padding: 40px; padding: 40px;
line-height: 1.6;
h1 { h1 {
margin: 0 0 lh(); margin: 0 0 lh();
......
lms/static/sass/course/courseware/_sidebar.scss
...@@ -75,6 +75,10 @@ section.course-index { ...@@ -75,6 +75,10 @@ section.course-index {
@include box-shadow(0 1px 0 #fff inset, 0 -1px 0 rgba(0, 0, 0, .1) inset); @include box-shadow(0 1px 0 #fff inset, 0 -1px 0 rgba(0, 0, 0, .1) inset);
@include transition(background-color .1s); @include transition(background-color .1s);
&.is-open {
background: #fff;
}
&:first-child { &:first-child {
border-radius: 3px 0 0 0; border-radius: 3px 0 0 0;
} }
......
lms/static/sass/course/layout/_courseware_header.scss
...@@ -67,7 +67,39 @@ header.global.slim { ...@@ -67,7 +67,39 @@ header.global.slim {
@include linear-gradient(top, #fff, #eee); @include linear-gradient(top, #fff, #eee);
.guest .secondary { .guest .secondary {
margin-right: 0;
}
.guest .secondary a {
display: none; display: none;
&#login {
display: block;
@include background-image(linear-gradient(-90deg, lighten($blue, 8%), lighten($blue, 5%) 50%, $blue 50%, darken($blue, 10%) 100%));
border: 1px solid transparent;
border-color: darken($blue, 10%);
@include border-radius(3px);
@include box-sizing(border-box);
@include box-shadow(0 1px 0 0 rgba(255,255,255, 0.6));
color: #fff;
display: inline-block;
font-family: $sans-serif;
font-size: 14px;
font-weight: bold;
@include inline-block;
letter-spacing: 0;
line-height: 1em;
margin: 4px;
padding: 6px 12px 8px;
text-decoration: none;
text-transform: none;
text-shadow: 0 -1px rgba(0, 0, 0, 0.6);
vertical-align: middle;
&:hover, &.active {
@include background-image(linear-gradient(-90deg, $blue, $blue 50%, $blue 50%, $blue 100%));
}
}
} }
nav { nav {
...@@ -86,7 +118,7 @@ header.global.slim { ...@@ -86,7 +118,7 @@ header.global.slim {
height: 40px; height: 40px;
position: absolute; position: absolute;
right: 3px; right: 3px;
top: -8px; top: 0;
width: 1px; width: 1px;
} }
...@@ -97,7 +129,7 @@ header.global.slim { ...@@ -97,7 +129,7 @@ header.global.slim {
height: 40px; height: 40px;
position: absolute; position: absolute;
right: 0px; right: 0px;
top: -12px; top: 0;
width: 1px; width: 1px;
} }
} }
...@@ -129,7 +161,7 @@ header.global.slim { ...@@ -129,7 +161,7 @@ header.global.slim {
a#signup { a#signup {
position: relative; position: relative;
margin-top: 4px; margin-top: 3px;
padding: 6px 12px 8px; padding: 6px 12px 8px;
text-transform: none; text-transform: none;
font-size: 14px; font-size: 14px;
......
lms/static/sass/multicourse/_dashboard.scss
...@@ -68,8 +68,8 @@ ...@@ -68,8 +68,8 @@
@include clearfix; @include clearfix;
border-bottom: 1px dotted rgb(220,220,220); border-bottom: 1px dotted rgb(220,220,220);
list-style: none; list-style: none;
margin-bottom: 20px; margin-bottom: 15px;
padding-bottom: 10px; padding-bottom: 17px;
&:hover { &:hover {
.title .icon { .title .icon {
...@@ -77,16 +77,20 @@ ...@@ -77,16 +77,20 @@
} }
} }
span {
display: block;
}
span.title { span.title {
color: $lighter-base-font-color; color: $lighter-base-font-color;
float: left;
font-family: $sans-serif; font-family: $sans-serif;
font-size: 13px;
.icon { .icon {
background-size: cover; background-size: cover;
float: left; float: left;
height: 19px; height: 19px;
margin: 2px 8px 0 0; margin: 0 6px 0 0;
opacity: 0.6; opacity: 0.6;
@include transition(all, 0.15s, linear); @include transition(all, 0.15s, linear);
width: 19px; width: 19px;
...@@ -112,7 +116,10 @@ ...@@ -112,7 +116,10 @@
span.data { span.data {
color: $lighter-base-font-color; color: $lighter-base-font-color;
font-weight: 700; font-weight: 700;
margin-left: 12px; margin-left: 26px;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
} }
} }
} }
......
lms/templates/seq_module.html
...@@ -40,9 +40,6 @@ ...@@ -40,9 +40,6 @@
<script type="text/javascript"> <script type="text/javascript">
var sequenceNav; var sequenceNav;
$(document).ready(function() { $(document).ready(function() {
// console.log($('.sequence-nav'));
sequenceNav = new SequenceNav($('.sequence-nav')); sequenceNav = new SequenceNav($('.sequence-nav'));
console.log(sequenceNav);
}); });
</script> </script>
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