Skip to content

E
edx-platform
Commit 54a8a4fc by Chris Rodriguez Committed by Andy Armstrong
Options

Addressing items in the latest PR; includes RTL-ifying all SCSS

parent 79cd3210
Showing with 158 additions and 532 deletions
lms/static/js/groups/views/cohorts.js
......@@ -13,8 +13,8 @@ var edx = edx || {};
events : {
'change .cohort-select': 'onCohortSelected',
'click .action-create': 'showAddCohortForm',
'click .cohort-management-add-modal .action-save': 'saveAddCohortForm',
'click .cohort-management-add-modal .action-cancel': 'cancelAddCohortForm',
'click .cohort-management-add-form .action-save': 'saveAddCohortForm',
'click .cohort-management-add-form .action-cancel': 'cancelAddCohortForm',
'click .link-cross-reference': 'showSection',
'click .toggle-cohort-management-secondary': 'showCsvUpload'
},
......@@ -148,7 +148,7 @@ var edx = edx || {};
context: this.context
});
this.cohortFormView.render();
this.$('.cohort-management-add-modal').append(this.cohortFormView.$el);
this.$('.cohort-management-add-form').append(this.cohortFormView.$el);
this.setCohortEditorVisibility(false);
},
......
lms/static/js/spec/groups/views/cohorts_spec.js
......@@ -87,7 +87,7 @@ define(['backbone', 'jquery', 'js/common_helpers/ajax_helpers', 'js/common_helpe
};
getAddModal = function() {
return cohortsView.$('.cohort-management-add-modal');
return cohortsView.$('.cohort-management-add-form');
};
selectContentGroup = function(groupId, userPartitionId) {
......
lms/static/sass/course/instructor/_cohort-management.scss deleted 100644 → 0
.cohort-management {
.has-option-unavailable { // Given to <selects> that have some options that are unavailable
.option-unavailable { // Allows granular styling (i.e., red) for those unavailable options
background: $red-l5;
color: $error-red;
}
}
.has-other { // Given to groups which have an 'other' input that appears when needed
display: inline-block;
label {
display: inline-block;
}
.input-group-other {
display: none;
&.is-visible {
display: inline;
position: relative;
overflow: auto;
width: 100%;
height: auto;
margin: 0 0 0 $baseline;
padding: inherit;
border: inherit;
clip: auto;
}
}
}
.cohort-management-nav {
margin-bottom: $baseline;
.action-create {
margin-top: $baseline;
}
}
.cohort-management-settings {
@include clearfix();
background: $gray-l5;
.cohort-manage-group-header {
padding: 0;
border-bottom: 0;
.group-header-title {
padding: $baseline;
margin-bottom: 0;
border-bottom: 1px solid $gray-l3;
text-transform: none;
letter-spacing: normal;
}
.cohort-management-group-setup {
padding: $baseline;
.cohort-management-group-text {
display: inline-block;
width: flex-grid(9);
}
.cohort-management-group-actions {
display: inline-block;
width: flex-grid(3);
vertical-align: top;
.float-right {
float: right;
}
}
}
}
.cohort-management-details,
.cohort-management-group-add {
border-top: ($baseline/5) solid $gray-l4;
background: $white;
.cohort-details-name {
@extend %t-action1;
display: block;
width: 100%;
padding: ($baseline/2);
margin-bottom: ($baseline*2);
}
.cohort-section-header {
margin-top: ($baseline*1.5);
padding: $baseline 0 ($baseline/2) 0;
}
.cohort-section-header > .form-fields {
padding-bottom: $baseline;
}
}
}
.form-actions:last-child {
margin-top: $baseline;
.action-primary {
@include idashbutton($blue);
padding: 7px $baseline;
text-shadow: none;
}
}
.wrapper-tabs { // This applies to the tab-like interface that toggles between the student management and the group settings
@extend %ui-no-list;
@extend %ui-depth1;
position: relative;
top: ($baseline/5);
padding: 0 $baseline;
.tab {
position: relative;
display: inline-block;
a {
display: inline-block;
padding: $baseline;
}
&.is-selected { // Active or selected tabs (<li>) get this class. Also useful for aria stuff if ever implemented in the future.
a {
padding-bottom: ($baseline+($baseline/5));
border-style: solid;
border-width: ($baseline/5) ($baseline/5) 0 ($baseline/5);
border-color: $gray-l4;
background: $white;
color: inherit;
cursor: default;
}
}
}
}
}
lms/static/sass/course/instructor/_instructor_2.scss
@mixin idashbutton ($color) {
@include button(simple, $color);
@extend .button-reset;
margin-bottom: 1em;
padding: 8px 17px 8px 17px;
padding: 8px 17px;
font-size: em(13);
line-height: 1.3em;
......@@ -21,14 +20,14 @@
.olddash-button-wrapper {
position: absolute;
top: 16px;
right: 15px;
@include right(15px);
@include font-size(16);
}
.studio-edit-link{
position: absolute;
top: 40px;
right: 15px;
@include right(15px);
@include font-size(16);
}
......@@ -57,30 +56,29 @@
// TYPE: inline
.msg-inline {
// @extend %t-copy-sub1;
display: inline-block;
margin: 0 0 0 $baseline;
@include margin-left($baseline);
padding: 0;
.icon,
.fa {
margin-right: ($baseline/2);
@include margin-right($baseline/2);
}
}
// TYPE: warning
.msg-warning {
border-top: 2px solid $warning-color;
background: tint($warning-color,95%);
display: none;
background: tint($warning-color,95%);
border-top: 2px solid $warning-color;
color: $warning-color;
}
// TYPE: confirm
.msg-confirm {
border-top: 2px solid $confirm-color;
background: tint($confirm-color,95%);
display: none;
background: tint($confirm-color,95%);
border-top: 2px solid $confirm-color;
color: $confirm-color;
}
......@@ -104,12 +102,14 @@
}
.copy-error {
@include font-size(14);
color: $error-color;
}
.list-advice {
@extend %ui-no-list;
margin: $baseline 0;
padding: 0;
list-style: none;
.item {
font-weight: 600;
......@@ -139,8 +139,8 @@
// ====================
.instructor-dashboard-content-2 {
@extend .content;
padding: 40px;
width: 100%;
padding: 40px;
.wrap-instructor-info {
display: inline;
......@@ -159,14 +159,10 @@
}
.slickgrid {
margin-left: 1px;
color:#333333;
font-size:12px;
@include margin-left(1px);
@include font-size(12px);
font-family: verdana,arial,sans-serif;
.slick-header-column {
// height: 100%
}
color: #333333;
.slick-cell {
border: 1px dotted silver;
......@@ -179,25 +175,19 @@
h1 {
@extend .top-header;
display: inline-block;
margin-bottom: ($baseline*.75);
padding-bottom: 0;
border-bottom: 0;
margin-bottom: ($baseline*0.75);
}
input[type="button"] {
@include idashbutton(#eee);
&.molly-guard {
// @include idashbutton($danger-red);
// @include idashbutton($black);
// border: 2px solid $danger-red;
}
}
.instructor_dash_glob_info {
position: absolute;
@include right(50px);
top: 46px;
right: 50px;
text-align: right;
}
......@@ -229,11 +219,11 @@
// messages
.message {
display: block;
margin-top: $baseline;
margin-bottom: $baseline;
display: block;
border-radius: 1px;
padding: ($baseline*0.75) $baseline;
border-radius: 1px;
}
.message-title {
......@@ -322,15 +312,15 @@
margin-bottom: ($baseline/2);
.value {
float: left;
@include float(left);
}
.description {
@extend %t-title7;
float: right;
@include float(right);
@include text-align(right);
text-transform: none;
letter-spacing: 0;
text-align: right;
color: $gray;
}
}
......@@ -368,15 +358,15 @@
width: 300px;
cursor: pointer;
div {
float:left;
@include float(left);
}
h2 {
float: left;
@include float(left);
}
.triangle {
float: left;
@include float(left);
width: 20px;
height: 20px;
background-image: url('/static/images/bullet-closed.png');
......@@ -391,7 +381,7 @@
.course-error {
margin-bottom: 1em;
margin-left: 0.5em;
@include margin-left(0.5em);
code {
&.course-error-first {
......@@ -426,8 +416,8 @@
.tip {
display: block;
margin-top: ($baseline/4);
color: tint(rgb(127,127,127),50%);
@include font-size(12);
color: tint(rgb(127,127,127),50%);
}
}
}
......@@ -450,11 +440,15 @@
.form-fields {
.label, .input, .tip {
.label,
.form-label,
.input,
.tip {
display: block;
}
.label {
.label,
.form-label {
@extend %t-title7;
@extend %t-weight4;
margin-bottom: ($baseline/2);
......@@ -508,7 +502,7 @@
.cohort-management-nav-form {
width: 60%;
float: left;
@include float(left);
}
.cohort-select {
......@@ -519,8 +513,8 @@
.action-create {
@include idashbutton($blue);
@extend %t-weight4;
float: right;
text-align: right;
@include float(right);
@include text-align(right);
text-shadow: none;
}
......@@ -550,41 +544,35 @@
.cohort-management-settings,
.cohort-management-edit {
@extend %cohort-management-form;
border: 1px solid $gray-l5;
margin-bottom: $baseline;
.message {
margin-left: $baseline;
margin-right: $baseline;
}
.form-title {
@extend %t-title5;
@extend %t-weight4;
border-bottom: ($baseline/10) solid $gray-l4;
background: $gray-l5;
padding: $baseline;
background: $gray-l5;
border-bottom: ($baseline/10) solid $gray-l4;
}
.form-field {
padding: $baseline;
// padding: $baseline;
}
.form-actions {
padding: 0 $baseline $baseline $baseline;
@include padding($baseline 0 $baseline 0);
}
}
// cohort group
.cohort-management-group-header {
padding: $baseline;
border-bottom: ($baseline/10) solid $gray-l4;
background: $gray-l5;
padding: $baseline;
.group-header-title {
margin-bottom: ($baseline/2);
border-bottom: 1px solid $gray-l4;
padding-bottom: ($baseline/2);
border-bottom: 1px solid $gray-l4;
&:hover, &:active, &:focus {
......@@ -603,7 +591,7 @@
.title-value {
@extend %t-title5;
@extend %t-weight4;
margin-right: ($baseline/4);
@include margin-right($baseline/4);
}
.group-count {
......@@ -616,11 +604,11 @@
@include transition(opacity $tmg-f2 ease-in-out);
@include font-size(14);
@include line-height(14);
margin-left: ($baseline/2);
@include margin-left($baseline/2);
padding: ($baseline/4) ($baseline/2);
margin-bottom: 0;
opacity: 0.0;
pointer-events: none;
padding: ($baseline/4) ($baseline/2);
}
}
......@@ -630,22 +618,21 @@
color: $gray-l2;
.setup-value {
float: left;
@include float(left);
@include margin-right(5%);
width: 70%;
margin-right: 5%;
}
.setup-actions {
float: right;
@include float(right);
@include text-align(right);
width: 20%;
text-align: right;
}
}
.cohort-management-group-add {
@extend %cohort-management-form;
border: 1px solid $gray-l5;
padding: $baseline $baseline 0 $baseline;
.message-title {
@extend %t-title7;
......@@ -655,9 +642,9 @@
@extend %t-title6;
@extend %t-weight4;
margin-bottom: ($baseline/4);
padding: 0;
border: none;
background: transparent;
padding: 0;
}
.form-introduction {
......@@ -731,7 +718,7 @@
.icon {
margin-right: ($baseline/4);
@include margin-right($baseline/4);
color: $gray-l1;
}
}
......@@ -762,8 +749,6 @@
padding: 0;
list-style-type: none;
line-height: 1.5em;
li {
}
}
}
}
......@@ -773,7 +758,7 @@
}
.enrollment_signup_button {
margin-right: ($baseline/4);
@include margin-right($baseline/4);
}
// Custom File upload
.customBrowseBtn {
......@@ -783,18 +768,18 @@
position:relative;
overflow:hidden;
display: inline;
margin-left: -5px;
@include margin-left(-5px);
span.browse{
@include button(simple, $blue);
@include margin-right($baseline);
padding: 6px ($baseline/2);
font-size: 12px;
border-radius: 0 3px 3px 0;
margin-right: ($baseline);
}
input.file_field {
position:absolute;
@include right(0);
top:0;
right:0;
margin:0;
padding:0;
cursor:pointer;
......@@ -806,10 +791,10 @@
vertical-align: middle;
}
input[disabled] {
cursor: not-allowed;
@include border-radius(4px 0 0 4px);
@include padding(6px 6px 5px);
border: 1px solid $lightGrey1;
border-radius: 4px 0 0 4px;
padding: 6px 6px 5px;
cursor: not-allowed;
}
}
}
......@@ -827,7 +812,7 @@
display: none;
position: absolute;
top: 15px;
left: ($baseline*10);
@include left($baseline*10);
padding: ($baseline/2);
width: 50%;
background-color: $light-gray;
......@@ -837,11 +822,11 @@
display: block;
position: absolute;
top: 0;
left: -15px;
@include left(-15px);
@include border-right(8px solid $light-gray);
@include border-left(8px solid transparent);
border-top: 8px solid $light-gray;
border-right: 8px solid $light-gray;
border-bottom: 8px solid transparent;
border-left: 8px solid transparent;
}
}
}
......@@ -872,8 +857,8 @@
.member-lists-management {
.wrapper-member-select {
background-color: $light-gray;
padding: ($baseline/2);
background-color: $light-gray;
}
.member-lists-selector {
......@@ -906,7 +891,8 @@
@include font-size(16);
}
.label {
.label,
.form-label {
@extend %t-copy-sub1;
color: $lighter-base-font-color;
}
......@@ -938,10 +924,10 @@
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;
@include border-left(1px solid $light-gray);
@include border-right(1px solid $light-gray);
word-wrap: break-word;
}
}
......@@ -976,12 +962,6 @@
}
}
/*
* Begin additional/override styles for cohort management.
* Placed for merge, but will need to be cleaned up and
* refactored in this stylesheet.
*/
.has-other-input-text { // Given to groups which have an 'other' input that appears when needed
display: inline-block;
......@@ -995,7 +975,7 @@
overflow: auto;
width: 100%;
height: auto;
margin: 0 0 0 $baseline;
margin: 0;
padding: inherit;
border: inherit;
clip: auto;
......@@ -1023,8 +1003,8 @@
border-bottom: 0;
.group-header-title {
padding: $baseline;
margin-bottom: 0;
padding: $baseline;
border-bottom: 1px solid $gray-l3;
text-transform: none;
letter-spacing: normal;
......@@ -1042,14 +1022,14 @@
display: inline-block;
width: flex-grid(3);
vertical-align: top;
text-align: right;
@include text-align(right);
}
}
}
.cohort-management-details,
.cohort-management-group-add {
border-top: ($baseline/5) solid $gray-l4;
border-top: 1px solid $gray-l4;
background: $white;
.cohort-management-settings {
......@@ -1068,7 +1048,7 @@
.cohort-section-header {
margin-top: ($baseline*1.5);
padding: $baseline 0 ($baseline/2) 0;
@include padding($baseline 0 ($baseline/2) 0);
}
.cohort-section-header > .form-field {
......@@ -1081,7 +1061,7 @@
@extend %ui-no-list;
@extend %ui-depth1;
position: relative;
top: (($baseline/5));
top: 1px;
padding: 0 $baseline;
.tab {
......@@ -1091,6 +1071,7 @@
a {
display: inline-block;
padding: ($baseline - 5);
// These transitions null out previously/globally set transitions
-webkit-transition: none;
-moz-transition: none;
-ms-transition: none;
......@@ -1103,7 +1084,7 @@
a {
padding-bottom: ($baseline - 5);
border-style: solid;
border-width: ($baseline/5) ($baseline/5) 0 ($baseline/5);
@include border-width(1px 1px 0 1px);
border-color: $gray-l4;
background: $white;
color: inherit;
......@@ -1112,11 +1093,12 @@
}
}
}
.tab-content {
@include padding($baseline $baseline 0 $baseline);
border: 1px solid $gray-l5;
}
}
/*
* End of additions/overrides
* Don't forget to refactor.
*/
// view - student admin
// --------------------
......@@ -1129,28 +1111,14 @@
margin-top: 0.7em;
}
// .task-history-single-table { .slickgrid
// max-height: 500px;
// } }
// .running-tasks-table { .slickgrid {
// max-height: 500px;
// } }
.task-history-all-table {
margin-top: 1em;
// height: 300px;
// overflow-y: scroll
}
.task-history-single-table {
margin-top: 1em;
// height: 300px;
// overflow-y: scroll
}
.running-tasks-table {
margin-top: 1em;
// height: 500px;
// overflow-y: scroll
}
}
......@@ -1158,7 +1126,6 @@
// --------------------
.instructor-dashboard-wrapper-2 section.idash-section#data_download {
input {
// display: block;
margin-bottom: 1em;
line-height: 1.3em;
}
......@@ -1188,16 +1155,16 @@
.metrics-container, .metrics-header-container {
position: relative;
width: 100%;
float: left;
clear: both;
width: 100%;
@include float(left);
margin-top: 25px;
.metrics-left, .metrics-left-header {
position: relative;
width: 30%;
float: left;
margin-right: 2.5%;
@include float(left);
@include margin-right(2.5%);
svg {
width: 100%;
......@@ -1210,8 +1177,8 @@
.metrics-right, .metrics-right-header {
position: relative;
width: 65%;
float: left;
margin-left: 2.5%;
@include float(left);
@include margin-left(2.5%);
margin-bottom: 25px;
svg {
......@@ -1231,18 +1198,18 @@
.metrics-tooltip {
width: 250px;
background-color: lightgray;
padding: 3px;
background-color: lightgray;
}
.metrics-overlay {
position: absolute;
display: none;
top: 0;
right: 0;
bottom: 0;
left: 0;
background-color: rgba(255,255,255, .75);
display: none;
.metrics-overlay-content-wrapper {
position: relative;
......@@ -1287,13 +1254,13 @@
.download-csv {
position: absolute;
display: none;
right: 2%;
@include right(2%);
bottom: 2%;
}
.close-button {
position: absolute;
right: 1.5%;
@include right(1.5%);
top: 2%;
font-size: 2em;
}
......@@ -1324,9 +1291,7 @@
.profile-distribution-widget {
margin-bottom: $baseline * 2;
.display-text {}
margin-bottom: ($baseline * 2);
.display-graph .graph-placeholder {
width: 750px;
......@@ -1384,7 +1349,7 @@ input[name="subject"] {
height: 26px;
line-height: 26px;
span{
float: right;
@include float(right);
font-size: 16px;
font-weight: bold;
span{
......@@ -1397,8 +1362,8 @@ input[name="subject"] {
}
}
span.tip{
padding: 10px 15px;
display: block;
padding: 10px 15px;
border-top: 1px solid #ddd;
border-bottom: 1px solid #ddd;
background: #f8f4ec;
......@@ -1408,14 +1373,14 @@ input[name="subject"] {
@include button(simple, $blue);
@extend .button-reset;
font-size: em(13);
float: right;
@include float(right);
}
}
}
#e-commerce{
input[name='list-order-sale-csv'] {
margin-right: 14px;
@include margin-right(14px);
}
input {
margin-bottom: 1em;
......@@ -1444,14 +1409,13 @@ input[name="subject"] {
margin-bottom: $baseline;
display: none;
}
.content{
padding: 0 !important;
}
input[name="download_company_name"],
input[name="active_company_name"], input[name="spent_company_name"] {
margin-right: 8px;
@include margin-right(8px);
height: 36px;
width: 254px;
border-radius: 3px;
......@@ -1545,35 +1509,35 @@ input[name="subject"] {
line-height: normal;
font-size: 14px;
span.old-price{
left: -75px;
top: -1px;
@include left(-75px);
position: relative;
text-decoration: line-through;
color: red;
font-size: 12px;
top: -1px;
}
}
td:nth-child(5),td:first-child{
padding-left: $baseline;
@include padding-left($baseline);
}
td:nth-child(2){
line-height: 22px;
padding-right: 0px;
@include padding-right(0px);
word-wrap: break-word;
}
td:nth-child(5){
padding-left: 0;
@include padding-left(0);
text-align: center;
}
td{
a.edit-right{
margin-left: ($baseline*0.75);
@include margin-left(15px);
}
}
}
}
section#registration_code_generation_modal {
margin-left: -442px;
@include margin-left(-442px);
width: 930px;
}
// coupon edit and add modals
......@@ -1582,14 +1546,14 @@ input[name="subject"] {
background: $white;
}
span.tip-text {
font-size: 12px;
display: block;
margin-top: ($baseline/4);
font-size: 12px;
color: #646464
}
top:-95px !important;
width: 650px;
margin-left: -325px;
@include margin-left(-325px);
border-radius: 2px;
input[type="button"]#update_coupon_button, input[type="button"]#add_coupon_button,
input[type="button"]#set_course_button {
......@@ -1606,12 +1570,12 @@ input[name="subject"] {
@extend .button-reset;
}
.modal-form-error {
@include margin($baseline 0 ($baseline/2) 0);
padding: $baseline;
box-shadow: inset 0 -1px 2px 0 #f3d9db;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
margin: 20px 0 10px 0 !important;
padding: 20px;
border: none;
border-bottom: 3px solid #a0050e;
background: #fbf2f3;
......@@ -1619,18 +1583,18 @@ input[name="subject"] {
ol.list-input{
li{
width: 278px;
float: left;
@include float(left);
label.required:after {
content: "*";
margin-left: ($baseline/4);
@include margin-left(5px);
}
}
li:nth-child(even){
margin-left: 30px !important;
@include margin-left(30px !important);
}
li:nth-child(3), li:nth-child(4){
margin-left: 0px !important;
width: 100%;
@include margin-left(0px !important);
}
li:nth-child(3) {
margin-bottom: 0px !important;
......@@ -1645,10 +1609,10 @@ input[name="subject"] {
form#generate_codes ol.list-input{
li{
width: 278px;
float: left;
@include float(left);
label.required:after {
content: "*";
margin-left: ($baseline/4);
@include margin-left(5px);
}
min-height: 120px;
}
......@@ -1661,28 +1625,28 @@ input[name="subject"] {
}
li#generate-registration-modal-field-country {
width: 204px;
margin-left: 15px !important;
@include margin-left(15px !important);
margin-bottom: $baseline;
}
li:nth-child(even){
margin-left: 0px !important;
@include margin-left(0px !important);
}
li:nth-child(3n) {
margin-left: 15px !important;
@include margin-left(15px !important);
}
li#generate-registration-modal-field-company-contact-name,
li#generate-registration-modal-field-address-line-3,
li#generate-registration-modal-field-zipcode {
margin-left: 15px !important;
@include margin-left(15px !important);
}
li:last-child{
label {
float: right;
@include float(right);
@include right(27px);
margin-top: -5px;
right: 27px;
}
min-height: 5px;
margin-left: 0px !important;
@include margin-left(0px !important);
input[type='checkbox'] {
width: auto;
height: auto;
......@@ -1690,8 +1654,8 @@ input[name="subject"] {
}
li#generate-registration-modal-field-country ~ li#generate-registration-modal-field-total-price,
li#generate-registration-modal-field-country ~ li#generate-registration-modal-field-internal-reference {
margin-left: 0px !important;
margin-right: 15px !important;
@include margin-left(0px !important);
@include margin-right(15px !important);
}
li#generate-registration-modal-field-custom-reference-number {
width: auto;
......@@ -1705,7 +1669,7 @@ input[name="subject"] {
}
}
li#set-course-mode-modal-field-currency{
margin-left: 0px !important;
@include margin-left(0px !important);
select {
width: 100%;
}
......@@ -1717,7 +1681,7 @@ input[name="subject"] {
border-radius: 3px;
}
#coupon-content, #course-content, #registration-content {
padding: 20px;
padding: $baseline;
header {
margin: 0;
padding: 0;
......@@ -1725,18 +1689,18 @@ input[name="subject"] {
font-size: 24px;
font-weight: 100;
color: #1580b0;
text-align: left;
@include text-align(left);
}
}
.instructions p {
margin-bottom: ($baseline/4);
}
form {
margin: 0;
padding: 0;
border-radius: 0;
box-shadow: none;
margin: 0;
border: none;
padding: 0;
.group-form {
margin: 0;
padding-top: 0;
......@@ -1758,10 +1722,10 @@ input[name="subject"] {
font-weight: 600;
}
.field label {
margin: 0 0 5px 0;
-webkit-transition: color 0.15s ease-in-out 0s;
-moz-transition: color 0.15s ease-in-out 0s;
transition: color 0.15s ease-in-out 0s;
margin: 0 0 5px 0;
color: #333;
}
.field.text input {
......@@ -1775,9 +1739,6 @@ input[name="subject"] {
}
}
}
#registration-content form .group-form {
}
#registration-content form {
.field {
margin: 0;
......@@ -1801,9 +1762,7 @@ input[name="subject"] {
}
.profile-distribution-widget {
margin-bottom: $baseline * 2;
.display-text {}
margin-bottom: ($baseline * 2);
.display-graph .graph-placeholder {
width: 750px;
......@@ -1818,7 +1777,7 @@ input[name="subject"] {
}
.grade-distributions-widget {
margin-bottom: $baseline * 2;
margin-bottom: ($baseline * 2);
.last-updated {
line-height: 2.2em;
......@@ -1852,23 +1811,23 @@ input[name="subject"] {
h2{
height: 26px;
line-height: 26px;
padding-left: 25px;
@include padding-left(25px);
span{
float: right;
@include float(right);
font-size: 16px;
font-weight: bold;
span{
background: #ddd;
float: none;
padding: 2px 9px;
background: #ddd;
border-radius: 2px;
float: none;
font-weight: 400;
}
}
}
span.tip{
padding: 10px 15px;
display: block;
padding: 10px 15px;
border-top: 1px solid #ddd;
border-bottom: 1px solid #ddd;
background: #f8f4ec;
......@@ -1878,55 +1837,53 @@ input[name="subject"] {
@include button(simple, $blue);
@extend .button-reset;
font-size: em(13);
float: right;
@include float(right);
}
}
span.code_tip {
display: block;
margin-bottom: 6px;
@include padding(($baseline/2) 15px ($baseline/2) $baseline);
background: none repeat scroll 0 0 #F8F4EC;
border-bottom: 1px solid #DDDDDD;
border-top: 1px solid #DDDDDD;
color: #3C3C3C;
display: block;
line-height: 30px;
margin-bottom: 6px;
padding: 10px 15px 10px 20px;
.add{
@include button(simple, $blue);
@extend .button-reset;
@include float(right);
font-size: em(13);
float: right;
}
}
span.csv_tip {
display: block;
line-height: 30px;
margin-bottom: 6px;
padding: 10px 15px 10px 1px;
@include padding(($baseline/2) 15px ($baseline/2) 1px);
.add{
font-size: em(13);
float: right;
@include float(right);
}
}
span.invalid_sale {
background: none repeat scroll 0 0 #F8F4EC;
color: #3C3C3C;
display: block;
line-height: 30px;
height: 37px;
margin-bottom: 6px;
padding: 10px 15px 10px 1px;
@include padding(($baseline/2) 15px ($baseline/2) 1px);
background: none repeat scroll 0 0 #F8F4EC;
color: #3C3C3C;
line-height: 30px;
.add{
@include button(simple, $blue);
@extend .button-reset;
font-size: em(13);
}
}
}
.rtl .instructor-dashboard-wrapper-2 .olddash-button-wrapper,
.rtl .instructor-dashboard-wrapper-2 .studio-edit-link {
left: 2em;
right: auto;
@include left(2em);
@include right(auto);
}
lms/templates/instructor/instructor_dashboard_2/cohort-form.underscore
......@@ -13,7 +13,7 @@
%>
<div class="form-field">
<div class="cohort-management-settings-form-name field field-text">
<label for="cohort-name" class="label">
<label for="cohort-name" class="form-label">
<%- gettext('Cohort Group Name') %> *
<span class="sr"><%- gettext('(Required Field)')%></span>
</label>
......@@ -32,9 +32,9 @@
%>
<div class="form-field">
<div class="cohort-management-details-association-course field field-radio">
<label class="label">
<h4 class="form-label">
<%- gettext('Associate this cohort group with a content group') %>
</label>
</h4>
<label><input type="radio" class="radio-no" name="cohort-association-course" value="no" <%- !hasSelectedContentGroup ? 'checked="checked"' : '' %>/> <%- gettext("No Content Group") %></label>
<div class="input-group has-other-input-text">
<label><input type="radio" class="radio-yes" name="cohort-association-course" value="yes" <%- !hasContentGroups ? 'disabled="disabled"' : '' %> <%- hasSelectedContentGroup ? 'checked="checked"' : '' %> /> <%- gettext("Select a Content Group") %></label>
......
lms/templates/instructor/instructor_dashboard_2/cohorts.underscore
......@@ -25,7 +25,7 @@
</div>
<!-- Add modal -->
<div class="cohort-management-add-modal"></div>
<div class="cohort-management-add-form"></div>
<!-- individual group -->
<div class="cohort-management-group"></div>
......
lms/templates/ux/reference/instructor_dashboard/cohorts.html deleted 100644 → 0
<%! from django.utils.translation import ugettext as _ %>
<%! from django.core.urlresolvers import reverse %>
<%inherit file="/main.html" />
<%namespace name='static' file='/static_content.html'/>
<%block name="pagetitle">Instructor Dashboard</%block>
<%block name="nav_skip">#instructor-dashboard-content</%block>
<%block name="headextra">
<%static:css group='style-course-vendor'/>
<%static:css group='style-vendor-tinymce-content'/>
<%static:css group='style-vendor-tinymce-skin'/>
<%static:css group='style-course'/>
<script type="text/javascript">
// This is a hack to get tinymce to work correctly in Firefox until the annotator tool is refactored to not include
// tinymce globally.
if (typeof window.Range.prototype === "undefined") {
window.Range.prototype = { };
}
</script>
<script type="text/javascript" src="${static.url('js/vendor/mustache.js')}"></script>
<script type="text/javascript" src="${static.url('js/vendor/flot/jquery.flot.js')}"></script>
<script type="text/javascript" src="${static.url('js/vendor/flot/jquery.flot.axislabels.js')}"></script>
<script type="text/javascript" src="${static.url('js/vendor/jquery-jvectormap-1.1.1/jquery-jvectormap-1.1.1.min.js')}"></script>
<script type="text/javascript" src="${static.url('js/vendor/jquery-jvectormap-1.1.1/jquery-jvectormap-world-mill-en.js')}"></script>
<script type="text/javascript" src="${static.url('js/course_groups/cohorts.js')}"></script>
<script type="text/javascript" src="${static.url('js/vendor/jquery.event.drag-2.2.js')}"></script>
<script type="text/javascript" src="${static.url('js/vendor/jquery.event.drop-2.2.js')}"></script>
<script type="text/javascript" src="${static.url('js/vendor/slick.core.js')}"></script>
<script type="text/javascript" src="${static.url('js/vendor/slick.grid.js')}"></script>
<script type="text/javascript" src="${static.url('js/vendor/codemirror-compressed.js')}"></script>
<script type="text/javascript" src="${static.url('js/vendor/tinymce/js/tinymce/tinymce.full.min.js')}"></script>
<script type="text/javascript" src="${static.url('js/vendor/tinymce/js/tinymce/jquery.tinymce.min.js')}"></script>
<link type="text/css" href="${static.url('css/vendor/slickgrid/smoothness/jquery-ui-1.8.16.custom.css')}" rel="stylesheet">
<link type="text/css" href="${static.url('css/vendor/slickgrid/slick.grid.css')}" rel="stylesheet">
<%static:js group='module-descriptor-js'/>
<%static:js group='instructor_dash'/>
</%block>
<section class="container">
<div class="instructor-dashboard-wrapper-2">
<section class="instructor-dashboard-content-2" id="instructor-dashboard-content">
<h1>Instructor Dashboard</h1>
<section class="idash-section active-section" id="membership">
<div class="cohort-management membership-section">
<h2 class="section-title">
<span class="value">Cohort Group Management</span>
<span class="description">Cohorts are such and such and are used for this and that to do all the things</span>
</h2>
<div class="cohort-management-nav">
<form action="" method="post" name="" id="cohort-management-nav-form" class="cohort-management-nav-form">
<div class="form-fields">
<div class="cohort-management-nav-form-select field field-select">
<label for="cohort-select" class="label">Assign students to cohort groups manually</label>
<select class="input input-lg cohort-select" name="cohort-select" id="cohort-select">
<option>Select a cohort group</option>
<option value="cohort-name-1" selected="selected">Cohort Name is Placed Here and Should Accommodate Almost Everything (12,546)</option>
<option value="cohort-name-2">Cras mattis consectetur purus sit amet fermentum (8,546)</option>
<option value="cohort-name-3">Donec id elit non mi porta gravida at eget metus. (4)</option>
</select>
</div>
</div>
</form>
<button type="button" class="action-primary action-create"><i class="icon-plus"></i> New Cohort Group</button>
</div>
<!-- Message: Warning -->
<div class="msg msg-warning">
<h3 class="message-title">You currently have no cohort groups configured</h3>
<div class="message-copy">
<p>Please complete your cohort group configuration by creating groups within Studio</p>
</div>
<div class="message-actions">
<button class="action-primary action-create"><i class="icon icon-plus"></i> Add a Cohort Group</button>
</div>
</div>
<!-- Message: Error -->
<div class="msg msg-error">
<h3 class="message-title">There's currently an error with your cohorts configuration within this course.</h3>
<div class="message-copy">
<p>Error output (if any and near-human legible/comprehendable can be displayed here)</p>
</div>
<div class="message-actions">
<a href="#" class="action-primary action-review">Review Configuration in Studio</a>
</div>
</div>
<!-- Managing cohorts -->
<section class="cohort-management-settings has-tabs">
<h2 class="group-header-title"><span class="title-value">Cohort Name Can be Placed Here and Should Accommodate Almost Everything</span> <span class="group-count">(contains 12,546 students)</span></h2>
<div class="cohort-management-group-setup">
<p class="cohort-management-group-text">Students are added to this group only when you provide their email addresses or usernames on this page.<br /><a href="#">What does this mean?</a></p>
<div class="cohort-management-group-actions">
<span class="float-right"><a href="#">Edit settings in Studio</a></a>
</div>
</div>
<ul class="wrapper-tabs">
<li class="tab"><a href="#">Manage Students in Cohort Groups</a></li>
<li class="tab is-selected"><a href="#">Cohort Group Settings</a></li>
</ul>
<div class="cohort-management-details">
<form action="" method="post" name="" id="cohort-management-details-form" class="cohort-management-details-form">
<h3 class="form-title sr">Cohort Group Details</h3>
<div class="form-fields">
<div class="cohort-management-details-name field field-text">
<h4 class="cohort-section-header no-top-margin">Cohort Group Name:</h4>
<label for="cohort-details-name" class="label sr">Cohort Group Name</label>
<input type="text" name="cohort-details-name" value="Cohort Name is Placed Here and Should Accommodate Almost Everything" class="input cohort-details-name" id="cohort-details-name" placeholder="Enter Your Cohort's Name" required />
</div>
</div>
<h4 class="cohort-section-header divider-lv2">Students in this cohort group are:</h4>
<div class="form-fields">
<div class="cohort-management-details-assignment field field-radio">
<label for="cohort-assign-random"><input type="radio" name="cohort-assignment" value="random" /> Randomly Assigned</label>
<label for="cohort-assign-manual"><input type="radio" name="cohort-assignment" value="menual" checked="checked" /> Manually Assigned</label>
</div>
</div>
<!-- When options are available but a deleted one is selected. -->
<h4 class="cohort-section-header divider-lv2">Is this cohort group associated with course-based content groups?</h4>
<div class="form-fields">
<div class="cohort-management-details-assn-course field field-radio">
<label for="cohort-assn-course-no"><input type="radio" name="cohort-assn-course" value="no" /> No</label>
<div class="input-group has-other">
<label for="cohort-assn-course-yes"><input type="radio" name="cohort-assn-course" value="yes" checked="checked" /> Yes</label>
<div class="input-group-other is-visible">
<label class="sr" for="cohort-group-assn">Choose a content group to associate</label>
<select name="cohort-group-assn" id="cohort-group-assn" class="input input-lg has-option-unavailable">
<optgroup label="Available content groups">
<option>Choose a content group to associate</option>
</optgroup>
<optgroup label="Deleted content groups">
<option class="option-unavailable" selected="selected">Some content group that's been deleted</option>
<option class="option-unavailable">Another deleted content group</option>
</optgroup>
</select>
<div class="msg error inline">
<p class="copy-error"><i class="icon icon-warning-sign"></i> The selected content group has been deleted, you may wish to reassign this cohort group.</p>
</div>
</div>
</div>
</div>
<!-- // -->
<!-- When no options are available. -->
<h4 class="cohort-section-header divider-lv2">Is this cohort group associated with course-based content groups?</h4>
<div class="form-fields">
<div class="cohort-management-details-assn-course field field-radio">
<label for="cohort-assn-course-no"><input type="radio" name="cohort-assn-course-2" value="no" /> No</label>
<div class="input-group has-other">
<label for="cohort-assn-course-yes"><input type="radio" name="cohort-assn-course-2" value="yes" checked="checked" /> Yes</label>
<div class="input-group-other is-visible">
<div class="msg error inline">
<p class="copy-error"><i class="icon icon-warning-sign"></i> You haven't configured any content groups yet. You need to create a content group before you can create assignments. <a href="#">Create a content group</a></p>
</div>
</div>
</div>
</div>
<!-- // -->
<div class="form-actions">
<button type="submit" class="form-submit action-primary">Save</button>
<button type="button" class="button-link action-tertiary">Cancel</button>
</div>
</div>
<div class="wrapper-cohort-supplemental">
<hr class="divider divider-lv1">
<a class="toggle-cohort-management-secondary" href="#cohort-management-file-upload">Assign students to cohort groups by uploading a CSV file</a>
<div class="cohort-management-file-upload csv-upload is-hidden" id="cohort-management-file-upload"></div>
<div class="cohort-management-supplemental">
<p class=""><i class="icon icon-info-sign"></i> To review student cohort group assignments or see the results of uploading a CSV file, download course profile information or cohort results on <a href="" class="link-cross-reference" data-section="data_download"> the Data Download page</a>.</p>
</div>
</div>
</section>
</div>
</section>
</section>
</div>
</section>
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