Commit 28382316 by frances botsford

Merge pull request #2867 from edx/frances/feature/lms-inst-dash-cleanup

cleanup of instructor dash membership
parents 654239dc fd101445
......@@ -69,7 +69,7 @@ class AuthListWidget extends MemberListWidget
super $container,
title: $container.data 'display-name'
info: $container.data 'info-text'
labels: ["username", "email", "revoke access"]
labels: ["Username", "Email", "Revoke access"]
add_placeholder: "Enter email"
add_btn_label: $container.data 'add-button-label'
add_handler: (input) => @add_handler input
......@@ -116,9 +116,9 @@ class AuthListWidget extends MemberListWidget
# if there are members, show the list
# create revoke button and insert it into the row
$revoke_btn = $ '<div/>',
$revoke_btn = $ '<div class="revoke"><i class="icon-remove-sign"></i> Revoke access</div>',
class: 'revoke'
click: =>
$revoke_btn.click =>
@modify_member_access member.email, 'revoke', (error) =>
# abort on error
return @show_errors error unless error is null
......@@ -271,7 +271,7 @@ class BatchEnrollment
allowed.push student_results
# The instructor is trying to unenroll someone who is not enrolled or allowed to enroll; non-sensical action.
else if data_from_server.action is 'unenroll' and not (student_results.before.enrollment) and not (student_results.before.allowed)
else if data_from_server.action is 'unenroll' and not (student_results.before.enrollment) and not (student_results.before.allowed)
notunenrolled.push student_results
else if not student_results.after.enrollment
......
......@@ -23,6 +23,10 @@
@import 'base/animations';
@import 'shared/tooltips';
// base - elements
@import 'elements/typography';
@import 'elements/controls';
// Course base / layout styles
@import 'course/layout/courseware_header';
@import 'course/layout/footer';
......
......@@ -111,8 +111,8 @@ section.instructor-dashboard-content-2 {
// }
.request-response-error {
margin-top: 1em;
margin-bottom: 1em;
margin: 0;
padding-bottom: ($baseline);
color: $error-red;
}
......@@ -280,67 +280,23 @@ section.instructor-dashboard-content-2 {
.instructor-dashboard-wrapper-2 section.idash-section#membership {
$half_width: $baseline * 20;
.vert-left {
float: left;
width: $half_width;
}
.vert-left,
.vert-right {
float: right;
width: $half_width;
}
select {
margin-bottom: 1em;
}
.revoke-link {
color: $danger-red;
text-decoration: underline;
cursor: pointer;
}
label[for="auto-enroll"]:hover + .auto-enroll-hint {
display: block;
display: inline-block;
vertical-align: top;
width: 48%;
margin-right: 2%;
}
.auto-enroll-hint {
position: absolute;
display: none;
padding: $baseline;
width: $half_width;
border: 1px solid $light-gray;
background-color: $white;
span.emph {
font-weight: bold;
}
}
label[for="email-students"]:hover + .email-students-hint {
display: block;
}
.email-students-hint {
position: absolute;
display: none;
padding: $baseline;
width: $half_width;
border: 1px solid $light-gray;
background-color: $white;
span.emph {
font-weight: bold;
}
.vert-right {
margin-right: 0;
}
.batch-enrollment {
textarea {
margin-top: 0.2em;
margin-bottom: 1em;
width: 500px;
height: 100px;
height: auto;
width: 90%;
}
input {
......@@ -366,28 +322,155 @@ section.instructor-dashboard-content-2 {
}
}
.auth-list-container {
display: none;
margin-bottom: 1.5em;
.enroll-option {
margin-bottom: ($baseline/2);
position: relative;
label {
border-bottom: 1px dotted $base-font-color;
}
.hint {
@extend %t-copy-sub2;
display: none;
position: absolute;
top: 15px;
right: 0;
padding: ($baseline/2);
width: 50%;
background-color: $light-gray;
.hint-caret {
display: block;
position: absolute;
top: 0;
left: -15px;
border-top: 8px solid $light-gray;
border-right: 8px solid $light-gray;
border-bottom: 8px solid transparent;
border-left: 8px solid transparent;
}
}
}
label[for="auto-enroll"]:hover + .auto-enroll-hint {
display: block;
}
&.active {
label[for="email-students"]:hover + .email-students-hint {
display: block;
}
.enroll-actions {
margin-top: $baseline;
}
.member-lists-management {
.wrapper-member-select {
background-color: $light-gray;
padding: ($baseline/2);
}
.member-lists-selector {
display: block;
margin: ($baseline/4) 0;
padding: ($baseline/4);
}
.revoke {
width: 10px;
height: 10px;
background: url('../images/moderator-delete-icon.png') left center no-repeat;
opacity: 0.7;
&:hover, &:focus { opacity: 0.8; }
&:active { opacity: 0.9; }
.auth-list-container {
display: none;
margin-bottom: ($baseline*1.5);
// @include idashbutton($danger-red);
// line-height: 0.6em;
// margin-top: 5px;
// padding: 6px 9px;
// font-size: 9pt;
// border-radius: 10px;
&.active {
display: block;
}
.member-list-widget {
.header {
@include box-sizing(border-box);
@include border-top-radius(3);
position: relative;
padding: ($baseline/2);
background-color: #efefef;
border: 1px solid $light-gray;
display: none; // hiding to prefer dropdown as header
}
.title {
@include font-size(16);
}
.label {
@extend %t-copy-sub1;
color: $lighter-base-font-color;
}
.info {
@include box-sizing(border-box);
padding: ($baseline/2);
border: 1px solid $light-gray;
color: $lighter-base-font-color;
line-height: 1.3em;
font-size: .85em;
}
.member-list {
@include box-sizing(border-box);
table {
width: 100%;
}
thead {
background-color: $light-gray;
}
tr {
border-bottom: 1px solid $light-gray;
}
td {
@extend %t-copy-sub1;
vertical-align: middle;
word-wrap: break-word;
padding: ($baseline/2) ($baseline/4);
border-left: 1px solid $light-gray;
border-right: 1px solid $light-gray;
}
}
.bottom-bar {
@include box-sizing(border-box);
@include border-bottom-radius(3);
position: relative;
padding: ($baseline/2);
margin-top: -1px;
border: 1px solid $light-gray;
background-color: #efefef;
box-shadow: inset #bbb 0px 1px 1px 0px;
}
// .add-field
input[type="button"].add {
@include idashbutton($blue);
position: absolute;
right: $baseline;
}
}
.revoke {
color: $lighter-base-font-color;
cursor: pointer;
&:hover {
color: $alert-color;
}
}
}
}
}
......@@ -556,102 +639,6 @@ section.instructor-dashboard-content-2 {
}
}
.member-list-widget {
$width: 20 * $baseline;
$height: 25 * $baseline;
$header-height: 3 * $baseline;
$bottom-bar-height: 3 * $baseline;
$content-height: $height - $header-height - $bottom-bar-height;
$border-radius: 3px;
width: $width;
height: $height;
.header {
@include box-sizing(border-box);
@include border-top-radius($border-radius);
position: relative;
padding: $baseline;
width: $width;
height: $header-height;
background-color: #efefef;
border: 1px solid $light-gray;
}
.title {
@include font-size(16);
}
.label {
color: $lighter-base-font-color;
font-size: $body-font-size * 4/5;
}
.info {
@include box-sizing(border-box);
max-height: $content-height;
padding: $baseline;
border: 1px solid $light-gray;
color: $lighter-base-font-color;
line-height: 1.3em;
font-size: .85em;
}
.member-list {
@include box-sizing(border-box);
overflow: auto;
padding-top: 0;
width: $width;
max-height: $content-height;
table {
width: 100%;
}
tr {
border-bottom: 1px solid $light-gray;
}
td {
table-layout: fixed;
vertical-align: middle;
word-wrap: break-word;
padding-left: 15px;
border-left: 1px solid $light-gray;
border-right: 1px solid $light-gray;
font-size: 3/4 *$body-font-size;
}
}
.bottom-bar {
@include box-sizing(border-box);
@include border-bottom-radius($border-radius);
position: relative;
width: $width;
height: $bottom-bar-height;
padding: $baseline / 2;
// border-top: none;
margin-top: -1px;
border: 1px solid $light-gray;
background-color: #efefef;
box-shadow: inset #bbb 0px 1px 1px 0px;
}
// .add-field
input[type="button"].add {
@include idashbutton($blue);
position: absolute;
right: $baseline;
}
}
input[name="subject"] {
width:600px;
}
......@@ -6,6 +6,7 @@
<div class="header">
<div class="title"> {{title}} </div>
</div>
<div class="info"> {{info}} </div>
<div class="member-list">
<table>
<thead>
......@@ -18,7 +19,6 @@
<tbody></tbody>
</table>
</div>
<div class="info"> {{info}} </div>
<div class="bottom-bar">
<input type="text" name="add-field" class="add-field" placeholder="{{add_placeholder}}">
<input type="button" name="add" class="add" value="{{add_btn_label}}">
......@@ -28,28 +28,31 @@
<div class="vert-left batch-enrollment">
<h2> ${_("Batch Enrollment")} </h2>
<p> ${_("Enter student emails separated by new lines or commas.")} </p>
<textarea rows="6" cols="50" name="student-emails" placeholder="${_("Student Emails")}" spellcheck="false"></textarea>
<br>
<input type="checkbox" name="auto-enroll" value="Auto-Enroll" style="margin-top: 1em;">
<label for="auto-enroll">${_("Auto Enroll")}</label>
<div class="auto-enroll-hint">
<p> ${_("If auto enroll is <em>checked</em>, students who have not yet registered for edX will be automatically enrolled.")}
${_("If auto enroll is left <em>unchecked</em>, students who have not yet registered for edX will not be enrolled, but will be allowed to enroll.")}
</p>
<p>
<label for="student-emails">${_("Enter student emails separated by new lines or commas.")} </label>
<textarea rows="6" name="student-emails" placeholder="${_("Student Emails")}" spellcheck="false"></textarea>
</p>
<div class="enroll-option">
<input type="checkbox" name="auto-enroll" value="Auto-Enroll" style="margin-top: 1em;">
<label for="auto-enroll">${_("Auto Enroll")}</label>
<div class="hint auto-enroll-hint">
<span class="hint-caret"></span>
<p> ${_("If auto enroll is <em>checked</em>, students who have not yet registered for edX will be automatically enrolled.")}
${_("If auto enroll is left <em>unchecked</em>, students who have not yet registered for edX will not be enrolled, but will be allowed to enroll.")}</p>
</div>
</div>
<div>
<div class="enroll-option">
<input type="checkbox" name="email-students" value="Notify-students-by-email">
<label for="email-students">${_("Notify students by email")}</label>
<div class="email-students-hint">
<p> ${_("If email students is <em>checked</em> students will receive an email notification.")}
</p>
<div class="hint email-students-hint">
<span class="hint-caret"></span>
<p> ${_("If email students is <em>checked</em> students will receive an email notification.")}</p>
</div>
</div>
<div>
<div class="enroll-actions actions">
<input type="button" name="enroll" value="${_("Enroll")}" data-endpoint="${ section_data['enroll_button_url'] }" >
<input type="button" name="unenroll" value="${_("Unenroll")}" data-endpoint="${ section_data['unenroll_button_url'] }" >
</div>
......@@ -61,12 +64,17 @@
<div class="vert-right member-lists-management">
<h2> ${_("Administration List Management")} </h2>
<select id="member-lists-selector">
<option> ${_("Getting available lists...")} </option>
</select>
<div class="request-response-error"></div>
<div class="wrapper-member-select">
<label for="member-lists-selector">Select an Administrator Group:</label>
<select id="member-lists-selector" class="member-lists-selector">
<option> ${_("Getting available lists...")} </option>
</select>
</div>
%if not section_data['access']['instructor']:
<p>
${_("Staff cannot modify staff or beta tester lists. To modify these lists, "
......
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