Skip to content

E
edx-platform
Commit 59850cb4 by Brian Talbot
Options

Studio: cleans up new course form and course listings display

parent 52b5da3e
Showing with 41 additions and 33 deletions
cms/static/js/base.js
...@@ -577,10 +577,10 @@ function cancelNewSection(e) { ...@@ -577,10 +577,10 @@ function cancelNewSection(e) {
function addNewCourse(e) { function addNewCourse(e) {
e.preventDefault(); e.preventDefault();
$(e.target).hide(); $(e.target).addClass('disabled');
var $newCourse = $($('#new-course-template').html()); var $newCourse = $($('#new-course-template').html());
var $cancelButton = $newCourse.find('.new-course-cancel'); var $cancelButton = $newCourse.find('.new-course-cancel');
$('.inner-wrapper').prepend($newCourse); $('.courses').prepend($newCourse);
$newCourse.find('.new-course-name').focus().select(); $newCourse.find('.new-course-name').focus().select();
$newCourse.find('form').bind('submit', saveNewCourse); $newCourse.find('form').bind('submit', saveNewCourse);
$cancelButton.bind('click', cancelNewCourse); $cancelButton.bind('click', cancelNewCourse);
...@@ -627,7 +627,7 @@ function saveNewCourse(e) { ...@@ -627,7 +627,7 @@ function saveNewCourse(e) {
function cancelNewCourse(e) { function cancelNewCourse(e) {
e.preventDefault(); e.preventDefault();
$('.new-course-button').show(); $('.new-course-button').removeClass('disabled');
$(this).parents('section.new-course').remove(); $(this).parents('section.new-course').remove();
} }
......
cms/static/sass/views/_dashboard.scss
...@@ -203,7 +203,7 @@ body.dashboard { ...@@ -203,7 +203,7 @@ body.dashboard {
@extend .t-copy-sub1; @extend .t-copy-sub1;
position: relative; position: relative;
color: $white; color: $white;
opacity: 0.65; opacity: 0.85;
} }
} }
...@@ -249,20 +249,21 @@ body.dashboard { ...@@ -249,20 +249,21 @@ body.dashboard {
// ==================== // ====================
.my-classes { // course listings
.courses {
margin: $baseline 0; margin: $baseline 0;
} }
.class-list { .list-courses {
margin-top: $baseline; margin-top: $baseline;
border-radius: 3px; border-radius: 3px;
border: 1px solid $gray-d2; border: 1px solid $gray;
background: $white; background: $white;
box-shadow: 0 1px 2px rgba(0, 0, 0, .1); box-shadow: 0 1px 2px $shadow-l1;
li { .course-item {
position: relative; position: relative;
border-bottom: 1px solid $mediumGrey; border-bottom: 1px solid $gray-l1;
&:last-child { &:last-child {
border-bottom: none; border-bottom: none;
...@@ -302,7 +303,7 @@ body.dashboard { ...@@ -302,7 +303,7 @@ body.dashboard {
.view-live-button { .view-live-button {
z-index: 10000; z-index: 10000;
position: absolute; position: absolute;
top: 15px; top: ($baseline*0.75);
right: $baseline; right: $baseline;
padding: ($baseline/4) ($baseline/2); padding: ($baseline/4) ($baseline/2);
opacity: 0.0; opacity: 0.0;
...@@ -316,17 +317,25 @@ body.dashboard { ...@@ -316,17 +317,25 @@ body.dashboard {
} }
.new-course { .new-course {
padding: 15px 25px; @include clearfix();
margin-top: 20px; padding: ($baseline*0.75) ($baseline*1.25);
margin-top: $baseline;
border-radius: 3px; border-radius: 3px;
border: 1px solid $darkGrey; border: 1px solid $gray;
background: #fff; background: $white;
box-shadow: 0 1px 2px rgba(0, 0, 0, .1); box-shadow: 0 1px 2px rgba(0, 0, 0, .1);
@include clearfix;
.title {
@extend .t-title4;
font-weight: 600;
margin-bottom: ($baseline/2);
border-bottom: 1px solid $gray-l3;
padding-bottom: ($baseline/2);
}
.row { .row {
margin-bottom: 15px; @include clearfix();
@include clearfix; margin-bottom: ($baseline*0.75);
} }
.column { .column {
...@@ -343,8 +352,8 @@ body.dashboard { ...@@ -343,8 +352,8 @@ body.dashboard {
} }
label { label {
@extend .t-title7;
display: block; display: block;
font-size: 13px;
font-weight: 700; font-weight: 700;
} }
...@@ -355,7 +364,7 @@ body.dashboard { ...@@ -355,7 +364,7 @@ body.dashboard {
} }
.new-course-name { .new-course-name {
font-size: 19px; @extend .t-title5;
font-weight: 300; font-weight: 300;
} }
......
cms/templates/index.html
...@@ -8,6 +8,7 @@ ...@@ -8,6 +8,7 @@
<%block name="header_extras"> <%block name="header_extras">
<script type="text/template" id="new-course-template"> <script type="text/template" id="new-course-template">
<section class="new-course"> <section class="new-course">
<h3 class="title">Create a New Course:</h3>
<div class="item-details"> <div class="item-details">
<form class="course-info"> <form class="course-info">
<div class="row"> <div class="row">
...@@ -91,19 +92,17 @@ ...@@ -91,19 +92,17 @@
</div> </div>
%if len(courses) > 0: %if len(courses) > 0:
<div class="list-courses"> <div class="courses">
<div class="my-classes"> <ul class="list-courses">
<ul class="class-list"> %for course, url, lms_link in sorted(courses, key=lambda s: s[0].lower() if s[0] is not None else ''):
%for course, url, lms_link in sorted(courses, key=lambda s: s[0].lower() if s[0] is not None else ''): <li class="course-item">
<li> <a class="class-link" href="${url}" class="class-name">
<a class="class-link" href="${url}" class="class-name"> <span class="class-name">${course}</span>
<span class="class-name">${course}</span> </a>
</a> <a href="${lms_link}" rel="external" class="button view-button view-live-button">View Live</a>
<a href="${lms_link}" rel="external" class="button view-button view-live-button">View Live</a> </li>
</li> %endfor
%endfor </ul>
</ul>
</div>
</div> </div>
%else: %else:
......
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