From 731cfe5bb56dd5779776b978465fb5cbc9730ea5 Mon Sep 17 00:00:00 2001
From: Tom Giannattasio <tom@mitx.mit.edu>
Date: Mon, 3 Dec 2012 16:15:00 -0500
Subject: [PATCH 01/43] fixed long header bug

---
 cms/static/sass/_header.scss | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/cms/static/sass/_header.scss b/cms/static/sass/_header.scss
index e80c7aa3b1..f709f36a44 100644
--- a/cms/static/sass/_header.scss
+++ b/cms/static/sass/_header.scss
@@ -43,7 +43,7 @@ body.no-header {
 	}
 
 	.left {
-		width: 750px;
+		// width: 750px;
 	}
 
 	.class-name {

From 1845fc7211b4c8223c3b10f88a4be1a4108b3f2a Mon Sep 17 00:00:00 2001
From: Tom Giannattasio <tom@mitx.mit.edu>
Date: Mon, 3 Dec 2012 16:29:27 -0500
Subject: [PATCH 02/43] headers still funky, absolutely positioned to avoid
 bugs for now; removed public tag and grey style

---
 cms/static/sass/_cms_mixins.scss | 5 -----
 cms/static/sass/_header.scss     | 4 +++-
 2 files changed, 3 insertions(+), 6 deletions(-)

diff --git a/cms/static/sass/_cms_mixins.scss b/cms/static/sass/_cms_mixins.scss
index 80a82fb7f3..710bd7deb9 100644
--- a/cms/static/sass/_cms_mixins.scss
+++ b/cms/static/sass/_cms_mixins.scss
@@ -200,15 +200,10 @@
 			content: "- draft";
 		}
 
-		.public-item:after {
-			content: "- public";
-		}
-
 		.private-item:after {
 			content: "- private";
 		}
 
-		.public-item,
 		.private-item {
 			color: #a4aab7;
 		}
diff --git a/cms/static/sass/_header.scss b/cms/static/sass/_header.scss
index f709f36a44..cb9a7ed121 100644
--- a/cms/static/sass/_header.scss
+++ b/cms/static/sass/_header.scss
@@ -43,7 +43,9 @@ body.no-header {
 	}
 
 	.left {
-		// width: 750px;
+		position: absolute;
+		left: 0;
+		width: 100%;
 	}
 
 	.class-name {

From 4e7d931d7e29aa376ca55c699d3f7a8668f72ef1 Mon Sep 17 00:00:00 2001
From: Tom Giannattasio <tom@mitx.mit.edu>
Date: Tue, 4 Dec 2012 11:00:28 -0500
Subject: [PATCH 03/43] removed new course button on click to prevent multiple
 instantiations

---
 cms/static/js/base.js            | 2 ++
 cms/static/sass/_base.scss       | 8 +++++---
 cms/static/sass/_courseware.scss | 5 +++++
 cms/templates/overview.html      | 2 +-
 4 files changed, 13 insertions(+), 4 deletions(-)

diff --git a/cms/static/js/base.js b/cms/static/js/base.js
index 79d83a466e..2efc4c6b4a 100644
--- a/cms/static/js/base.js
+++ b/cms/static/js/base.js
@@ -588,6 +588,8 @@ function hideToastMessage(e) {
 function addNewSection(e, isTemplate) {
     e.preventDefault();
 
+    $(e.target).hide();
+
     var $newSection = $($('#new-section-template').html());
     var $cancelButton = $newSection.find('.new-section-name-cancel');
     $('.new-courseware-section-button').after($newSection);
diff --git a/cms/static/sass/_base.scss b/cms/static/sass/_base.scss
index 7f5dcacf8b..4696638af4 100644
--- a/cms/static/sass/_base.scss
+++ b/cms/static/sass/_base.scss
@@ -26,7 +26,8 @@ a {
 h1 {
     float: left;
     font-size: 28px;
-    margin: 36px 6px;
+    font-weight: 300;
+    margin: 24px 6px;
 }
 
 .waiting {
@@ -345,8 +346,9 @@ body.show-wip {
 }
 
 .new-button {
-    @include grey-button;
-    padding: 20px 0;
+    @include blue-button;
+    font-size: 13px;
+    padding: 8px 20px 10px;
     text-align: center;
 
     &.big {
diff --git a/cms/static/sass/_courseware.scss b/cms/static/sass/_courseware.scss
index 23024f74e4..73b55618b6 100644
--- a/cms/static/sass/_courseware.scss
+++ b/cms/static/sass/_courseware.scss
@@ -8,6 +8,7 @@ input.courseware-unit-search-input {
 	
 }
 
+
 .courseware-section {
 	position: relative;
 	background: #fff;
@@ -139,6 +140,10 @@ input.courseware-unit-search-input {
 		}
 	}
 
+	.section-name-form {
+		margin-bottom: 15px;
+	}
+
 	.section-name-edit {
 		input {
 			font-size: 16px;
diff --git a/cms/templates/overview.html b/cms/templates/overview.html
index a75a27745f..771991aec6 100644
--- a/cms/templates/overview.html
+++ b/cms/templates/overview.html
@@ -101,7 +101,7 @@
       <h1>Courseware</h1>
       <div class="page-actions"></div>
       <article class="courseware-overview" data-course-id="${context_course.location.url()}">
-        <a href="#" class="new-button big new-courseware-section-button"><span class="plus-icon"></span> New Section</a>
+        <a href="#" class="new-button new-courseware-section-button"><span class="plus-icon white"></span> New Section</a>
         % for section in sections:
         <section class="courseware-section branch" data-id="${section.location}">
           <header>

From 7cba7c9b41327c559d04f63327bc135eddee256f Mon Sep 17 00:00:00 2001
From: Tom Giannattasio <tom@mitx.mit.edu>
Date: Tue, 4 Dec 2012 13:49:07 -0500
Subject: [PATCH 04/43] tweaked body color and window styles; adjusting new
 buttons

---
 cms/static/js/base.js            |  4 ++++
 cms/static/sass/_base.scss       | 15 +++++++++++----
 cms/static/sass/_courseware.scss | 14 ++++----------
 cms/static/sass/_dashboard.scss  |  7 -------
 cms/templates/edit-tabs.html     |  7 ++++---
 cms/templates/index.html         |  2 +-
 6 files changed, 24 insertions(+), 25 deletions(-)

diff --git a/cms/static/js/base.js b/cms/static/js/base.js
index 2efc4c6b4a..baad5b7177 100644
--- a/cms/static/js/base.js
+++ b/cms/static/js/base.js
@@ -629,11 +629,14 @@ function saveNewSection(e) {
 
 function cancelNewSection(e) {
     e.preventDefault();
+    $('.new-courseware-section-button').show();
     $(this).parents('section.new-section').remove();
 }
 
 function addNewCourse(e) {
     e.preventDefault();
+
+    $(e.target).hide();
     var $newCourse = $($('#new-course-template').html());
     var $cancelButton = $newCourse.find('.new-course-cancel');
     $('.new-course-button').after($newCourse);
@@ -674,6 +677,7 @@ function saveNewCourse(e) {
 
 function cancelNewCourse(e) {
     e.preventDefault();
+    $('.new-course-button').show();
     $(this).parents('section.new-course').remove();
 }
 
diff --git a/cms/static/sass/_base.scss b/cms/static/sass/_base.scss
index 4696638af4..699ffdc653 100644
--- a/cms/static/sass/_base.scss
+++ b/cms/static/sass/_base.scss
@@ -6,13 +6,17 @@
 
 body {
     min-width: 980px;
-    background: #f3f4f5;
-    font-family: 'Open Sans', sans-serif;
+    background: #eaebed;
     font-size: 16px;
     line-height: 1.6;
     color: #3c3c3c;
 }
 
+body,
+input {
+    font-family: 'Open Sans', sans-serif;
+}
+
 a {
     text-decoration: none;
     color: $blue;
@@ -56,9 +60,8 @@ h1 {
 
 .window {
     background: #fff;
-    border: 1px solid $darkGrey;
     border-radius: 3px;
-    @include box-shadow(0 1px 2px rgba(0, 0, 0, .1));
+    @include box-shadow(0 1px 1px rgba(0, 0, 0, .2));
 }
 
 .sidebar {
@@ -184,6 +187,10 @@ code {
     .details {
       margin-bottom: 30px;
       font-size: 14px;
+
+      .new-button {
+        margin-right: 30px;
+      }
     }
 
     h4 {
diff --git a/cms/static/sass/_courseware.scss b/cms/static/sass/_courseware.scss
index 73b55618b6..291241b7e0 100644
--- a/cms/static/sass/_courseware.scss
+++ b/cms/static/sass/_courseware.scss
@@ -4,19 +4,13 @@ input.courseware-unit-search-input {
 	background-color: #fff;
 }
 
-.courseware-overview {
-	
-}
-
-
 .courseware-section {
 	position: relative;
 	background: #fff;
-	border: 1px solid $darkGrey;
 	border-radius: 3px;
-	margin: 10px 0;
+	margin: 15px 0;
 	padding-bottom: 12px;
-	@include box-shadow(0 1px 2px rgba(0, 0, 0, .1));
+	@include box-shadow(0 1px 1px rgba(0, 0, 0, .2));
 
 	&:first-child {
 		margin-top: 0;
@@ -205,7 +199,7 @@ input.courseware-unit-search-input {
 .new-section-name-save,
 .new-subsection-name-save {
 	@include blue-button;
-	padding: 6px 20px 8px;
+	padding: 4px 20px 7px;
 	margin: 0 5px;
 	color: #fff !important;
 }
@@ -213,7 +207,7 @@ input.courseware-unit-search-input {
 .new-section-name-cancel,
 .new-subsection-name-cancel {
 	@include white-button;
-	padding: 6px 20px 8px;
+	padding: 4px 20px 7px;
 	color: #8891a1 !important;
 }
 
diff --git a/cms/static/sass/_dashboard.scss b/cms/static/sass/_dashboard.scss
index 8821f3736c..06eb8d8a9d 100644
--- a/cms/static/sass/_dashboard.scss
+++ b/cms/static/sass/_dashboard.scss
@@ -36,13 +36,6 @@
 	}
 }
 
-.new-course-button {
-	@include grey-button;
-	display: block;
-	padding: 20px;
-	text-align: center;
-}
-
 .new-course {
 	padding: 15px 25px;
 	margin-top: 20px;
diff --git a/cms/templates/edit-tabs.html b/cms/templates/edit-tabs.html
index 41dee15a7a..bf68b2b72c 100644
--- a/cms/templates/edit-tabs.html
+++ b/cms/templates/edit-tabs.html
@@ -22,6 +22,9 @@
     </div>
     <article class="unit-body window">
       <div class="details">
+        <a href="#" class="new-button new-tab left">
+          <span class="plus-icon white"></span>New Tab
+        </a>
         <p>Here you can add and manage additional pages for your course. These pages will be added to the primary navigation menu alongside Courseware, Course Info, Discussion, etc.</p>
       </div>
       <div class="tab-list">
@@ -31,9 +34,7 @@
           % endfor
                    
           <li class="new-component-item">
-            <a href="#" class="new-button big new-tab">
-              <span class="plus-icon"></span>New Tab
-            </a>
+            
           </li>
         </ol>      
       </div>
diff --git a/cms/templates/index.html b/cms/templates/index.html
index d41bcc23ac..92987babda 100644
--- a/cms/templates/index.html
+++ b/cms/templates/index.html
@@ -37,7 +37,7 @@
 			<h1>My Courses</h1>
 			<article class="my-classes">
 				% if user.is_active:
-				<a href="#" class="new-course-button"><span class="plus-icon"></span> New Course</a>
+				<a href="#" class="new-button new-course-button"><span class="plus-icon white"></span> New Course</a>
 				<ul class="class-list">
 					%for course, url in courses:
 			    <li>

From 72ebf4c862c6328244e0097f3252d241673375ec Mon Sep 17 00:00:00 2001
From: Tom Giannattasio <tom@mitx.mit.edu>
Date: Tue, 4 Dec 2012 14:54:02 -0500
Subject: [PATCH 05/43] style tweaks to tabs and static pages; key bindings for
 new user form

---
 cms/static/sass/_base.scss         |  6 +--
 cms/static/sass/_courseware.scss   |  3 +-
 cms/static/sass/_static-pages.scss |  4 ++
 cms/static/sass/_users.scss        | 19 ++-------
 cms/templates/edit-tabs.html       |  6 ++-
 cms/templates/manage_users.html    | 64 +++++++++++++++++-------------
 6 files changed, 51 insertions(+), 51 deletions(-)

diff --git a/cms/static/sass/_base.scss b/cms/static/sass/_base.scss
index 699ffdc653..ec9cbcf84c 100644
--- a/cms/static/sass/_base.scss
+++ b/cms/static/sass/_base.scss
@@ -61,7 +61,7 @@ h1 {
 .window {
     background: #fff;
     border-radius: 3px;
-    @include box-shadow(0 1px 1px rgba(0, 0, 0, .2));
+    @include box-shadow(0 1px 1px rgba(0,0,0,0.2), 0 0 0 1px rgba(0, 0, 0, 0.1));
 }
 
 .sidebar {
@@ -187,10 +187,6 @@ code {
     .details {
       margin-bottom: 30px;
       font-size: 14px;
-
-      .new-button {
-        margin-right: 30px;
-      }
     }
 
     h4 {
diff --git a/cms/static/sass/_courseware.scss b/cms/static/sass/_courseware.scss
index 291241b7e0..05a5a43ab2 100644
--- a/cms/static/sass/_courseware.scss
+++ b/cms/static/sass/_courseware.scss
@@ -1,3 +1,4 @@
+
 input.courseware-unit-search-input {
 	float: left;
 	width: 260px;
@@ -10,7 +11,7 @@ input.courseware-unit-search-input {
 	border-radius: 3px;
 	margin: 15px 0;
 	padding-bottom: 12px;
-	@include box-shadow(0 1px 1px rgba(0, 0, 0, .2));
+	@include box-shadow(0 1px 1px rgba(0,0,0,0.2), 0 0 0 1px rgba(0, 0, 0, 0.1));
 
 	&:first-child {
 		margin-top: 0;
diff --git a/cms/static/sass/_static-pages.scss b/cms/static/sass/_static-pages.scss
index c8ffa0316c..68cb3e1d07 100644
--- a/cms/static/sass/_static-pages.scss
+++ b/cms/static/sass/_static-pages.scss
@@ -6,6 +6,10 @@
     padding: 12px 0;
   }
 
+  .new-tab {
+    margin-bottom: 15px;
+  }
+
   .unit-body {
     padding: 30px 40px;
   }
diff --git a/cms/static/sass/_users.scss b/cms/static/sass/_users.scss
index bca9b4f2fb..4daefa55cc 100644
--- a/cms/static/sass/_users.scss
+++ b/cms/static/sass/_users.scss
@@ -5,21 +5,7 @@
   }
 
   .new-user-button {
-    @include grey-button;
-    margin: 5px 8px;
-    padding: 3px 10px 4px 10px;
-    font-size: 12px;
-
-    .plus-icon {
-      position: relative;
-      top: 1px;
-    }
-  }
-
-  .list-header {
-    @include linear-gradient(top, transparent, rgba(0, 0, 0, .1));
-    background-color: #ced2db;
-    border-radius: 3px 3px 0 0;
+    margin-bottom: 15px;
   }
 
   .new-user-form {
@@ -55,16 +41,17 @@
 
     .add-button {
       @include blue-button;
+      padding: 6px 20px 8px;
     }
 
     .cancel-button {
       @include white-button;
+      padding: 6px 20px 8px;
     }
   }
 
   .user-list {
     border: 1px solid $mediumGrey;
-    border-top: none;
     background: $lightGrey;
 
     li {
diff --git a/cms/templates/edit-tabs.html b/cms/templates/edit-tabs.html
index bf68b2b72c..8e75b49410 100644
--- a/cms/templates/edit-tabs.html
+++ b/cms/templates/edit-tabs.html
@@ -22,10 +22,12 @@
     </div>
     <article class="unit-body window">
       <div class="details">
-        <a href="#" class="new-button new-tab left">
+        <p>Here you can add and manage additional pages for your course. These pages will be added to the primary navigation menu alongside Courseware, Course Info, Discussion, etc.</p>
+      </div>
+      <div class="list-header">
+        <a href="#" class="new-button new-tab">
           <span class="plus-icon white"></span>New Tab
         </a>
-        <p>Here you can add and manage additional pages for your course. These pages will be added to the primary navigation menu alongside Courseware, Course Info, Discussion, etc.</p>
       </div>
       <div class="tab-list">
         <ol class='components'>
diff --git a/cms/templates/manage_users.html b/cms/templates/manage_users.html
index 712766eb71..6f33b67d41 100644
--- a/cms/templates/manage_users.html
+++ b/cms/templates/manage_users.html
@@ -11,22 +11,20 @@
       <div class="details">
         <p>The following list of users have been designated as course staff. This means that these users will have permissions to modify course content. You may add additional course staff below, if you are the course instructor. Please note that they must have already registered and verified their account.</p>
       </div>
-      <div class="list-header">
-        %if allow_actions:
-        <a href="#" class="new-user-button">
-          <span class="plus-icon"></span>New User
-        </a>
-        %endif
-      </div>
       %if allow_actions:
-      <div class="new-user-form">
+      <a href="#" class="new-button new-user-button">
+        <span class="plus-icon white"></span>New User
+      </a>
+      %endif
+      %if allow_actions:
+      <form class="new-user-form">
         <div id="result"></div>
         <div class="form-elements">
           <label>email: </label><input type="text" id="email" class="email-input" autocomplete="off" placeholder="email@example.com">
-          <a href="#" id="add_user" class="add-button">add user</a>
-          <a href="#" class="cancel-button">cancel</a>
+          <input type="submit" value="Add User" id="add_user" class="add-button" />
+          <input type="button" value="Cancel" class="cancel-button" />
         </div>
-      </div>
+      </form>
       %endif
       <div>
         <ol class="user-list">
@@ -57,6 +55,7 @@
   function showNewUserForm(e) {
     e.preventDefault();
     $newUserForm.slideDown(150);
+    $newUserForm.find('.email-input').focus();
   }
 
   function hideNewUserForm(e) {
@@ -66,26 +65,37 @@
     $('#email').val('');
   }
 
+  function checkForCancel(e) {
+    if(e.which == 27) {
+      e.data.$cancelButton.click();
+    }
+  }
+
+  function addUser(e) {
+    e.preventDefault();
+
+    $.ajax({
+      url: '${add_user_postback_url}',
+      type: 'POST',
+      dataType: 'json',
+      contentType: 'application/json',
+      data:JSON.stringify({ 'email': $('#email').val()}),
+    }).done(function(data) {
+      if (data.ErrMsg != undefined)
+        $('#result').show().empty().append(data.ErrMsg);
+      else
+        location.reload();
+    });
+  }
+
   $(document).ready(function() {
     $newUserForm = $('.new-user-form');
-    $newUserForm.find('.cancel-button').bind('click', hideNewUserForm);
+    var $cancelButton = $newUserForm.find('.cancel-button');    
+    $newUserForm.bind('submit', addUser);
+    $cancelButton.bind('click', hideNewUserForm);
 
     $('.new-user-button').bind('click', showNewUserForm);
-
-    $('#add_user').click(function() {
-      $.ajax({
-        url: '${add_user_postback_url}',
-        type: 'POST',
-        dataType: 'json',
-        contentType: 'application/json',
-        data:JSON.stringify({ 'email': $('#email').val()}),
-      }).done(function(data) {
-        if (data.ErrMsg != undefined)
-          $('#result').show().empty().append(data.ErrMsg);
-        else
-          location.reload();
-      })
-    });
+    $body.bind('keyup', { $cancelButton: $cancelButton }, checkForCancel);
 
     $('.remove-user').click(function() {
       $.ajax({

From ad84a961da90669a2f8809d11bdf9063271a77de Mon Sep 17 00:00:00 2001
From: Tom Giannattasio <tom@mitx.mit.edu>
Date: Wed, 5 Dec 2012 12:05:14 -0500
Subject: [PATCH 06/43] new header styles; collapse all button added to
 courseware

---
 cms/static/img/collapse-all-icon.png | Bin 0 -> 1018 bytes
 cms/static/img/home-icon-blue.png    | Bin 0 -> 1106 bytes
 cms/static/img/log-out-icon.png      | Bin 0 -> 1073 bytes
 cms/static/img/small-home-icon.png   | Bin 0 -> 1064 bytes
 cms/static/js/base.js                |  13 ++++-
 cms/static/sass/_base.scss           |   6 +-
 cms/static/sass/_cms_mixins.scss     |  23 +++++++-
 cms/static/sass/_courseware.scss     |  13 ++++-
 cms/static/sass/_graphics.scss       |  21 +++++++
 cms/static/sass/_header.scss         |  83 ++++++++++++++-------------
 cms/static/sass/_variables.scss      |   7 ++-
 cms/templates/overview.html          |   6 +-
 cms/templates/widgets/header.html    |  36 +++++++-----
 13 files changed, 142 insertions(+), 66 deletions(-)
 create mode 100644 cms/static/img/collapse-all-icon.png
 create mode 100644 cms/static/img/home-icon-blue.png
 create mode 100644 cms/static/img/log-out-icon.png
 create mode 100644 cms/static/img/small-home-icon.png

diff --git a/cms/static/img/collapse-all-icon.png b/cms/static/img/collapse-all-icon.png
new file mode 100644
index 0000000000000000000000000000000000000000..c468778b0254d6c98568edbce409ebef38c3af8c
GIT binary patch
literal 1018
zcmaJ=PfXKL7%ze-Bnu>{5fAz-9yDS7x3$t{lZ|!A5{qP8!cNAneXzpXSK9|GoWP41
z4|r3f#&{=QypVYC;4UPXcp>rMiGwjw<H>}BiM|dtJb+Ex_uiN9_xpa|pLcg+{A#58
zOgBYQk=&S?Cu<M+x{h~}|Bu!ANwW0gYzY_86t3wWq|zoTLy)ueX_$w)xo~R(CMc@?
zf>kWxl6Flokj?0!4-?ofK~q#>IB<1i7Gh9_)0UH@f4+K61ItX(lcL6HZU$DYu|*FS
z7RQUm;;bQ?^zaps2oyqKL#%_qt~$OFB<TjPLiVAVr9s05&nD?zQ6+5xWRM4e$i$)s
z$MZmv7(Oma5<dt8ju%*tyi$~pE25+bm%-jclW3kfrR3Goy;$Uwq$?P^3d`1NHKrD0
zkT=cpvMh%jf)FJhQGda~dJuK|fhL0reZ#X{Y#|4PjCvW(;UrCz?xtY7En3IlD-$Ug
z8|W^}GhCQb(^1p@?`qpEZy)F3zTN|g{o;ZP**x^ooM({6O$~&hTqWZ{9V4%ZP_<db
zi3-BVuOJs>3KF=e>4xQmhD!~ErYSkc$GT&{oSLKw2V+^L!euj}lpazAH7)UcR*+*O
zayBcev3Q&(9pIW+6&Z6jbZ`@E?qjouV#8suT@qP^o;456Q4iUmk+fnRpd~Jfqv8-R
z2&zniAEad$YaXs8bEp=Uh+)Il{?qEFiOf&9Z4E9tv_>B~WZpe8*ym@g0=X2`oSH5M
zAIsk#u74eFf3$RTrGH~<vz}_BJ|uRYyggR`wp8kP_T|smPDiib#>aZu&g~Sq(N(Xe
zHhbz1?r+7?Pa|(mrG7_NJ}tlRnOW}Zz23IHnp(TFcJ}ehzUB23+Th8Rd+$yj={QZD
WTkCuNIpX~aZ(}YyuD%$#dHXK|UqU+o

literal 0
HcmV?d00001

diff --git a/cms/static/img/home-icon-blue.png b/cms/static/img/home-icon-blue.png
new file mode 100644
index 0000000000000000000000000000000000000000..45b4971a2a2a8ca2a195623fe8847e5ac5587852
GIT binary patch
literal 1106
zcmaJ=O-K|`93NX<R#CKsXeH`3iY2r=JF~jFgOjd1YrD{FvM#ts=i})PIv>tF+f~Tg
z^srG-f*>8DYfwlZhYmqWY+_JRbjwSZpi3V_P?xYb>S~9!VP@WYe}2E;|MOiQN}g`0
zYpEj$q9GCIQ+RF0Uz5j;|36B+gcmQ0WzeuOhH|0>iHKrI5F|8l9HyYC%uKz2y#(QE
zQ_~rg5zer(q4`Az<Iig*W)nnjU)~hu35b9M$5ovpzdn9S0#)J2kuD)1m{FKj<FghV
zo=v9Z*$FwUkbS2>Z=S^h8bl(<Ym>Uo<~edpm&JR>Op#y<f+jd}JE)8>1fqroL6<-1
zlLIsjLLooh*%b=WCjk?n87hF^kdN+UyFx6}4R#(9d$W`=HpLI__`)ZS%pzp66qU>6
z{JEgtu*NAm91c4g4CBKHpFN`^G4Ipu*0KT*ZP`*yq#8PK6h+CHMjVMF-A+L>cV%^Z
zr%bqDR9-YG+8=OIDgy=K|4>caMcXI^_u~Dhu$`VUA(eu*F>T4XabvBHE0c{{P(+56
zHjK$~6^F70GVH8jg6MDvoDf7=)g42}7DEu&gl;2ImtlhENUY&kRfUaq4@A3T!7vjI
z4A69p2?qzlu~>)?c6QRZ1A#J^H{@vz>Zr_B_PCLXTxS?G6MN>NrJjSzpk-)aD`{4(
z97}gay&bMnIhLM^TnYz6Ij#Mx)nyZ&A7{HexcIO;`cTL7ZsEb+xcktBFGVTAN7DKC
zQvJ=j<$`CmzI36sLn5DnR`A4Knq6vfGug(bI}w$$8s@!io{v`!Fip$iTHMX;lPEAZ
zxZdA>*!_8sS>IoL<htK{%ypv}_;e)wrG4qzyZ-iGcNlo9U5~zb*B71x_wC5fsfFV&
z`>)2Uylb9PaIs!mm75+E>f`Q}YU$v0akJ3lDK>t1^Xq7>>{>4L)D<`H_1BCRe%~sf
xQKGb2e3e{S?Mr=ce|xd!Y|kQ@JilC3eTbMJVH#InZ<L%{o`@y+m4VSqe*oMHU{3%5

literal 0
HcmV?d00001

diff --git a/cms/static/img/log-out-icon.png b/cms/static/img/log-out-icon.png
new file mode 100644
index 0000000000000000000000000000000000000000..c89373619acdede7526d0a0b42497319349c5198
GIT binary patch
literal 1073
zcmaJ=O-K|`93L~RwYGvj&^{kyM3%er;qKH9yXm&G)}kY_F0>cHaptLm&b)Ev>8?iM
zM;{v<g6JR-1a*iyL}iDdLmfQW!H5bHFM%EM5J(=vF4ddWT|2Z5k9q(9pa1Xo|9scl
zTF-bZ_f}FA<xQNGlH}g*%9|_5f9PN!O0H@gPvdsfjWdc3si=m!AV?TW4@^Qu8y<KA
z!xUA1SWl&KT5b_lWcU@=$DcJUf~Kf&L)KE%K8QgV?9t5#z4Y=G4RkF+p9{*YY{g)&
zes;u$?IW!zb)-)XX>`LW5YCE(z<^i*S)<={#B7Al^NK`v%?u6lF1Rm3uO^k2+dvH2
z5Cr}8K9%J-AP9ag5EKNi4)83;Gb}lRj|+%FLF7+>wT~vzY^_^NN=<9Ah!&xHF}6g8
z$z(GAOuZl3Jq#BLg<KAv_Yn`DGi+id>oc920)qq{)z&SnBNMocN*5Z$5t?MWT7qE}
zX-#LXO{8H=R<Rh)&$=ZQ9A)|cu7*+cc5o7|=lf4$CpBzACJ7xhXscv!-8F6~ON`l2
z!N^V_)L-agTQ9=M=|vWZwF}^=tf;!_8fx<hSr!wfgB4SS2`NGo4!^EzVjvi73ZCRx
zUJ3;`F3yMQPlw`hL8=cBH4tPASP7|v1~hR2tF2?Xl2~^c42wjTpsf!<t;t3P$QLc@
zC39ipCHdB{TFG44rjl5OB*VC){cF?(6WJeEEG{llimMMzvhOxo?5XkVZ^@&$pOB)d
z?0na^$rp<a<riP)n#VoYE^Nw8jZW@+RMxTc_^H`rjbU%@(87~Nu%r3Q`>o~l$vgd?
z>91pRp1a*uD>tr08+YY0WdplsI*(K=Q*-gU!<YD(AD<fcd#2BO^eg&kwY@(V8(XPu
zxp{fxgZc9BNGsbD7Vb@ao?H0o-S(SbXzpNVm*3qQy!sJr(tlM<e;7+2$W4r`R6V_2
bwqYx^CAIJ2((}b<?jugbTcyXRJIDV3?3h~=

literal 0
HcmV?d00001

diff --git a/cms/static/img/small-home-icon.png b/cms/static/img/small-home-icon.png
new file mode 100644
index 0000000000000000000000000000000000000000..fb6adcd7cd273a2f23751b69091dd1344cf9fa02
GIT binary patch
literal 1064
zcmaJ=U1-x#6wW#vV|1>vp*R(<sT9REY5M0HR=2k4*1|GMSFrdXrpa9!w&cd-&UQnj
zs0=4Q3=|zh^vx&nS^Qz(d{CSy4qtrmL3|X)#0LdIZ@RVf!5Wg>dk)|CopaAQcRn*V
z(%I45K~Yp^IwfSu>LTCH_BQhOu(z+0WiL+V@i>~mWyyq8OhE+*(wbC+StuzpXJ5hr
zifTQq=JGf%j`A|n7|F&k70n=QiW(TK7?L~*F(|;Isz>Sd$ICQOl_-5OB>F@n0ZVFX
z)`a7;V>x+tQjRF};0Z8L;fa6-u>>mGly32rC|%R#$=-IeG^j!FWR%`aDlcY00+|qm
zn1EOIaU2MT87>$Khq*rB_i=vKN8YfP3-X~b?>`Q<9-2fml?gs83~$9ER+KJbZ15~w
zE|-~dfI()F<sy-Yt>O233Bqg5=vb<Fb<15>5TGTSs)1Fc16xrlplKYXNv4}e(2Rzx
zZf%u`6pXD%2Fo!%`$%=5DE=R+X$`c6vv51#e+pZ<83VFeXrXCSCXJhL+o23TVL}Nb
zGl$Sry^5I<!pJHi10=@7;D{*6s%|@u))=D5r*#WUx(w4olqMRCsw#Xi6dDfo`x1U3
z66Cm~KN5&XlF6_T2of_G^3}NllBYGO<2qN_<_b-@_AqD$i7Y@<JqMLx6KSA!XkKle
zORTBh7FTJWOS~zUCCRXMYyWC>-9_fd-Zlo87>&_~I+=Hq4EE)xuNZPEmeN8jSNTx*
zviNYJr7P3+X?^II^OnQoSn8rSE`Xc#dny7x?s)DWx<B{E<=MX!>%CF^;c^{ZDYkdF
zygr?|w&o(>Wyi+I`8nUNx6ao7PAR^&T1^HX9df4TQkR^i<h#}Cy`O_U?tRayN~-lm
z)d{}J;6U~J=Ri#B^Q=${chIP_$FaMw@O!?;y}0L!gKBA`zCAg1{nXujw|#fh$uZ$U
H{LIBa72Hi*

literal 0
HcmV?d00001

diff --git a/cms/static/js/base.js b/cms/static/js/base.js
index baad5b7177..f533aa14d8 100644
--- a/cms/static/js/base.js
+++ b/cms/static/js/base.js
@@ -34,6 +34,8 @@ $(document).ready(function() {
     $('.unit .item-actions .delete-button').bind('click', deleteUnit);
     $('.new-unit-item').bind('click', createNewUnit);
 
+    $('.collapse-all-button').bind('click', collapseAll);
+
     // autosave when a field is updated on the subsection page
     $body.on('keyup', '.subsection-display-name-input, .unit-subtitle, .policy-list-value', checkForNewValue);
     $('.subsection-display-name-input, .unit-subtitle, .policy-list-name, .policy-list-value').each(function(i) {
@@ -119,6 +121,11 @@ $(document).ready(function() {
     });
 });
 
+function collapseAll(e) {
+    $('.branch').addClass('collapsed');
+    $('.expand-collapse-icon').removeClass('collapse').addClass('expand');
+}
+
 function editSectionPublishDate(e) {
     e.preventDefault();
     $modal = $('.edit-subsection-publish-settings').show();
@@ -588,11 +595,11 @@ function hideToastMessage(e) {
 function addNewSection(e, isTemplate) {
     e.preventDefault();
 
-    $(e.target).hide();
+    $(e.target).addClass('disabled');
 
     var $newSection = $($('#new-section-template').html());
     var $cancelButton = $newSection.find('.new-section-name-cancel');
-    $('.new-courseware-section-button').after($newSection);
+    $('.courseware-overview').prepend($newSection);
     $newSection.find('.new-section-name').focus().select();
     $newSection.find('.section-name-form').bind('submit', saveNewSection);
     $cancelButton.bind('click', cancelNewSection);
@@ -629,7 +636,7 @@ function saveNewSection(e) {
 
 function cancelNewSection(e) {
     e.preventDefault();
-    $('.new-courseware-section-button').show();
+    $('.new-courseware-section-button').removeClass('disabled');
     $(this).parents('section.new-section').remove();
 }
 
diff --git a/cms/static/sass/_base.scss b/cms/static/sass/_base.scss
index ec9cbcf84c..71914c24c7 100644
--- a/cms/static/sass/_base.scss
+++ b/cms/static/sass/_base.scss
@@ -28,6 +28,7 @@ a {
 }
 
 h1 {
+    display: none;
     float: left;
     font-size: 28px;
     font-weight: 300;
@@ -39,8 +40,7 @@ h1 {
 }
 
 .page-actions {
-    float: right;
-    margin-top: 42px;
+    margin-bottom: 25px;
 }
 
 .main-wrapper {
@@ -349,7 +349,7 @@ body.show-wip {
 }
 
 .new-button {
-    @include blue-button;
+    @include green-button;
     font-size: 13px;
     padding: 8px 20px 10px;
     text-align: center;
diff --git a/cms/static/sass/_cms_mixins.scss b/cms/static/sass/_cms_mixins.scss
index 710bd7deb9..2c794ee266 100644
--- a/cms/static/sass/_cms_mixins.scss
+++ b/cms/static/sass/_cms_mixins.scss
@@ -88,7 +88,28 @@
 
 	&:hover {
 		background-color: #d9e3ee;
-		color: #6d788b;
+	}
+}
+
+@mixin green-button {
+	@include button;
+	border: 1px solid $darkGreen;
+	border-radius: 3px;
+	@include linear-gradient(top, rgba(255, 255, 255, .3), rgba(255, 255, 255, 0));
+	background-color: $green;
+	@include box-shadow(0 1px 0 rgba(255, 255, 255, .3) inset);
+	color: #fff;
+
+	&:hover {
+		background-color: $brightGreen;
+		color: #fff;
+	}
+
+	&.disabled {
+		border: 1px solid $disabledGreen !important;
+		background: $disabledGreen !important;
+		color: #fff !important;
+		@include box-shadow(none);
 	}
 }
 
diff --git a/cms/static/sass/_courseware.scss b/cms/static/sass/_courseware.scss
index 05a5a43ab2..75383b28ae 100644
--- a/cms/static/sass/_courseware.scss
+++ b/cms/static/sass/_courseware.scss
@@ -9,7 +9,7 @@ input.courseware-unit-search-input {
 	position: relative;
 	background: #fff;
 	border-radius: 3px;
-	margin: 15px 0;
+	margin-top: 15px;
 	padding-bottom: 12px;
 	@include box-shadow(0 1px 1px rgba(0,0,0,0.2), 0 0 0 1px rgba(0, 0, 0, 0.1));
 
@@ -192,6 +192,17 @@ input.courseware-unit-search-input {
 	}
 }
 
+.collapse-all-button {
+	float: right;
+	margin-top: 10px;
+	font-size: 13px;
+	color: $darkGrey;
+
+	.collapse-all-icon {
+		margin-right: 6px;
+	}
+}
+
 .new-section-name,
 .new-subsection-name-input {
 	width: 515px;
diff --git a/cms/static/sass/_graphics.scss b/cms/static/sass/_graphics.scss
index 4a63a8a885..80599f7bc4 100644
--- a/cms/static/sass/_graphics.scss
+++ b/cms/static/sass/_graphics.scss
@@ -56,6 +56,27 @@
 	background: url(../img/home-icon.png) no-repeat;
 }
 
+.small-home-icon {
+	display: inline-block;
+	width: 16px;
+	height: 14px;
+	background: url(../img/small-home-icon.png) no-repeat;
+}
+
+.log-out-icon {
+	display: inline-block;
+	width: 15px;
+	height: 13px;
+	background: url(../img/log-out-icon.png) no-repeat;
+}
+
+.collapse-all-icon {
+	display: inline-block;
+	width: 15px;
+	height: 9px;
+	background: url(../img/collapse-all-icon.png) no-repeat;
+}
+
 .calendar-icon {
 	display: inline-block;
 	width: 12px;
diff --git a/cms/static/sass/_header.scss b/cms/static/sass/_header.scss
index cb9a7ed121..039ac69898 100644
--- a/cms/static/sass/_header.scss
+++ b/cms/static/sass/_header.scss
@@ -5,18 +5,16 @@ body.no-header {
 }
 
 @mixin active {
-	@include linear-gradient(top, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.3));
-	@include box-shadow(0 2px 8px rgba(0, 0, 0, .7) inset);
+	color: #3c3c3c;
+	border-bottom: 3px solid $mediumGrey;
 }
 
 .primary-header {
 	width: 100%;
-	height: 36px;
-	border-bottom: 1px solid #2c2e33;
-	@include linear-gradient(top, #686b76, #54565e);
-	font-size: 13px;
-	color: #fff;
-	@include box-shadow(0 1px 1px rgba(0, 0, 0, 0.2), 0 -1px 0px rgba(255, 255, 255, 0.05) inset);
+	margin-bottom: 25px;
+	border-top: 6px solid $blue;
+	border-bottom: 1px solid $mediumGrey;
+	background: #fff;
 
 	&.active-tab-courseware #courseware-tab {
 		@include active;
@@ -38,23 +36,6 @@ body.no-header {
 		@include active;
 	}
 
-	#import-tab {
-		@include box-shadow(1px 0 0 #787981 inset, -1px 0 0 #3d3e44 inset, 1px 0 0 #787981, -1px 0 0 #3d3e44);
-	}
-
-	.left {
-		position: absolute;
-		left: 0;
-		width: 100%;
-	}
-
-	.class-name {
-		max-width: 350px;
-		text-overflow: ellipsis;
-    white-space: nowrap;
-    overflow: hidden;
-	}
-
 	.drop-icon {
 		margin-left: 5px;
 		font-size: 11px;
@@ -65,26 +46,46 @@ body.no-header {
 		line-height: 18px;
 	}
 
-	a,
-	.username {
-		float: left;
-		display: inline-block;
-		height: 29px;
-		padding: 7px 15px 0;
-		color: #e4e6ee;
+	.class-nav-bar {
+		clear: both;
 	}
 
-	.class-nav,
-	.class-nav li {
-		float: left;
-	}
+	.class-nav {
+		@include clearfix;
+		border-top: 1px solid $mediumGrey;
 
-	a {
-		@include box-shadow(1px 0 0 #787981 inset, -1px 0 0 #3d3e44 inset, 1px 0 0 #787981, -1px 0 0 #3d3e44);
-
-		&:hover {
-			background: rgba(255, 255, 255, .1);
+		a {
+			float: left;
+			display: inline-block;
+			padding: 20px 25px 22px;
+			font-size: 15px;
 		}
 
+		li {
+			float: left;
+		}
+	}
+
+	.class {
+		@include clearfix;
+		font-size: 12px;
+		color: $darkGrey;
+
+		a {
+			display: inline-block;
+			height: 20px;
+			padding: 5px 10px 6px;
+			color: $darkGrey;
+		}
+
+		.home {
+			position: relative;
+			top: 1px;
+		}
+
+		.log-out {
+			position: relative;
+			top: 3px;
+		}
 	}
 }
\ No newline at end of file
diff --git a/cms/static/sass/_variables.scss b/cms/static/sass/_variables.scss
index fec65e4e11..98134fc83e 100644
--- a/cms/static/sass/_variables.scss
+++ b/cms/static/sass/_variables.scss
@@ -19,4 +19,9 @@ $lightGrey: #edf1f5;
 $mediumGrey: #ced2db;
 $darkGrey: #8891a1;
 $extraDarkGrey: #3d4043;
-$paleYellow: #fffcf1;
\ No newline at end of file
+$paleYellow: #fffcf1;
+
+$green: rgb(37, 184, 90);
+$brightGreen: rgb(22, 202, 87);
+$disabledGreen: rgb(124, 206, 153);
+$darkGreen: rgb(52, 133, 76);
\ No newline at end of file
diff --git a/cms/templates/overview.html b/cms/templates/overview.html
index 771991aec6..91088266af 100644
--- a/cms/templates/overview.html
+++ b/cms/templates/overview.html
@@ -99,9 +99,11 @@
   <div class="main-wrapper">
     <div class="inner-wrapper">
       <h1>Courseware</h1>
-      <div class="page-actions"></div>
-      <article class="courseware-overview" data-course-id="${context_course.location.url()}">
+      <div class="page-actions">
         <a href="#" class="new-button new-courseware-section-button"><span class="plus-icon white"></span> New Section</a>
+        <a href="#" class="collapse-all-button"><span class="collapse-all-icon"></span>Collapse All</a>
+      </div>
+      <article class="courseware-overview" data-course-id="${context_course.location.url()}">        
         % for section in sections:
         <section class="courseware-section branch" data-id="${section.location}">
           <header>
diff --git a/cms/templates/widgets/header.html b/cms/templates/widgets/header.html
index 877f03533c..563ef0249a 100644
--- a/cms/templates/widgets/header.html
+++ b/cms/templates/widgets/header.html
@@ -2,12 +2,28 @@
 
 <% active_tab_class = 'active-tab-' + active_tab if active_tab else '' %>
 <header class="primary-header ${active_tab_class}">
-  <nav class="inner-wrapper">
-    <div class="left">
-      <a href="/"><span class="home-icon"></span></a>
+  <div class="inner-wrapper">
+    <div class="class">
+      <div class="left">        
+        % if context_course:
+          <% ctx_loc = context_course.location %>
+          <a href="/" class="home"><span class="small-home-icon"></span></a> › 
+          <a href="${reverse('course_index', kwargs=dict(org=ctx_loc.org, course=ctx_loc.course, name=ctx_loc.name))}" class="class-name">${context_course.display_name}</a> ›
+        % endif
+      </div>
+
+      <div class="right">
+        <span class="username">${ user.username }</span>
+        % if user.is_authenticated():
+           <a href="${reverse('logout')}" class="log-out"><span class="log-out-icon"></span></a>
+        % else:
+           <a href="${reverse('login')}">Log in</a>
+        % endif
+      </div>
+    </div>
+    <nav class="class-nav-bar">
       % if context_course:
       <% ctx_loc = context_course.location %>
-      <a href="${reverse('course_index', kwargs=dict(org=ctx_loc.org, course=ctx_loc.course, name=ctx_loc.name))}" class="class-name">${context_course.display_name}</a>
       <ul class="class-nav">
         <li><a href="${reverse('course_index', kwargs=dict(org=ctx_loc.org, course=ctx_loc.course, name=ctx_loc.name))}" id='courseware-tab'>Courseware</a></li>
         <li><a href="${reverse('edit_tabs', kwargs=dict(org=ctx_loc.org, course=ctx_loc.course, coursename=ctx_loc.name))}" id='pages-tab'>Tabs</a></li>
@@ -16,14 +32,6 @@
         <li><a href="${reverse('import_course', kwargs=dict(org=ctx_loc.org, course=ctx_loc.course, name=ctx_loc.name))}" id='import-tab'>Import</a></li>
       </ul>
       % endif
-    </div>
-    <div class="right">
-      <span class="username">${ user.username }</span>
-      % if user.is_authenticated():
-         <a href="${reverse('logout')}">Log out</a>
-      % else:
-         <a href="${reverse('login')}">Log in</a>
-      % endif
-    </div>
-  </nav>
+    </nav>
+  </div>
 </header>

From 6d898352453561168155d535a24850e32631ba18 Mon Sep 17 00:00:00 2001
From: Tom Giannattasio <tom@mitx.mit.edu>
Date: Wed, 5 Dec 2012 17:01:29 -0500
Subject: [PATCH 07/43] more defined header, new icons, cleaner static tabs
 page

---
 cms/static/img/log-out-icon.png    | Bin 1073 -> 1073 bytes
 cms/static/img/small-home-icon.png | Bin 1064 -> 1064 bytes
 cms/static/sass/_base.scss         |  16 +++++++-------
 cms/static/sass/_courseware.scss   |   4 ++--
 cms/static/sass/_header.scss       |  33 +++++++++++++++++++----------
 cms/static/sass/_static-pages.scss |  12 ++++-------
 cms/templates/edit-tabs.html       |  13 +++++-------
 cms/templates/overview.html        |   1 -
 cms/templates/widgets/header.html  |  30 +++++++++++++-------------
 9 files changed, 56 insertions(+), 53 deletions(-)

diff --git a/cms/static/img/log-out-icon.png b/cms/static/img/log-out-icon.png
index c89373619acdede7526d0a0b42497319349c5198..887d59f45da9d2c659acf52704c76f93637cef6c 100644
GIT binary patch
delta 276
zcmdnUv5{kg2NRE_tAVkhi=~B;i;KbJ2TWp<vzVk{f|g*x2}~|90W+v71DJq0RE6kd
zLuSYNMGEI{GcYhL_H=O!skoICv#08KJ=>oK!Rai*LcjS0(isiSLzs7|h1JXoZK#kE
zus@P`(NSUAv89r1E(I1hg*whNZxpsWYw$syx4A(>;62kLtqBKxc%CqB=#KE<NS*L@
zeWQg?$9JJiJeL`apI8XAGkpx6p~B7Sx0U_T{S!<&4iz~r?E5z!{VXl>FZIauT?w<E
zF4TO@x6+aC(jVTA<;)wc1lXBB8YY=Cvq&&}7L)$sajxD0=w1d-S3j3^P6<r_%H3g<

delta 276
zcmdnUv5{kg2NREpsi~W(g`t6wi>1lr2TWp<vzVk{f`(wh2}~|f0Rva4Dg&5+8&rkp
zWJ6}h`pr$<=NK3m7JIrlhE&{2dNX6k3w!3e10CK?oSn7o9h)0wNUvgy71p*ptL0$B
z+adpG!wUrg@5h&Tn3XK%<ZvE&-gtv^ewxIO{x(Mkk&bf4LeUcmYHXhvZn)~Gv>2WE
zcHKdS^GG#kW?N>1WRXmVbK?(9pGmDO%WpA%%uitybFeX6)O`QOqo2Hd|BW7b#~Pgd
zbYV(q`xOQD%ztc0E;mNVb~HEskk~kjk%@<aJ4AZr`z<dv0o}{s>FVdQ&MBb@07PD9
ATL1t6

diff --git a/cms/static/img/small-home-icon.png b/cms/static/img/small-home-icon.png
index fb6adcd7cd273a2f23751b69091dd1344cf9fa02..5755bf659db9f74960071ee1ba6a6c83fec87c9d 100644
GIT binary patch
delta 267
zcmZ3%v4UfR2NRE_tAVkhi>0%Xi;KbJ2TWp<vzVk{f-Yde2}~|90Y|7R1DJplRE6kd
zLuSW%ZN6K37#J94dAc};RNP96*;B>NEVqE?$o<A2l6tH@EGF^{kN!I7xUOO>a@fP&
zk=hW!J73Yq!lc<mgYl!Hf?eBr0X3#sdlyJ7R|G1qXMNQFgC|jGfh1dj)S;GTGa0+n
zN}MGo@JwWrywJ5|CZq4?dJQ+T7RHkk*d{PaI@~co?qJ36@??6`tq7ksMg`mZGbA)v
nbRv%Y6V`My&=+83VB%q5$kV>BW*2Y-=u8GrS3j3^P6<r_&aG7{

delta 267
zcmZ3%v4UfR2NREpsi~W(g@Ln?i>1lr2TWp<vzVk{f-Yde2}~|90Y|7R1DJplRE6kd
zLuSYNmc6I-7#J94dAc};RNP8>Gh@dDM*aY{NADf}@Jwe?W17X!@Uc!|n$lGUOND!^
zM~ocSw4E1FlbPixHKpN)fPnnrbPi$0vvC1Emj!@|_cMKTuW2(7yuib3!JFuG`AmbW
z@h(Lkk2a5Ho($JZXBw9Mv=>p9KGcxn!F-~DN8z1$vVv^GmnX)KxjJfx879oj_u&y?
o64Ocg-zlOzL%f5Dfsu{j(;n@~QS&2&fzD*`boFyt=akR{00Wd*6951J

diff --git a/cms/static/sass/_base.scss b/cms/static/sass/_base.scss
index 71914c24c7..f5376cd0e5 100644
--- a/cms/static/sass/_base.scss
+++ b/cms/static/sass/_base.scss
@@ -6,7 +6,7 @@
 
 body {
     min-width: 980px;
-    background: #eaebed;
+    background: #eaecf3;
     font-size: 16px;
     line-height: 1.6;
     color: #3c3c3c;
@@ -28,7 +28,6 @@ a {
 }
 
 h1 {
-    display: none;
     float: left;
     font-size: 28px;
     font-weight: 300;
@@ -40,7 +39,7 @@ h1 {
 }
 
 .page-actions {
-    margin-bottom: 25px;
+    margin-bottom: 30px;
 }
 
 .main-wrapper {
@@ -177,6 +176,12 @@ code {
     padding: 10px 0;
 }
 
+.details {
+    display: none;
+    margin-bottom: 30px;
+    font-size: 14px;
+}
+
 .window {
     margin-bottom: 20px;
 
@@ -184,11 +189,6 @@ code {
         padding: 20px;
     }
 
-    .details {
-      margin-bottom: 30px;
-      font-size: 14px;
-    }
-
     h4 {
         padding: 6px 14px;
         border-bottom: 1px solid #cbd1db;
diff --git a/cms/static/sass/_courseware.scss b/cms/static/sass/_courseware.scss
index 75383b28ae..2f6745333d 100644
--- a/cms/static/sass/_courseware.scss
+++ b/cms/static/sass/_courseware.scss
@@ -146,13 +146,13 @@ input.courseware-unit-search-input {
 		
 		.save-button {
 			@include blue-button;
-			padding: 10px 20px;
+			padding: 8px 20px;
 			margin-right: 5px;
 		}
 
 		.cancel-button {
 			@include white-button;
-			padding: 10px 20px;
+			padding: 8px 20px;
 		}
 	}
 
diff --git a/cms/static/sass/_header.scss b/cms/static/sass/_header.scss
index 039ac69898..ab1dcea03a 100644
--- a/cms/static/sass/_header.scss
+++ b/cms/static/sass/_header.scss
@@ -5,16 +5,16 @@ body.no-header {
 }
 
 @mixin active {
-	color: #3c3c3c;
-	border-bottom: 3px solid $mediumGrey;
+	color: $blue;
+	@include linear-gradient(top, rgba(255, 255, 255, .4), rgba(255, 255, 255, 0));
+	background-color: rgba(255, 255, 255, .3);
+	@include box-shadow(0 -1px 0 rgba(0, 0, 0, .2) inset, 0 1px 0 #fff inset);
+	text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
 }
 
 .primary-header {
 	width: 100%;
-	margin-bottom: 25px;
-	border-top: 6px solid $blue;
-	border-bottom: 1px solid $mediumGrey;
-	background: #fff;
+	margin-bottom: 30px;
 
 	&.active-tab-courseware #courseware-tab {
 		@include active;
@@ -48,17 +48,25 @@ body.no-header {
 
 	.class-nav-bar {
 		clear: both;
+		@include linear-gradient(top, rgba(255, 255, 255, .4), rgba(255, 255, 255, 0));
+		background-color: rgb(197, 207, 223);
+		@include box-shadow(0 1px 0 rgba(255, 255, 255, 0.2) inset, 0 -1px 0 rgba(0, 0, 0, 0.2) inset, 0 1px 1px rgba(0, 0, 0, 0.1));
 	}
 
 	.class-nav {
-		@include clearfix;
-		border-top: 1px solid $mediumGrey;
+		@include clearfix;		
 
 		a {
 			float: left;
 			display: inline-block;
-			padding: 20px 25px 22px;
+			padding: 15px 25px 17px;
 			font-size: 15px;
+			color: #3c3c3c;
+			text-shadow: 0 1px 0 rgba(255, 255, 255, 0.3);
+
+			&:hover {
+				@include linear-gradient(top, rgba(255, 255, 255, .2), rgba(255, 255, 255, 0));
+			}
 		}
 
 		li {
@@ -69,13 +77,16 @@ body.no-header {
 	.class {
 		@include clearfix;
 		font-size: 12px;
-		color: $darkGrey;
+		color: rgb(163, 171, 184);
+		@include linear-gradient(top, rgba(255, 255, 255, 0), rgba(255, 255, 255, .1));
+		background-color: rgb(47, 53, 63);
+		@include box-shadow(0 -1px 3px rgba(0, 0, 0, 0.6) inset);
 
 		a {
 			display: inline-block;
 			height: 20px;
 			padding: 5px 10px 6px;
-			color: $darkGrey;
+			color: rgb(163, 171, 184);			
 		}
 
 		.home {
diff --git a/cms/static/sass/_static-pages.scss b/cms/static/sass/_static-pages.scss
index 68cb3e1d07..f862484250 100644
--- a/cms/static/sass/_static-pages.scss
+++ b/cms/static/sass/_static-pages.scss
@@ -6,12 +6,8 @@
     padding: 12px 0;
   }
 
-  .new-tab {
-    margin-bottom: 15px;
-  }
-
   .unit-body {
-    padding: 30px 40px;
+    padding: 0;
   }
 
   .components > li {
@@ -40,7 +36,7 @@
       }
 
       .drag-handle {
-        background: url(../img/drag-handles.png) center no-repeat $lightGrey;
+        background: url(../img/drag-handles.png) center no-repeat #fff;
       }
     }
 
@@ -50,7 +46,7 @@
       z-index: 11;
       width: 35px;
       border: none;
-      background: url(../img/drag-handles.png) center no-repeat $lightGrey;
+      background: url(../img/drag-handles.png) center no-repeat #fff;
 
       &:hover {
         background: url(../img/drag-handles.png) center no-repeat $lightGrey;
@@ -73,7 +69,7 @@
     padding: 20px 20px 22px;
     font-size: 24px;
     font-weight: 300;
-    background: $lightGrey;
+    background: #fff;
   }
 
   .static-page-item {
diff --git a/cms/templates/edit-tabs.html b/cms/templates/edit-tabs.html
index 8e75b49410..637329f356 100644
--- a/cms/templates/edit-tabs.html
+++ b/cms/templates/edit-tabs.html
@@ -17,18 +17,15 @@
 <%block name="content">
 <div class="main-wrapper">
   <div class="inner-wrapper">
-    <div>
-      <h1>Static Tabs</h1>
-    </div>
-    <article class="unit-body window">
-      <div class="details">
-        <p>Here you can add and manage additional pages for your course. These pages will be added to the primary navigation menu alongside Courseware, Course Info, Discussion, etc.</p>
-      </div>
-      <div class="list-header">
+    <div class="page-actions">
         <a href="#" class="new-button new-tab">
           <span class="plus-icon white"></span>New Tab
         </a>
       </div>
+    <article class="unit-body">
+      <div class="details">
+        <p>Here you can add and manage additional pages for your course. These pages will be added to the primary navigation menu alongside Courseware, Course Info, Discussion, etc.</p>
+      </div>
       <div class="tab-list">
         <ol class='components'>
           % for id in components:
diff --git a/cms/templates/overview.html b/cms/templates/overview.html
index 91088266af..b2e31db176 100644
--- a/cms/templates/overview.html
+++ b/cms/templates/overview.html
@@ -98,7 +98,6 @@
 
   <div class="main-wrapper">
     <div class="inner-wrapper">
-      <h1>Courseware</h1>
       <div class="page-actions">
         <a href="#" class="new-button new-courseware-section-button"><span class="plus-icon white"></span> New Section</a>
         <a href="#" class="collapse-all-button"><span class="collapse-all-icon"></span>Collapse All</a>
diff --git a/cms/templates/widgets/header.html b/cms/templates/widgets/header.html
index 563ef0249a..29b68165f7 100644
--- a/cms/templates/widgets/header.html
+++ b/cms/templates/widgets/header.html
@@ -1,9 +1,9 @@
 <%! from django.core.urlresolvers import reverse %>
 
 <% active_tab_class = 'active-tab-' + active_tab if active_tab else '' %>
-<header class="primary-header ${active_tab_class}">
-  <div class="inner-wrapper">
-    <div class="class">
+<header class="primary-header ${active_tab_class}">  
+  <div class="class">
+    <div class="inner-wrapper">
       <div class="left">        
         % if context_course:
           <% ctx_loc = context_course.location %>
@@ -21,17 +21,17 @@
         % endif
       </div>
     </div>
-    <nav class="class-nav-bar">
-      % if context_course:
-      <% ctx_loc = context_course.location %>
-      <ul class="class-nav">
-        <li><a href="${reverse('course_index', kwargs=dict(org=ctx_loc.org, course=ctx_loc.course, name=ctx_loc.name))}" id='courseware-tab'>Courseware</a></li>
-        <li><a href="${reverse('edit_tabs', kwargs=dict(org=ctx_loc.org, course=ctx_loc.course, coursename=ctx_loc.name))}" id='pages-tab'>Tabs</a></li>
-        <li><a href="${reverse('asset_index', kwargs=dict(org=ctx_loc.org, course=ctx_loc.course, name=ctx_loc.name))}" id='assets-tab'>Assets</a></li>
-        <li><a href="${reverse('manage_users', kwargs=dict(location=ctx_loc))}" id='users-tab'>Users</a></li>
-        <li><a href="${reverse('import_course', kwargs=dict(org=ctx_loc.org, course=ctx_loc.course, name=ctx_loc.name))}" id='import-tab'>Import</a></li>
-      </ul>
-      % endif
-    </nav>
   </div>
+  <nav class="class-nav-bar">
+    % if context_course:
+    <% ctx_loc = context_course.location %>
+    <ul class="class-nav inner-wrapper">
+      <li><a href="${reverse('course_index', kwargs=dict(org=ctx_loc.org, course=ctx_loc.course, name=ctx_loc.name))}" id='courseware-tab'>Courseware</a></li>
+      <li><a href="${reverse('edit_tabs', kwargs=dict(org=ctx_loc.org, course=ctx_loc.course, coursename=ctx_loc.name))}" id='pages-tab'>Tabs</a></li>
+      <li><a href="${reverse('asset_index', kwargs=dict(org=ctx_loc.org, course=ctx_loc.course, name=ctx_loc.name))}" id='assets-tab'>Assets</a></li>
+      <li><a href="${reverse('manage_users', kwargs=dict(location=ctx_loc))}" id='users-tab'>Users</a></li>
+      <li><a href="${reverse('import_course', kwargs=dict(org=ctx_loc.org, course=ctx_loc.course, name=ctx_loc.name))}" id='import-tab'>Import</a></li>
+    </ul>
+    % endif
+  </nav>
 </header>

From 1a4020908228f888e7652aa4ed15724d9f293608 Mon Sep 17 00:00:00 2001
From: Tom Giannattasio <tom@mitx.mit.edu>
Date: Thu, 6 Dec 2012 14:25:30 -0500
Subject: [PATCH 08/43] cleaned up editor styles; cleaned up static tabs page

---
 cms/static/coffee/src/views/module_edit.coffee |  1 +
 cms/static/sass/_base.scss                     | 12 +++++++++---
 cms/static/sass/_cms_mixins.scss               | 13 +++++--------
 cms/static/sass/_header.scss                   |  5 ++---
 cms/static/sass/_static-pages.scss             |  5 +++++
 cms/static/sass/_unit.scss                     | 11 -----------
 cms/static/sass/_variables.scss                |  5 +++--
 cms/templates/widgets/metadata-edit.html       |  1 -
 8 files changed, 25 insertions(+), 28 deletions(-)

diff --git a/cms/static/coffee/src/views/module_edit.coffee b/cms/static/coffee/src/views/module_edit.coffee
index ad875294a1..068750c3d9 100644
--- a/cms/static/coffee/src/views/module_edit.coffee
+++ b/cms/static/coffee/src/views/module_edit.coffee
@@ -74,4 +74,5 @@ class CMS.Views.ModuleEdit extends Backbone.View
     event.preventDefault()
     @$el.addClass('editing')
     @$component_editor().slideDown(150)
+    # $modalCover.show()
     @loadEdit()
diff --git a/cms/static/sass/_base.scss b/cms/static/sass/_base.scss
index f5376cd0e5..eefe1c61ce 100644
--- a/cms/static/sass/_base.scss
+++ b/cms/static/sass/_base.scss
@@ -9,7 +9,7 @@ body {
     background: #eaecf3;
     font-size: 16px;
     line-height: 1.6;
-    color: #3c3c3c;
+    color: $baseFontColor;
 }
 
 body,
@@ -93,7 +93,7 @@ input[type="password"] {
     @include box-shadow(0 1px 2px rgba(0, 0, 0, .1) inset);
     font-family: 'Open Sans', sans-serif;
     font-size: 11px;
-    color: #3c3c3c;
+    color: $baseFontColor;
     outline: 0;
 
     &::-webkit-input-placeholder,
@@ -110,7 +110,7 @@ input.search {
     border-radius: 20px;
     background: url(../img/search-icon.png) no-repeat 8px 7px #edf1f5;
     font-family: 'Open Sans', sans-serif;
-    color: #3c3c3c;
+    color: $baseFontColor;
     outline: 0;
 
     &::-webkit-input-placeholder {
@@ -129,6 +129,12 @@ code {
     font-family: Monaco, monospace;
 }
 
+.CodeMirror {
+    font-size: 13px;
+    border: 1px solid $darkGrey;
+    background: #fff;
+}
+
 .text-editor {
     width: 100%;
     min-height: 80px;
diff --git a/cms/static/sass/_cms_mixins.scss b/cms/static/sass/_cms_mixins.scss
index 2c794ee266..50b62b7d57 100644
--- a/cms/static/sass/_cms_mixins.scss
+++ b/cms/static/sass/_cms_mixins.scss
@@ -130,18 +130,17 @@
 @mixin edit-box {
 	padding: 15px 20px;
 	border-radius: 3px;
-	border: 1px solid #5597dd;
-	@include linear-gradient(top, rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0));
-	background-color: #5597dd;
+	background-color: $lightBluishGrey;
+	color: #3c3c3c;
 	@include box-shadow(0 1px 0 rgba(255, 255, 255, .2) inset);
 
 	label {
-		color: #fff;
+		color: $baseFontColor;
 	}
 
 	input,
 	textarea {
-		border: 1px solid #3c3c3c;
+		border: 1px solid $darkGrey;
 	}
 
 	textarea {
@@ -161,14 +160,12 @@
 	}
 
 	.save-button {
-		@include orange-button;
-		border-color: #3c3c3c;
+		@include blue-button;
 		margin-top: 0;
 	}
 
 	.cancel-button {
 		@include white-button;
-		border-color: #30649C;
 		margin-top: 0;
 	}
 }
diff --git a/cms/static/sass/_header.scss b/cms/static/sass/_header.scss
index ab1dcea03a..8402fa54be 100644
--- a/cms/static/sass/_header.scss
+++ b/cms/static/sass/_header.scss
@@ -49,8 +49,8 @@ body.no-header {
 	.class-nav-bar {
 		clear: both;
 		@include linear-gradient(top, rgba(255, 255, 255, .4), rgba(255, 255, 255, 0));
-		background-color: rgb(197, 207, 223);
-		@include box-shadow(0 1px 0 rgba(255, 255, 255, 0.2) inset, 0 -1px 0 rgba(0, 0, 0, 0.2) inset, 0 1px 1px rgba(0, 0, 0, 0.1));
+		background-color: $lightBluishGrey;
+		@include box-shadow(0 1px 0 rgba(255, 255, 255, 0.2) inset, 0 -1px 0 rgba(0, 0, 0, 0.2) inset);
 	}
 
 	.class-nav {
@@ -80,7 +80,6 @@ body.no-header {
 		color: rgb(163, 171, 184);
 		@include linear-gradient(top, rgba(255, 255, 255, 0), rgba(255, 255, 255, .1));
 		background-color: rgb(47, 53, 63);
-		@include box-shadow(0 -1px 3px rgba(0, 0, 0, 0.6) inset);
 
 		a {
 			display: inline-block;
diff --git a/cms/static/sass/_static-pages.scss b/cms/static/sass/_static-pages.scss
index f862484250..9a2d1303ec 100644
--- a/cms/static/sass/_static-pages.scss
+++ b/cms/static/sass/_static-pages.scss
@@ -10,6 +10,11 @@
     padding: 0;
   }
 
+  .component-editor {
+    border: none;
+    border-radius: 0;
+  }
+
   .components > li {
     margin: 0;
     border-radius: 0;
diff --git a/cms/static/sass/_unit.scss b/cms/static/sass/_unit.scss
index a7a33f6024..978d53e1b3 100644
--- a/cms/static/sass/_unit.scss
+++ b/cms/static/sass/_unit.scss
@@ -156,7 +156,6 @@
     }
 
     &.editing {
-      border-color: #6696d7;
 
       .drag-handle,
       .component-actions {
@@ -203,10 +202,6 @@
     @include edit-box;
     display: none;
     padding: 20px;
-    border-radius: 2px 2px 0 0;
-    @include linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, .1));
-    background-color: $blue;
-    color: #fff;
     @include box-shadow(none);
 
     .metadata_edit {
@@ -223,12 +218,6 @@
       }
     }
 
-    .CodeMirror {
-      border: 1px solid #3c3c3c;
-      background: #fff;
-      color: #3c3c3c;
-    }
-
     h3 {
       margin-bottom: 10px;
       font-size: 18px;
diff --git a/cms/static/sass/_variables.scss b/cms/static/sass/_variables.scss
index 98134fc83e..985d87ca70 100644
--- a/cms/static/sass/_variables.scss
+++ b/cms/static/sass/_variables.scss
@@ -13,6 +13,7 @@ $body-line-height: golden-ratio(.875em, 1);
 $pink: rgb(182,37,104);
 $error-red: rgb(253, 87, 87);
 
+$baseFontColor: #3c3c3c;
 $blue: #5597dd;
 $orange: #edbd3c;
 $lightGrey: #edf1f5;
@@ -20,8 +21,8 @@ $mediumGrey: #ced2db;
 $darkGrey: #8891a1;
 $extraDarkGrey: #3d4043;
 $paleYellow: #fffcf1;
-
 $green: rgb(37, 184, 90);
 $brightGreen: rgb(22, 202, 87);
 $disabledGreen: rgb(124, 206, 153);
-$darkGreen: rgb(52, 133, 76);
\ No newline at end of file
+$darkGreen: rgb(52, 133, 76);
+$lightBluishGrey: rgb(197, 207, 223);
\ No newline at end of file
diff --git a/cms/templates/widgets/metadata-edit.html b/cms/templates/widgets/metadata-edit.html
index 069db424da..590baec3c9 100644
--- a/cms/templates/widgets/metadata-edit.html
+++ b/cms/templates/widgets/metadata-edit.html
@@ -4,7 +4,6 @@
   hlskey = hashlib.md5(module.location.url()).hexdigest()
 %>
 <section class="metadata_edit">
-  <h3>Metadata</h3>
   <ul>
     % for keyname in editable_metadata_fields:
     <li>

From 6c75a71e8ca9c7f079d7424f300ed61fa3c6b3f8 Mon Sep 17 00:00:00 2001
From: Tom Giannattasio <tom@mitx.mit.edu>
Date: Thu, 6 Dec 2012 16:34:13 -0500
Subject: [PATCH 09/43] cleaned up subsection and unit page

---
 .../coffee/src/views/module_edit.coffee       |  1 -
 cms/static/sass/_base.scss                    | 26 +++++++++----------
 cms/static/sass/_cms_mixins.scss              | 22 ++++++++++------
 cms/static/sass/_courseware.scss              |  3 ++-
 cms/static/sass/_static-pages.scss            |  2 +-
 cms/static/sass/_unit.scss                    | 15 +++++------
 cms/static/sass/_variables.scss               |  5 ++--
 7 files changed, 38 insertions(+), 36 deletions(-)

diff --git a/cms/static/coffee/src/views/module_edit.coffee b/cms/static/coffee/src/views/module_edit.coffee
index 068750c3d9..ad875294a1 100644
--- a/cms/static/coffee/src/views/module_edit.coffee
+++ b/cms/static/coffee/src/views/module_edit.coffee
@@ -74,5 +74,4 @@ class CMS.Views.ModuleEdit extends Backbone.View
     event.preventDefault()
     @$el.addClass('editing')
     @$component_editor().slideDown(150)
-    # $modalCover.show()
     @loadEdit()
diff --git a/cms/static/sass/_base.scss b/cms/static/sass/_base.scss
index eefe1c61ce..f68702c55b 100644
--- a/cms/static/sass/_base.scss
+++ b/cms/static/sass/_base.scss
@@ -6,7 +6,7 @@
 
 body {
     min-width: 980px;
-    background: #eaecf3;
+    background: rgb(240, 241, 245);
     font-size: 16px;
     line-height: 1.6;
     color: $baseFontColor;
@@ -57,12 +57,6 @@ h1 {
     }
 }
 
-.window {
-    background: #fff;
-    border-radius: 3px;
-    @include box-shadow(0 1px 1px rgba(0,0,0,0.2), 0 0 0 1px rgba(0, 0, 0, 0.1));
-}
-
 .sidebar {
     float: right;
     width: 28%;
@@ -86,7 +80,7 @@ input[type="email"],
 input[type="password"] {
     padding: 6px 8px 8px;
     @include box-sizing(border-box);
-    border: 1px solid #b0b6c2;
+    border: 1px solid $mediumGrey;
     border-radius: 2px;
     @include linear-gradient(top, rgba(255, 255, 255, 0), rgba(255, 255, 255, .3));
     background-color: #edf1f5;
@@ -140,7 +134,7 @@ code {
     min-height: 80px;
     padding: 10px;
     @include box-sizing(border-box);
-    border: 1px solid #b0b6c2;
+    border: 1px solid $mediumGrey;
     @include linear-gradient(top, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.3));
     background-color:  #edf1f5;
     @include box-shadow(0 1px 2px rgba(0, 0, 0, 0.1) inset);
@@ -190,6 +184,10 @@ code {
 
 .window {
     margin-bottom: 20px;
+    border: 1px solid $mediumGrey;
+    border-radius: 3px;
+    background: #fff;
+    @include box-shadow(0 1px 1px rgba(0, 0, 0, 0.1));
 
     .window-contents {
         padding: 20px;
@@ -197,13 +195,13 @@ code {
 
     h4 {
         padding: 6px 14px;
-        border-bottom: 1px solid #cbd1db;
+        border-bottom: 1px solid $mediumGrey;
         border-radius: 3px 3px 0 0;
-        @include linear-gradient(top, rgba(255, 255, 255, .3), rgba(255, 255, 255, 0) 70%);
-        background-color: #edf1f5;
-        @include box-shadow(0 1px 0 rgba(255, 255, 255, .7) inset);
+        @include linear-gradient(top, rgba(255, 255, 255, .4), rgba(255, 255, 255, 0));
+        background-color: $lightBluishGrey;
+        @include box-shadow(0 1px 0 rgba(255, 255, 255, 0.2) inset);
         font-size: 14px;
-        font-weight: 600;
+        text-shadow: 0 1px 0 rgba(255, 255, 255, 0.3);
     }
 
     label {
diff --git a/cms/static/sass/_cms_mixins.scss b/cms/static/sass/_cms_mixins.scss
index 50b62b7d57..361aa6929c 100644
--- a/cms/static/sass/_cms_mixins.scss
+++ b/cms/static/sass/_cms_mixins.scss
@@ -49,16 +49,17 @@
 
 @mixin white-button {
   @include button;
-  border: 1px solid $darkGrey;
+  border: 1px solid $mediumGrey;
   border-radius: 3px;
   @include linear-gradient(top, rgba(255, 255, 255, 0.6), rgba(255, 255, 255, 0));
   background-color: #dfe5eb;
   @include box-shadow(0 1px 0 rgba(255, 255, 255, .3) inset);
-  color: #778192;
+  color: rgb(92, 103, 122);
+  text-shadow: 0 1px 0 rgba(255, 255, 255, .5);
 
   &:hover {
-    background-color: #f2f6f9;
-    color: #778192;
+    background-color: rgb(222, 236, 247);
+    color: rgb(92, 103, 122);
   }
 }
 
@@ -88,6 +89,7 @@
 
 	&:hover {
 		background-color: #d9e3ee;
+		color: #6d788b;
 	}
 }
 
@@ -130,7 +132,7 @@
 @mixin edit-box {
 	padding: 15px 20px;
 	border-radius: 3px;
-	background-color: $lightBluishGrey;
+	background-color: $lightBluishGrey2;
 	color: #3c3c3c;
 	@include box-shadow(0 1px 0 rgba(255, 255, 255, .2) inset);
 
@@ -171,8 +173,8 @@
 }
 
 @mixin tree-view {
-	border: 1px solid #ced2db;
-	background: #edf1f5;
+	border: 1px solid $mediumGrey;
+	background: $lightGrey;
 
 	.branch {
 		margin-bottom: 10px;
@@ -232,7 +234,11 @@
 	}
 
 	a {
-		color: #2c2e33;
+		color: $baseFontColor;
+
+		&.new-unit-item {
+			color: #6d788b;
+		}
 	}
 
 	ol {
diff --git a/cms/static/sass/_courseware.scss b/cms/static/sass/_courseware.scss
index 2f6745333d..05a6250371 100644
--- a/cms/static/sass/_courseware.scss
+++ b/cms/static/sass/_courseware.scss
@@ -9,9 +9,10 @@ input.courseware-unit-search-input {
 	position: relative;
 	background: #fff;
 	border-radius: 3px;
+	border: 1px solid $mediumGrey;
 	margin-top: 15px;
 	padding-bottom: 12px;
-	@include box-shadow(0 1px 1px rgba(0,0,0,0.2), 0 0 0 1px rgba(0, 0, 0, 0.1));
+	@include box-shadow(0 1px 1px rgba(0, 0, 0, 0.1));
 
 	&:first-child {
 		margin-top: 0;
diff --git a/cms/static/sass/_static-pages.scss b/cms/static/sass/_static-pages.scss
index 9a2d1303ec..78d6ba66d7 100644
--- a/cms/static/sass/_static-pages.scss
+++ b/cms/static/sass/_static-pages.scss
@@ -54,7 +54,7 @@
       background: url(../img/drag-handles.png) center no-repeat #fff;
 
       &:hover {
-        background: url(../img/drag-handles.png) center no-repeat $lightGrey;
+        background: url(../img/drag-handles.png) center no-repeat #fff;
       }
     }
 
diff --git a/cms/static/sass/_unit.scss b/cms/static/sass/_unit.scss
index 978d53e1b3..3b166e2048 100644
--- a/cms/static/sass/_unit.scss
+++ b/cms/static/sass/_unit.scss
@@ -141,7 +141,7 @@
   }
 
   .component {
-    border: 1px solid #d1ddec;
+    border: 1px solid $lightBluishGrey2;
     border-radius: 3px;
     background: #fff;
     @include transition(none);
@@ -156,6 +156,7 @@
     }
 
     &.editing {
+      border: 1px solid $lightBluishGrey2;
 
       .drag-handle,
       .component-actions {
@@ -171,11 +172,6 @@
       position: absolute;
       top: 7px;
       right: 9px;
-      @include transition(opacity .15s);
-
-      a {
-        color: $darkGrey;
-      }
     }
 
     .drag-handle {
@@ -187,10 +183,10 @@
       width: 15px;
       height: 100%;
       border-radius: 0 3px 3px 0;
-      border: 1px solid #d1ddec;
-      background: url(../img/white-drag-handles.png) center no-repeat #d1ddec;
+      border: 1px solid $lightBluishGrey2;
+      background: url(../img/white-drag-handles.png) center no-repeat $lightBluishGrey2;
       cursor: move;
-      @include transition(all .15s);
+      @include transition(none);
     }
   }
 
@@ -202,6 +198,7 @@
     @include edit-box;
     display: none;
     padding: 20px;
+    border-radius: 2px 2px 0 0;
     @include box-shadow(none);
 
     .metadata_edit {
diff --git a/cms/static/sass/_variables.scss b/cms/static/sass/_variables.scss
index 985d87ca70..f5bd90b4df 100644
--- a/cms/static/sass/_variables.scss
+++ b/cms/static/sass/_variables.scss
@@ -17,7 +17,7 @@ $baseFontColor: #3c3c3c;
 $blue: #5597dd;
 $orange: #edbd3c;
 $lightGrey: #edf1f5;
-$mediumGrey: #ced2db;
+$mediumGrey: #b0b6c2;
 $darkGrey: #8891a1;
 $extraDarkGrey: #3d4043;
 $paleYellow: #fffcf1;
@@ -25,4 +25,5 @@ $green: rgb(37, 184, 90);
 $brightGreen: rgb(22, 202, 87);
 $disabledGreen: rgb(124, 206, 153);
 $darkGreen: rgb(52, 133, 76);
-$lightBluishGrey: rgb(197, 207, 223);
\ No newline at end of file
+$lightBluishGrey: rgb(197, 207, 223);
+$lightBluishGrey2: rgb(213, 220, 228);
\ No newline at end of file

From 22a61cdfb77f4f3f0412432229cac62bbda07dfa Mon Sep 17 00:00:00 2001
From: Tom Giannattasio <tom@mitx.mit.edu>
Date: Thu, 6 Dec 2012 17:00:16 -0500
Subject: [PATCH 10/43] pulled out component types from behind add component
 button

---
 cms/static/sass/_unit.scss | 30 ++++++++++++++++++++----------
 cms/templates/unit.html    |  8 ++------
 2 files changed, 22 insertions(+), 16 deletions(-)

diff --git a/cms/static/sass/_unit.scss b/cms/static/sass/_unit.scss
index 3b166e2048..83c6906cd0 100644
--- a/cms/static/sass/_unit.scss
+++ b/cms/static/sass/_unit.scss
@@ -56,14 +56,10 @@
       margin: 20px 40px;
 
       &.new-component-item {
-        padding: 0;
+        padding: 20px;
         border: none;
-        border-radius: 0;
-
-        &.adding {
-          background-color: $blue;
-          border-color: #437fbf;
-        }
+        border-radius: 3px;
+        background: $lightGrey;
 
         .new-component-button {
           display: block;
@@ -87,14 +83,20 @@
         .new-component-type, .new-component-template {
           @include clearfix;
 
+          li {
+            display: inline-block;
+          }
+
           a {
             position: relative;
-            float: left;
+            display: inline-block;
             width: 100px;
             height: 100px;
             margin-right: 10px;
             margin-bottom: 10px;
             border-radius: 8px;
+            border: 1px solid $darkGreen;
+            background: $green;
             font-size: 13px;
             line-height: 14px;
             color: #fff;
@@ -103,7 +105,7 @@
             @include transition(background-color .15s);
 
             &:hover {
-              background-color: rgba(255, 255, 255, .2);
+              background: $brightGreen;
             }
 
             .name {
@@ -123,7 +125,15 @@
           }
         }
 
-        .new-component,
+        .new-component {          
+          text-align: center;
+
+          h5 {
+            color: $green;
+          }
+          
+        }
+        
         .new-component-templates {
           display: none;
           position: absolute;
diff --git a/cms/templates/unit.html b/cms/templates/unit.html
index f2601c7c7e..523d956f06 100644
--- a/cms/templates/unit.html
+++ b/cms/templates/unit.html
@@ -32,12 +32,9 @@
             % for id in components:
             <li class="component" data-id="${id}"/>
             % endfor
-            <li class="new-component-item">
-              <a href="#" class="new-component-button new-button big">
-                <span class="plus-icon"></span>New Component
-              </a>
+            <li class="new-component-item adding">              
               <div class="new-component">
-                <h5>Select Component Type</h5>
+                <h5>Add New Component</h5>
                 <ul class="new-component-type">
                   % for type in sorted(component_templates.keys()):
                   <li>
@@ -48,7 +45,6 @@
                   </li>
                   % endfor
                 </ul>
-                <a href="#" class="cancel-button">Cancel</a>
               </div>
               % for type, templates in sorted(component_templates.items()):
               <div class="new-component-templates new-component-${type}">

From 75b413b5ac0164389a661858b2a74964d779ad46 Mon Sep 17 00:00:00 2001
From: Tom Giannattasio <tom@mitx.mit.edu>
Date: Fri, 7 Dec 2012 09:35:34 -0500
Subject: [PATCH 11/43] reworked add component steps

---
 cms/static/coffee/src/views/unit.coffee | 17 ++------
 cms/static/sass/_unit.scss              | 58 +++++++++++++++++--------
 2 files changed, 42 insertions(+), 33 deletions(-)

diff --git a/cms/static/coffee/src/views/unit.coffee b/cms/static/coffee/src/views/unit.coffee
index a250925bf9..fe8f928746 100644
--- a/cms/static/coffee/src/views/unit.coffee
+++ b/cms/static/coffee/src/views/unit.coffee
@@ -4,7 +4,6 @@ class CMS.Views.UnitEdit extends Backbone.View
     'click .new-component .cancel-button': 'closeNewComponent'
     'click .new-component-templates .new-component-template a': 'saveNewComponent'
     'click .new-component-templates .cancel-button': 'closeNewComponent'
-    'click .new-component-button': 'showNewComponentForm'
     'click .delete-draft': 'deleteDraft'
     'click .create-draft': 'createDraft'
     'click .publish-draft': 'publishDraft'
@@ -54,30 +53,20 @@ class CMS.Views.UnitEdit extends Backbone.View
         )
     )
 
-  # New component creation
-  showNewComponentForm: (event) =>
-    event.preventDefault()
-    @$newComponentItem.addClass('adding')
-    $(event.target).fadeOut(150)
-    @$newComponentItem.css('height', @$newComponentTypePicker.outerHeight())
-    @$newComponentTypePicker.slideDown(250)
-
   showComponentTemplates: (event) =>
     event.preventDefault()
 
     type = $(event.currentTarget).data('type')
-    @$newComponentTypePicker.fadeOut(250)
-    @$(".new-component-#{type}").fadeIn(250)
+    @$newComponentTypePicker.slideUp(250)
+    @$(".new-component-#{type}").slideDown(250)
 
   closeNewComponent: (event) =>
     event.preventDefault()
 
-    @$newComponentTypePicker.slideUp(250)
+    @$newComponentTypePicker.slideDown(250)
     @$newComponentTemplatePickers.slideUp(250)
-    @$newComponentButton.fadeIn(250)
     @$newComponentItem.removeClass('adding')
     @$newComponentItem.find('.rendered-component').remove()
-    @$newComponentItem.css('height', @$newComponentButton.outerHeight())
 
   saveNewComponent: (event) =>
     event.preventDefault()
diff --git a/cms/static/sass/_unit.scss b/cms/static/sass/_unit.scss
index 83c6906cd0..c7aa86b35c 100644
--- a/cms/static/sass/_unit.scss
+++ b/cms/static/sass/_unit.scss
@@ -80,33 +80,22 @@
           border-radius: 3px 3px 0 0;
         }
 
-        .new-component-type, .new-component-template {
-          @include clearfix;
-
+        .new-component-type {
+          a,
           li {
             display: inline-block;
           }
 
           a {
-            position: relative;
-            display: inline-block;
             width: 100px;
             height: 100px;
             margin-right: 10px;
             margin-bottom: 10px;
             border-radius: 8px;
-            border: 1px solid $darkGreen;
-            background: $green;
             font-size: 13px;
             line-height: 14px;
-            color: #fff;
             text-align: center;
-            @include box-shadow(0 1px 1px rgba(0, 0, 0, .4), 0 1px 0 rgba(255, 255, 255, .4) inset);
-            @include transition(background-color .15s);
-
-            &:hover {
-              background: $brightGreen;
-            }
+            @include box-shadow(0 1px 1px rgba(0, 0, 0, .2), 0 1px 0 rgba(255, 255, 255, .4) inset);
 
             .name {
               position: absolute;
@@ -119,9 +108,43 @@
           }
         }
 
+        .new-component-type,
         .new-component-template {
+          @include clearfix;
+
           a {
-            height: 60px;
+            position: relative;            
+            border: 1px solid $darkGreen;
+            background: $green;
+            color: #fff;            
+            @include transition(background-color .15s);
+
+            &:hover {
+              background: $brightGreen;
+            }
+          }
+        }
+
+        .new-component-template {
+          margin-bottom: 20px;
+
+          li:first-child {
+            a {
+              border-radius: 3px 3px 0 0;
+            }
+          }
+
+          li:last-child {
+            a {
+              border-radius: 0 0 3px 3px;
+            }
+          }
+
+          a {
+            display: block;
+            padding: 7px 20px;
+            border-bottom: none;
+            font-weight: 300;
           }
         }
 
@@ -136,14 +159,11 @@
         
         .new-component-templates {
           display: none;
-          position: absolute;
-          width: 100%;
           padding: 20px;
           @include clearfix;
 
           .cancel-button {
-            @include blue-button;
-            border-color: #30649c;
+            @include white-button;
           }
         }
       }

From c8b4e8852f25d350d40c939cfc5009db60dd51b2 Mon Sep 17 00:00:00 2001
From: Tom Giannattasio <tom@mitx.mit.edu>
Date: Fri, 7 Dec 2012 14:31:48 -0500
Subject: [PATCH 12/43] added modal cover for editors

---
 cms/static/coffee/src/views/module_edit.coffee |   3 +++
 cms/static/img/upload-icon.png                 | Bin 0 -> 1122 bytes
 cms/static/sass/_assets.scss                   |   8 --------
 cms/static/sass/_graphics.scss                 |   8 ++++++++
 cms/static/sass/_header.scss                   |   1 -
 cms/static/sass/_static-pages.scss             |   3 +++
 cms/static/sass/_unit.scss                     |   1 +
 cms/static/sass/_users.scss                    |  10 +++-------
 cms/templates/asset_index.html                 |   7 ++++---
 cms/templates/edit-tabs.html                   |   8 ++++----
 cms/templates/manage_users.html                |  13 +++++++------
 11 files changed, 33 insertions(+), 29 deletions(-)
 create mode 100644 cms/static/img/upload-icon.png

diff --git a/cms/static/coffee/src/views/module_edit.coffee b/cms/static/coffee/src/views/module_edit.coffee
index ad875294a1..0617b01bb4 100644
--- a/cms/static/coffee/src/views/module_edit.coffee
+++ b/cms/static/coffee/src/views/module_edit.coffee
@@ -56,6 +56,7 @@ class CMS.Views.ModuleEdit extends Backbone.View
     event.preventDefault()
     data = @module.save()
     data.metadata = @metadata()
+    $modalCover.hide()
     @model.save(data).done( =>
     #   # showToastMessage("Your changes have been saved.", null, 3)
       @module = null
@@ -69,9 +70,11 @@ class CMS.Views.ModuleEdit extends Backbone.View
     event.preventDefault()
     @$el.removeClass('editing')
     @$component_editor().slideUp(150)
+    $modalCover.hide()
 
   clickEditButton: (event) ->
     event.preventDefault()
     @$el.addClass('editing')
+    $modalCover.show()
     @$component_editor().slideDown(150)
     @loadEdit()
diff --git a/cms/static/img/upload-icon.png b/cms/static/img/upload-icon.png
new file mode 100644
index 0000000000000000000000000000000000000000..0a78627f8787dd2b4a3f706e6a0039aff5572199
GIT binary patch
literal 1122
zcmaJ=TSyd97#>^Gl(x2lz@j>g5eDwgW!I@0cH6a`H8&cO-K7kIoSix9pmS;F*p5PJ
zcY6tX47$8@p`b8&DT<=3hp@1umwJej2!fz`2sVoBjJno?HXP>s=kR~u|NWP9vbANK
zzj{?QK@k3QvzWpAO3z+Yf&bSpomcQygHmlMYj&W5Y(t_^HS-Xpb-5E}pse=odkUij
z;ajie+EAOcLr_dTBzry~SGO>lAfj>Cl9g_VKpu8#MvVM&_W=nsHAe1gkZ8$D!Y-}3
z--g-#mYmYxt?()t-vXkpfC+SnWZ>#Oh9kH!a*9{Lws%dDV9Et`$H-|>ZBi>pnl=Ot
zp>R;483u4%h>0|C98(Winqes#FD}SLga%GvH-VXt#L;ZEL&%6tGqLa~Ms^`&2^3W*
z6heh?$h12thUa;YgJpx*Bk1%QNOpsUQ(IyXp`+NEg*4Lu9;2K$dr^$UN~crMtyx;b
znJE)480E?q#e`@trIMp0{ohsBXT2Sifq(VRN$lkMEJ$UbWA@q#Zd^yL7s?WnHk6TR
z=S;JwRK?aV6PZqzX@O*x19g(DXoh#OaS9<xLfUYUY$z}-#z@Q&(lk}zQ*@XS8);S)
zaotlaAKuERQk)o$L>Sxwx`Y)?rB{arDq&TO71_w<#xO&(DW+*otTzn0g(Hj5*7ifS
z$u@N`m9(JEtA$U^uVosm&Y@*G558$$EQQ5TUTgnpb?FMvk7v#fE<VhTJ~Z&W+jy`)
z?0lWTkK$EYY|OcD^2N!?xUa0o|9JFJu_`cGK5?b>esIfy;$pRI;_BqLBcBq_wqJXg
z{k@{{^6C8W_kr=j;LQrE_T@Vz(Q|UNeIYniIS~K{e_V*ttB1~<_8VmraW@jJ$QQst
z@#y;}^pTOOy7HQ93wj6HWyj;kYVMtDPS!NjXV+c)T3>bi(eU!MBLjou+zOv>WOv1m
zujNB)4i%U9_FGGb)(jSzm3N*eey#5KSs8u%=wp7*J3cT<Ua1a(x7CmLrX$65fq@en
h#ug^({aIh2ogl|<eSXn*`?dG#)2SBm#@6=3e*l5Ra9aQX

literal 0
HcmV?d00001

diff --git a/cms/static/sass/_assets.scss b/cms/static/sass/_assets.scss
index 29c3d4000d..23d9ea4d9a 100644
--- a/cms/static/sass/_assets.scss
+++ b/cms/static/sass/_assets.scss
@@ -5,14 +5,6 @@
     background-color: #fff;
   }
 
-  .upload-button {
-    @include blue-button;
-    float: left;
-    margin-right: 20px;
-    padding: 8px 30px 10px;
-    font-size: 12px;
-  }
-
   .asset-library {
     @include clearfix;
 
diff --git a/cms/static/sass/_graphics.scss b/cms/static/sass/_graphics.scss
index 80599f7bc4..4ed22c570d 100644
--- a/cms/static/sass/_graphics.scss
+++ b/cms/static/sass/_graphics.scss
@@ -34,6 +34,14 @@
 	background: url(../img/video-icon.png) no-repeat;
 }
 
+.upload-icon {
+	display: inline-block;
+	width: 22px;
+	height: 13px;
+	margin-right: 5px;
+	background: url(../img/upload-icon.png) no-repeat;
+}
+
 .list-icon {
 	display: inline-block;
 	width: 14px;
diff --git a/cms/static/sass/_header.scss b/cms/static/sass/_header.scss
index 8402fa54be..76add36477 100644
--- a/cms/static/sass/_header.scss
+++ b/cms/static/sass/_header.scss
@@ -5,7 +5,6 @@ body.no-header {
 }
 
 @mixin active {
-	color: $blue;
 	@include linear-gradient(top, rgba(255, 255, 255, .4), rgba(255, 255, 255, 0));
 	background-color: rgba(255, 255, 255, .3);
 	@include box-shadow(0 -1px 0 rgba(0, 0, 0, .2) inset, 0 1px 0 #fff inset);
diff --git a/cms/static/sass/_static-pages.scss b/cms/static/sass/_static-pages.scss
index 78d6ba66d7..9f39d2ad53 100644
--- a/cms/static/sass/_static-pages.scss
+++ b/cms/static/sass/_static-pages.scss
@@ -65,6 +65,9 @@
   }
 
   .component.editing {
+    border-left: 1px solid $mediumGrey;
+    border-right: 1px solid $mediumGrey;
+
     .xmodule_display {
       display: none;
     }
diff --git a/cms/static/sass/_unit.scss b/cms/static/sass/_unit.scss
index c7aa86b35c..8f4ec33b7f 100644
--- a/cms/static/sass/_unit.scss
+++ b/cms/static/sass/_unit.scss
@@ -187,6 +187,7 @@
 
     &.editing {
       border: 1px solid $lightBluishGrey2;
+      z-index: 9999;
 
       .drag-handle,
       .component-actions {
diff --git a/cms/static/sass/_users.scss b/cms/static/sass/_users.scss
index 4daefa55cc..eb48bcd219 100644
--- a/cms/static/sass/_users.scss
+++ b/cms/static/sass/_users.scss
@@ -4,14 +4,10 @@
     padding: 30px 40px;
   }
 
-  .new-user-button {
-    margin-bottom: 15px;
-  }
-
   .new-user-form {
     display: none;
     padding: 15px 20px;
-    background: $mediumGrey;
+    background-color: $lightBluishGrey2;
 
     #result {
       display: none;
@@ -41,12 +37,12 @@
 
     .add-button {
       @include blue-button;
-      padding: 6px 20px 8px;
+      padding: 5px 20px 9px;
     }
 
     .cancel-button {
       @include white-button;
-      padding: 6px 20px 8px;
+      padding: 5px 20px 9px;
     }
   }
 
diff --git a/cms/templates/asset_index.html b/cms/templates/asset_index.html
index 900ef3b697..4f60b168df 100644
--- a/cms/templates/asset_index.html
+++ b/cms/templates/asset_index.html
@@ -35,10 +35,11 @@
 
   <div class="main-wrapper">
     <div class="inner-wrapper">
-      <h1>Asset Library</h1>
       <div class="page-actions">
-        <a href="#" class="upload-button">Upload New File</a>
-	      <input type="text" class="asset-search-input search wip-box" placeholder="search assets" style="display:none"/>
+        <a href="#" class="upload-button new-button">
+          <span class="upload-icon"></span>Upload New Asset
+        </a>
+        <input type="text" class="asset-search-input search wip-box" placeholder="search assets" style="display:none"/>
       </div>
       <article class="asset-library">
         <table>
diff --git a/cms/templates/edit-tabs.html b/cms/templates/edit-tabs.html
index 637329f356..a48c683db1 100644
--- a/cms/templates/edit-tabs.html
+++ b/cms/templates/edit-tabs.html
@@ -18,10 +18,10 @@
 <div class="main-wrapper">
   <div class="inner-wrapper">
     <div class="page-actions">
-        <a href="#" class="new-button new-tab">
-          <span class="plus-icon white"></span>New Tab
-        </a>
-      </div>
+      <a href="#" class="new-button new-tab">
+        <span class="plus-icon white"></span>New Tab
+      </a>
+    </div>
     <article class="unit-body">
       <div class="details">
         <p>Here you can add and manage additional pages for your course. These pages will be added to the primary navigation menu alongside Courseware, Course Info, Discussion, etc.</p>
diff --git a/cms/templates/manage_users.html b/cms/templates/manage_users.html
index 6f33b67d41..d8266f0622 100644
--- a/cms/templates/manage_users.html
+++ b/cms/templates/manage_users.html
@@ -5,17 +5,18 @@
 <%block name="content">
 <div class="main-wrapper">
   <div class="inner-wrapper">
-    <h1>Users</h1>
-
-    <article class="user-overview">
-      <div class="details">
-        <p>The following list of users have been designated as course staff. This means that these users will have permissions to modify course content. You may add additional course staff below, if you are the course instructor. Please note that they must have already registered and verified their account.</p>
-      </div>
+    <div class="page-actions">
       %if allow_actions:
       <a href="#" class="new-button new-user-button">
         <span class="plus-icon white"></span>New User
       </a>
       %endif
+    </div>
+
+    <article class="user-overview">
+      <div class="details">
+        <p>The following list of users have been designated as course staff. This means that these users will have permissions to modify course content. You may add additional course staff below, if you are the course instructor. Please note that they must have already registered and verified their account.</p>
+      </div>      
       %if allow_actions:
       <form class="new-user-form">
         <div id="result"></div>

From 299b28007b932ff1998531ab1c1136186570cee5 Mon Sep 17 00:00:00 2001
From: Tom Giannattasio <tom@mitx.mit.edu>
Date: Fri, 7 Dec 2012 15:37:22 -0500
Subject: [PATCH 13/43] clean up of users page

---
 cms/static/coffee/src/views/tabs.coffee |  4 ++++
 cms/static/sass/_base.scss              |  2 +-
 cms/static/sass/_static-pages.scss      |  5 +++++
 cms/static/sass/_users.scss             | 22 ++++++++++++----------
 cms/static/sass/_variables.scss         |  1 +
 cms/templates/edit-tabs.html            |  2 +-
 cms/templates/import.html               |  1 -
 cms/templates/manage_users.html         |  9 +++++----
 cms/templates/widgets/header.html       |  2 +-
 9 files changed, 30 insertions(+), 18 deletions(-)

diff --git a/cms/static/coffee/src/views/tabs.coffee b/cms/static/coffee/src/views/tabs.coffee
index 34d86a3051..1fbc6ffa7f 100644
--- a/cms/static/coffee/src/views/tabs.coffee
+++ b/cms/static/coffee/src/views/tabs.coffee
@@ -33,6 +33,10 @@ class CMS.Views.TabsEdit extends Backbone.View
     )
 
     $('.new-component-item').before(editor.$el)
+    editor.$el.addClass('new')
+    setTimeout(=>
+      editor.$el.removeClass('new')
+    , 500)
 
     editor.cloneTemplate(
       @model.get('id'),
diff --git a/cms/static/sass/_base.scss b/cms/static/sass/_base.scss
index f68702c55b..eda270e01d 100644
--- a/cms/static/sass/_base.scss
+++ b/cms/static/sass/_base.scss
@@ -196,7 +196,7 @@ code {
     h4 {
         padding: 6px 14px;
         border-bottom: 1px solid $mediumGrey;
-        border-radius: 3px 3px 0 0;
+        border-radius: 2px 2px 0 0;
         @include linear-gradient(top, rgba(255, 255, 255, .4), rgba(255, 255, 255, 0));
         background-color: $lightBluishGrey;
         @include box-shadow(0 1px 0 rgba(255, 255, 255, 0.2) inset);
diff --git a/cms/static/sass/_static-pages.scss b/cms/static/sass/_static-pages.scss
index 9f39d2ad53..e6d8ef0e58 100644
--- a/cms/static/sass/_static-pages.scss
+++ b/cms/static/sass/_static-pages.scss
@@ -73,11 +73,16 @@
     }
   }
 
+  .new .xmodule_display {
+    background: $yellow;
+  }
+
   .xmodule_display {
     padding: 20px 20px 22px;
     font-size: 24px;
     font-weight: 300;
     background: #fff;
+    @include transition(background-color 3s);
   }
 
   .static-page-item {
diff --git a/cms/static/sass/_users.scss b/cms/static/sass/_users.scss
index eb48bcd219..e107bdbb6d 100644
--- a/cms/static/sass/_users.scss
+++ b/cms/static/sass/_users.scss
@@ -1,9 +1,4 @@
 .users {
-  .user-overview {
-    @extend .window;
-    padding: 30px 40px;
-  }
-
   .new-user-form {
     display: none;
     padding: 15px 20px;
@@ -48,11 +43,11 @@
 
   .user-list {
     border: 1px solid $mediumGrey;
-    background: $lightGrey;
+    background: #fff;
 
     li {
       position: relative;
-      padding: 10px 20px;
+      padding: 20px;
       border-bottom: 1px solid $mediumGrey;
 
       &:last-child {
@@ -64,12 +59,19 @@
       }
 
       .user-name {
-        width: 30%;
-        font-weight: 700;
+        margin-right: 10px;
+        font-size: 24px;
+        font-weight: 300;
+      }
+
+      .user-email {
+        font-size: 14px;
+        font-style: italic;
+        color: $mediumGrey;
       }
 
       .item-actions {
-        top: 9px;
+        top: 24px;
       }
     }
   }
diff --git a/cms/static/sass/_variables.scss b/cms/static/sass/_variables.scss
index f5bd90b4df..6d7f8d8d33 100644
--- a/cms/static/sass/_variables.scss
+++ b/cms/static/sass/_variables.scss
@@ -21,6 +21,7 @@ $mediumGrey: #b0b6c2;
 $darkGrey: #8891a1;
 $extraDarkGrey: #3d4043;
 $paleYellow: #fffcf1;
+$yellow: rgb(255, 254, 223);
 $green: rgb(37, 184, 90);
 $brightGreen: rgb(22, 202, 87);
 $disabledGreen: rgb(124, 206, 153);
diff --git a/cms/templates/edit-tabs.html b/cms/templates/edit-tabs.html
index a48c683db1..16bca8568b 100644
--- a/cms/templates/edit-tabs.html
+++ b/cms/templates/edit-tabs.html
@@ -19,7 +19,7 @@
   <div class="inner-wrapper">
     <div class="page-actions">
       <a href="#" class="new-button new-tab">
-        <span class="plus-icon white"></span>New Tab
+        <span class="plus-icon white"></span>New Page
       </a>
     </div>
     <article class="unit-body">
diff --git a/cms/templates/import.html b/cms/templates/import.html
index 18d9a1604d..e4f8019714 100644
--- a/cms/templates/import.html
+++ b/cms/templates/import.html
@@ -8,7 +8,6 @@
 <%block name="content">
 <div class="main-wrapper">
   <div class="inner-wrapper">
-    <h1>Import</h1>
     <article class="import-overview">
       <div class="description">
         <h2>Please <a href="https://edge.edx.org/courses/edX/edx101/edX_Studio_Reference/about" target="_blank">read the documentation</a> before attempting an import!</h2>
diff --git a/cms/templates/manage_users.html b/cms/templates/manage_users.html
index d8266f0622..36930f5386 100644
--- a/cms/templates/manage_users.html
+++ b/cms/templates/manage_users.html
@@ -13,10 +13,11 @@
       %endif
     </div>
 
-    <article class="user-overview">
-      <div class="details">
-        <p>The following list of users have been designated as course staff. This means that these users will have permissions to modify course content. You may add additional course staff below, if you are the course instructor. Please note that they must have already registered and verified their account.</p>
-      </div>      
+    <div class="details">
+      <p>The following list of users have been designated as course staff. This means that these users will have permissions to modify course content. You may add additional course staff below, if you are the course instructor. Please note that they must have already registered and verified their account.</p>
+    </div>
+
+    <article class="user-overview">           
       %if allow_actions:
       <form class="new-user-form">
         <div id="result"></div>
diff --git a/cms/templates/widgets/header.html b/cms/templates/widgets/header.html
index 29b68165f7..a585a78c91 100644
--- a/cms/templates/widgets/header.html
+++ b/cms/templates/widgets/header.html
@@ -27,7 +27,7 @@
     <% ctx_loc = context_course.location %>
     <ul class="class-nav inner-wrapper">
       <li><a href="${reverse('course_index', kwargs=dict(org=ctx_loc.org, course=ctx_loc.course, name=ctx_loc.name))}" id='courseware-tab'>Courseware</a></li>
-      <li><a href="${reverse('edit_tabs', kwargs=dict(org=ctx_loc.org, course=ctx_loc.course, coursename=ctx_loc.name))}" id='pages-tab'>Tabs</a></li>
+      <li><a href="${reverse('edit_tabs', kwargs=dict(org=ctx_loc.org, course=ctx_loc.course, coursename=ctx_loc.name))}" id='pages-tab'>Pages</a></li>
       <li><a href="${reverse('asset_index', kwargs=dict(org=ctx_loc.org, course=ctx_loc.course, name=ctx_loc.name))}" id='assets-tab'>Assets</a></li>
       <li><a href="${reverse('manage_users', kwargs=dict(location=ctx_loc))}" id='users-tab'>Users</a></li>
       <li><a href="${reverse('import_course', kwargs=dict(org=ctx_loc.org, course=ctx_loc.course, name=ctx_loc.name))}" id='import-tab'>Import</a></li>

From caf143514c02e6d9af69e31e692d644cb15dd61f Mon Sep 17 00:00:00 2001
From: Brian Talbot <btalbot@edx.org>
Date: Wed, 12 Dec 2012 14:11:30 -0500
Subject: [PATCH 14/43] debugged tooltip latency/vanishing issue

---
 common/static/coffee/src/discussion/tooltip_manager.coffee | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/common/static/coffee/src/discussion/tooltip_manager.coffee b/common/static/coffee/src/discussion/tooltip_manager.coffee
index 695ad52e3d..c5fa648532 100644
--- a/common/static/coffee/src/discussion/tooltip_manager.coffee
+++ b/common/static/coffee/src/discussion/tooltip_manager.coffee
@@ -12,10 +12,10 @@ class @TooltipManager
       'click': @hideTooltip
 
   showTooltip: (e) =>
-    tooltipText = $(e.target).attr('data-tooltip')
+    $target = $(e.target).closest('[data-tooltip]')
+    tooltipText = $target.attr('data-tooltip')
     @$tooltip.html(tooltipText)
     @$body.append(@$tooltip)
-    $(e.target).children().css('pointer-events', 'none')
 
     tooltipCoords =
       x: e.pageX - (@$tooltip.outerWidth() / 2)
@@ -26,8 +26,8 @@ class @TooltipManager
     'top': tooltipCoords.y
 
     @tooltipTimer = setTimeout ()=>
-      @$tooltip.show().css('opacity', 1)
 
+      @$tooltip.show().css('opacity', 1)
       @tooltipTimer = setTimeout ()=>
         @hideTooltip()
       , 3000

From 128a402b7fee02d08a4614a48738ce5489619dd8 Mon Sep 17 00:00:00 2001
From: Tom Giannattasio <tom@mitx.mit.edu>
Date: Mon, 3 Dec 2012 16:15:00 -0500
Subject: [PATCH 15/43] fixed long header bug

---
 cms/static/sass/_header.scss | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/cms/static/sass/_header.scss b/cms/static/sass/_header.scss
index e80c7aa3b1..f709f36a44 100644
--- a/cms/static/sass/_header.scss
+++ b/cms/static/sass/_header.scss
@@ -43,7 +43,7 @@ body.no-header {
 	}
 
 	.left {
-		width: 750px;
+		// width: 750px;
 	}
 
 	.class-name {

From 131f4751564c8885d248f6918a1abc02debfdaef Mon Sep 17 00:00:00 2001
From: Tom Giannattasio <tom@mitx.mit.edu>
Date: Mon, 3 Dec 2012 16:29:27 -0500
Subject: [PATCH 16/43] headers still funky, absolutely positioned to avoid
 bugs for now; removed public tag and grey style

---
 cms/static/sass/_cms_mixins.scss | 5 -----
 cms/static/sass/_header.scss     | 4 +++-
 2 files changed, 3 insertions(+), 6 deletions(-)

diff --git a/cms/static/sass/_cms_mixins.scss b/cms/static/sass/_cms_mixins.scss
index b4db2f096e..637f4b48f9 100644
--- a/cms/static/sass/_cms_mixins.scss
+++ b/cms/static/sass/_cms_mixins.scss
@@ -200,15 +200,10 @@
 			content: "- draft";
 		}
 
-		.public-item:after {
-			content: "- public";
-		}
-
 		.private-item:after {
 			content: "- private";
 		}
 
-		.public-item,
 		.private-item {
 			color: #a4aab7;
 		}
diff --git a/cms/static/sass/_header.scss b/cms/static/sass/_header.scss
index f709f36a44..cb9a7ed121 100644
--- a/cms/static/sass/_header.scss
+++ b/cms/static/sass/_header.scss
@@ -43,7 +43,9 @@ body.no-header {
 	}
 
 	.left {
-		// width: 750px;
+		position: absolute;
+		left: 0;
+		width: 100%;
 	}
 
 	.class-name {

From 74ce3d225f6c0919b3d7a06666c3cda53da34706 Mon Sep 17 00:00:00 2001
From: Tom Giannattasio <tom@mitx.mit.edu>
Date: Tue, 4 Dec 2012 11:00:28 -0500
Subject: [PATCH 17/43] removed new course button on click to prevent multiple
 instantiations

---
 cms/static/js/base.js            | 2 ++
 cms/static/sass/_base.scss       | 8 +++++---
 cms/static/sass/_courseware.scss | 5 +++++
 cms/templates/overview.html      | 2 +-
 4 files changed, 13 insertions(+), 4 deletions(-)

diff --git a/cms/static/js/base.js b/cms/static/js/base.js
index eefc8c3c37..9d4d4ab14f 100644
--- a/cms/static/js/base.js
+++ b/cms/static/js/base.js
@@ -597,6 +597,8 @@ function hideToastMessage(e) {
 function addNewSection(e, isTemplate) {
     e.preventDefault();
 
+    $(e.target).hide();
+
     var $newSection = $($('#new-section-template').html());
     var $cancelButton = $newSection.find('.new-section-name-cancel');
     $('.new-courseware-section-button').after($newSection);
diff --git a/cms/static/sass/_base.scss b/cms/static/sass/_base.scss
index 22a5a7e128..157f4ef9ce 100644
--- a/cms/static/sass/_base.scss
+++ b/cms/static/sass/_base.scss
@@ -26,7 +26,8 @@ a {
 h1 {
     float: left;
     font-size: 28px;
-    margin: 36px 6px;
+    font-weight: 300;
+    margin: 24px 6px;
 }
 
 .waiting {
@@ -345,8 +346,9 @@ body.show-wip {
 }
 
 .new-button {
-    @include grey-button;
-    padding: 20px 0;
+    @include blue-button;
+    font-size: 13px;
+    padding: 8px 20px 10px;
     text-align: center;
 
     &.big {
diff --git a/cms/static/sass/_courseware.scss b/cms/static/sass/_courseware.scss
index 37c9ca9036..a017bf2701 100644
--- a/cms/static/sass/_courseware.scss
+++ b/cms/static/sass/_courseware.scss
@@ -8,6 +8,7 @@ input.courseware-unit-search-input {
 	
 }
 
+
 .courseware-section {
 	position: relative;
 	background: #fff;
@@ -139,6 +140,10 @@ input.courseware-unit-search-input {
 		}
 	}
 
+	.section-name-form {
+		margin-bottom: 15px;
+	}
+
 	.section-name-edit {
 		input {
 			font-size: 16px;
diff --git a/cms/templates/overview.html b/cms/templates/overview.html
index 4cfcfac2fc..c1f99a2e30 100644
--- a/cms/templates/overview.html
+++ b/cms/templates/overview.html
@@ -101,7 +101,7 @@
       <h1>Courseware</h1>
       <div class="page-actions"></div>
       <article class="courseware-overview" data-course-id="${context_course.location.url()}">
-        <a href="#" class="new-button big new-courseware-section-button"><span class="plus-icon"></span> New Section</a>
+        <a href="#" class="new-button new-courseware-section-button"><span class="plus-icon white"></span> New Section</a>
         % for section in sections:
         <section class="courseware-section branch" data-id="${section.location}">
           <header>

From 197ea332357a209181b40ae9fe389f447a13136b Mon Sep 17 00:00:00 2001
From: Tom Giannattasio <tom@mitx.mit.edu>
Date: Tue, 4 Dec 2012 13:49:07 -0500
Subject: [PATCH 18/43] tweaked body color and window styles; adjusting new
 buttons

---
 cms/static/js/base.js            |  4 ++++
 cms/static/sass/_base.scss       | 15 +++++++++++----
 cms/static/sass/_courseware.scss | 12 +++---------
 cms/static/sass/_dashboard.scss  |  7 -------
 cms/templates/edit-tabs.html     |  7 ++++---
 cms/templates/index.html         |  2 +-
 6 files changed, 23 insertions(+), 24 deletions(-)

diff --git a/cms/static/js/base.js b/cms/static/js/base.js
index 9d4d4ab14f..328c118405 100644
--- a/cms/static/js/base.js
+++ b/cms/static/js/base.js
@@ -638,11 +638,14 @@ function saveNewSection(e) {
 
 function cancelNewSection(e) {
     e.preventDefault();
+    $('.new-courseware-section-button').show();
     $(this).parents('section.new-section').remove();
 }
 
 function addNewCourse(e) {
     e.preventDefault();
+
+    $(e.target).hide();
     var $newCourse = $($('#new-course-template').html());
     var $cancelButton = $newCourse.find('.new-course-cancel');
     $('.new-course-button').after($newCourse);
@@ -683,6 +686,7 @@ function saveNewCourse(e) {
 
 function cancelNewCourse(e) {
     e.preventDefault();
+    $('.new-course-button').show();
     $(this).parents('section.new-course').remove();
 }
 
diff --git a/cms/static/sass/_base.scss b/cms/static/sass/_base.scss
index 157f4ef9ce..9f5059bc72 100644
--- a/cms/static/sass/_base.scss
+++ b/cms/static/sass/_base.scss
@@ -6,13 +6,17 @@
 
 body {
     min-width: 980px;
-    background: #f3f4f5;
-    font-family: 'Open Sans', sans-serif;
+    background: #eaebed;
     font-size: 16px;
     line-height: 1.6;
     color: #3c3c3c;
 }
 
+body,
+input {
+    font-family: 'Open Sans', sans-serif;
+}
+
 a {
     text-decoration: none;
     color: $blue;
@@ -56,9 +60,8 @@ h1 {
 
 .window {
     background: #fff;
-    border: 1px solid $darkGrey;
     border-radius: 3px;
-    @include box-shadow(0 1px 2px rgba(0, 0, 0, .1));
+    @include box-shadow(0 1px 1px rgba(0, 0, 0, .2));
 }
 
 .sidebar {
@@ -184,6 +187,10 @@ code {
     .details {
       margin-bottom: 30px;
       font-size: 14px;
+
+      .new-button {
+        margin-right: 30px;
+      }
     }
 
     h4 {
diff --git a/cms/static/sass/_courseware.scss b/cms/static/sass/_courseware.scss
index a017bf2701..dde08b7d20 100644
--- a/cms/static/sass/_courseware.scss
+++ b/cms/static/sass/_courseware.scss
@@ -4,19 +4,13 @@ input.courseware-unit-search-input {
 	background-color: #fff;
 }
 
-.courseware-overview {
-	
-}
-
-
 .courseware-section {
 	position: relative;
 	background: #fff;
-	border: 1px solid $darkGrey;
 	border-radius: 3px;
-	margin: 10px 0;
+	margin: 15px 0;
 	padding-bottom: 12px;
-	@include box-shadow(0 1px 2px rgba(0, 0, 0, .1));
+	@include box-shadow(0 1px 1px rgba(0, 0, 0, .2));
 
 	&:first-child {
 		margin-top: 0;
@@ -205,7 +199,7 @@ input.courseware-unit-search-input {
 .new-section-name-save,
 .new-subsection-name-save {
 	@include blue-button;
-	padding: 6px 20px 8px;
+	padding: 4px 20px 7px;
 	margin: 0 5px;
 	color: #fff !important;
 }
diff --git a/cms/static/sass/_dashboard.scss b/cms/static/sass/_dashboard.scss
index 8763927bdb..0a9e992650 100644
--- a/cms/static/sass/_dashboard.scss
+++ b/cms/static/sass/_dashboard.scss
@@ -36,13 +36,6 @@
 	}
 }
 
-.new-course-button {
-	@include grey-button;
-	display: block;
-	padding: 20px;
-	text-align: center;
-}
-
 .new-course {
 	padding: 15px 25px;
 	margin-top: 20px;
diff --git a/cms/templates/edit-tabs.html b/cms/templates/edit-tabs.html
index 41dee15a7a..bf68b2b72c 100644
--- a/cms/templates/edit-tabs.html
+++ b/cms/templates/edit-tabs.html
@@ -22,6 +22,9 @@
     </div>
     <article class="unit-body window">
       <div class="details">
+        <a href="#" class="new-button new-tab left">
+          <span class="plus-icon white"></span>New Tab
+        </a>
         <p>Here you can add and manage additional pages for your course. These pages will be added to the primary navigation menu alongside Courseware, Course Info, Discussion, etc.</p>
       </div>
       <div class="tab-list">
@@ -31,9 +34,7 @@
           % endfor
                    
           <li class="new-component-item">
-            <a href="#" class="new-button big new-tab">
-              <span class="plus-icon"></span>New Tab
-            </a>
+            
           </li>
         </ol>      
       </div>
diff --git a/cms/templates/index.html b/cms/templates/index.html
index d41bcc23ac..92987babda 100644
--- a/cms/templates/index.html
+++ b/cms/templates/index.html
@@ -37,7 +37,7 @@
 			<h1>My Courses</h1>
 			<article class="my-classes">
 				% if user.is_active:
-				<a href="#" class="new-course-button"><span class="plus-icon"></span> New Course</a>
+				<a href="#" class="new-button new-course-button"><span class="plus-icon white"></span> New Course</a>
 				<ul class="class-list">
 					%for course, url in courses:
 			    <li>

From 8294b05802de7b8e8632c207a96771795b918f75 Mon Sep 17 00:00:00 2001
From: Tom Giannattasio <tom@mitx.mit.edu>
Date: Tue, 4 Dec 2012 14:54:02 -0500
Subject: [PATCH 19/43] style tweaks to tabs and static pages; key bindings for
 new user form

---
 cms/static/sass/_base.scss         |  6 +--
 cms/static/sass/_courseware.scss   |  3 +-
 cms/static/sass/_static-pages.scss |  4 ++
 cms/static/sass/_users.scss        | 19 ++-------
 cms/templates/edit-tabs.html       |  6 ++-
 cms/templates/manage_users.html    | 64 +++++++++++++++++-------------
 6 files changed, 51 insertions(+), 51 deletions(-)

diff --git a/cms/static/sass/_base.scss b/cms/static/sass/_base.scss
index 9f5059bc72..07ff92251d 100644
--- a/cms/static/sass/_base.scss
+++ b/cms/static/sass/_base.scss
@@ -61,7 +61,7 @@ h1 {
 .window {
     background: #fff;
     border-radius: 3px;
-    @include box-shadow(0 1px 1px rgba(0, 0, 0, .2));
+    @include box-shadow(0 1px 1px rgba(0,0,0,0.2), 0 0 0 1px rgba(0, 0, 0, 0.1));
 }
 
 .sidebar {
@@ -187,10 +187,6 @@ code {
     .details {
       margin-bottom: 30px;
       font-size: 14px;
-
-      .new-button {
-        margin-right: 30px;
-      }
     }
 
     h4 {
diff --git a/cms/static/sass/_courseware.scss b/cms/static/sass/_courseware.scss
index dde08b7d20..a48105eb59 100644
--- a/cms/static/sass/_courseware.scss
+++ b/cms/static/sass/_courseware.scss
@@ -1,3 +1,4 @@
+
 input.courseware-unit-search-input {
 	float: left;
 	width: 260px;
@@ -10,7 +11,7 @@ input.courseware-unit-search-input {
 	border-radius: 3px;
 	margin: 15px 0;
 	padding-bottom: 12px;
-	@include box-shadow(0 1px 1px rgba(0, 0, 0, .2));
+	@include box-shadow(0 1px 1px rgba(0,0,0,0.2), 0 0 0 1px rgba(0, 0, 0, 0.1));
 
 	&:first-child {
 		margin-top: 0;
diff --git a/cms/static/sass/_static-pages.scss b/cms/static/sass/_static-pages.scss
index c8ffa0316c..68cb3e1d07 100644
--- a/cms/static/sass/_static-pages.scss
+++ b/cms/static/sass/_static-pages.scss
@@ -6,6 +6,10 @@
     padding: 12px 0;
   }
 
+  .new-tab {
+    margin-bottom: 15px;
+  }
+
   .unit-body {
     padding: 30px 40px;
   }
diff --git a/cms/static/sass/_users.scss b/cms/static/sass/_users.scss
index bca9b4f2fb..4daefa55cc 100644
--- a/cms/static/sass/_users.scss
+++ b/cms/static/sass/_users.scss
@@ -5,21 +5,7 @@
   }
 
   .new-user-button {
-    @include grey-button;
-    margin: 5px 8px;
-    padding: 3px 10px 4px 10px;
-    font-size: 12px;
-
-    .plus-icon {
-      position: relative;
-      top: 1px;
-    }
-  }
-
-  .list-header {
-    @include linear-gradient(top, transparent, rgba(0, 0, 0, .1));
-    background-color: #ced2db;
-    border-radius: 3px 3px 0 0;
+    margin-bottom: 15px;
   }
 
   .new-user-form {
@@ -55,16 +41,17 @@
 
     .add-button {
       @include blue-button;
+      padding: 6px 20px 8px;
     }
 
     .cancel-button {
       @include white-button;
+      padding: 6px 20px 8px;
     }
   }
 
   .user-list {
     border: 1px solid $mediumGrey;
-    border-top: none;
     background: $lightGrey;
 
     li {
diff --git a/cms/templates/edit-tabs.html b/cms/templates/edit-tabs.html
index bf68b2b72c..8e75b49410 100644
--- a/cms/templates/edit-tabs.html
+++ b/cms/templates/edit-tabs.html
@@ -22,10 +22,12 @@
     </div>
     <article class="unit-body window">
       <div class="details">
-        <a href="#" class="new-button new-tab left">
+        <p>Here you can add and manage additional pages for your course. These pages will be added to the primary navigation menu alongside Courseware, Course Info, Discussion, etc.</p>
+      </div>
+      <div class="list-header">
+        <a href="#" class="new-button new-tab">
           <span class="plus-icon white"></span>New Tab
         </a>
-        <p>Here you can add and manage additional pages for your course. These pages will be added to the primary navigation menu alongside Courseware, Course Info, Discussion, etc.</p>
       </div>
       <div class="tab-list">
         <ol class='components'>
diff --git a/cms/templates/manage_users.html b/cms/templates/manage_users.html
index 712766eb71..6f33b67d41 100644
--- a/cms/templates/manage_users.html
+++ b/cms/templates/manage_users.html
@@ -11,22 +11,20 @@
       <div class="details">
         <p>The following list of users have been designated as course staff. This means that these users will have permissions to modify course content. You may add additional course staff below, if you are the course instructor. Please note that they must have already registered and verified their account.</p>
       </div>
-      <div class="list-header">
-        %if allow_actions:
-        <a href="#" class="new-user-button">
-          <span class="plus-icon"></span>New User
-        </a>
-        %endif
-      </div>
       %if allow_actions:
-      <div class="new-user-form">
+      <a href="#" class="new-button new-user-button">
+        <span class="plus-icon white"></span>New User
+      </a>
+      %endif
+      %if allow_actions:
+      <form class="new-user-form">
         <div id="result"></div>
         <div class="form-elements">
           <label>email: </label><input type="text" id="email" class="email-input" autocomplete="off" placeholder="email@example.com">
-          <a href="#" id="add_user" class="add-button">add user</a>
-          <a href="#" class="cancel-button">cancel</a>
+          <input type="submit" value="Add User" id="add_user" class="add-button" />
+          <input type="button" value="Cancel" class="cancel-button" />
         </div>
-      </div>
+      </form>
       %endif
       <div>
         <ol class="user-list">
@@ -57,6 +55,7 @@
   function showNewUserForm(e) {
     e.preventDefault();
     $newUserForm.slideDown(150);
+    $newUserForm.find('.email-input').focus();
   }
 
   function hideNewUserForm(e) {
@@ -66,26 +65,37 @@
     $('#email').val('');
   }
 
+  function checkForCancel(e) {
+    if(e.which == 27) {
+      e.data.$cancelButton.click();
+    }
+  }
+
+  function addUser(e) {
+    e.preventDefault();
+
+    $.ajax({
+      url: '${add_user_postback_url}',
+      type: 'POST',
+      dataType: 'json',
+      contentType: 'application/json',
+      data:JSON.stringify({ 'email': $('#email').val()}),
+    }).done(function(data) {
+      if (data.ErrMsg != undefined)
+        $('#result').show().empty().append(data.ErrMsg);
+      else
+        location.reload();
+    });
+  }
+
   $(document).ready(function() {
     $newUserForm = $('.new-user-form');
-    $newUserForm.find('.cancel-button').bind('click', hideNewUserForm);
+    var $cancelButton = $newUserForm.find('.cancel-button');    
+    $newUserForm.bind('submit', addUser);
+    $cancelButton.bind('click', hideNewUserForm);
 
     $('.new-user-button').bind('click', showNewUserForm);
-
-    $('#add_user').click(function() {
-      $.ajax({
-        url: '${add_user_postback_url}',
-        type: 'POST',
-        dataType: 'json',
-        contentType: 'application/json',
-        data:JSON.stringify({ 'email': $('#email').val()}),
-      }).done(function(data) {
-        if (data.ErrMsg != undefined)
-          $('#result').show().empty().append(data.ErrMsg);
-        else
-          location.reload();
-      })
-    });
+    $body.bind('keyup', { $cancelButton: $cancelButton }, checkForCancel);
 
     $('.remove-user').click(function() {
       $.ajax({

From 95dfc730dc0649ee4368788fe3408bc4921b45a1 Mon Sep 17 00:00:00 2001
From: Tom Giannattasio <tom@mitx.mit.edu>
Date: Wed, 5 Dec 2012 12:05:14 -0500
Subject: [PATCH 20/43] new header styles; collapse all button added to
 courseware

---
 cms/static/img/collapse-all-icon.png | Bin 0 -> 1018 bytes
 cms/static/img/home-icon-blue.png    | Bin 0 -> 1106 bytes
 cms/static/img/log-out-icon.png      | Bin 0 -> 1073 bytes
 cms/static/img/small-home-icon.png   | Bin 0 -> 1064 bytes
 cms/static/js/base.js                |  13 ++++-
 cms/static/sass/_base.scss           |   6 +-
 cms/static/sass/_cms_mixins.scss     |  23 +++++++-
 cms/static/sass/_courseware.scss     |  13 ++++-
 cms/static/sass/_graphics.scss       |  21 +++++++
 cms/static/sass/_header.scss         |  83 ++++++++++++++-------------
 cms/static/sass/_variables.scss      |   7 ++-
 cms/templates/overview.html          |   6 +-
 cms/templates/widgets/header.html    |  36 +++++++-----
 13 files changed, 142 insertions(+), 66 deletions(-)
 create mode 100644 cms/static/img/collapse-all-icon.png
 create mode 100644 cms/static/img/home-icon-blue.png
 create mode 100644 cms/static/img/log-out-icon.png
 create mode 100644 cms/static/img/small-home-icon.png

diff --git a/cms/static/img/collapse-all-icon.png b/cms/static/img/collapse-all-icon.png
new file mode 100644
index 0000000000000000000000000000000000000000..c468778b0254d6c98568edbce409ebef38c3af8c
GIT binary patch
literal 1018
zcmaJ=PfXKL7%ze-Bnu>{5fAz-9yDS7x3$t{lZ|!A5{qP8!cNAneXzpXSK9|GoWP41
z4|r3f#&{=QypVYC;4UPXcp>rMiGwjw<H>}BiM|dtJb+Ex_uiN9_xpa|pLcg+{A#58
zOgBYQk=&S?Cu<M+x{h~}|Bu!ANwW0gYzY_86t3wWq|zoTLy)ueX_$w)xo~R(CMc@?
zf>kWxl6Flokj?0!4-?ofK~q#>IB<1i7Gh9_)0UH@f4+K61ItX(lcL6HZU$DYu|*FS
z7RQUm;;bQ?^zaps2oyqKL#%_qt~$OFB<TjPLiVAVr9s05&nD?zQ6+5xWRM4e$i$)s
z$MZmv7(Oma5<dt8ju%*tyi$~pE25+bm%-jclW3kfrR3Goy;$Uwq$?P^3d`1NHKrD0
zkT=cpvMh%jf)FJhQGda~dJuK|fhL0reZ#X{Y#|4PjCvW(;UrCz?xtY7En3IlD-$Ug
z8|W^}GhCQb(^1p@?`qpEZy)F3zTN|g{o;ZP**x^ooM({6O$~&hTqWZ{9V4%ZP_<db
zi3-BVuOJs>3KF=e>4xQmhD!~ErYSkc$GT&{oSLKw2V+^L!euj}lpazAH7)UcR*+*O
zayBcev3Q&(9pIW+6&Z6jbZ`@E?qjouV#8suT@qP^o;456Q4iUmk+fnRpd~Jfqv8-R
z2&zniAEad$YaXs8bEp=Uh+)Il{?qEFiOf&9Z4E9tv_>B~WZpe8*ym@g0=X2`oSH5M
zAIsk#u74eFf3$RTrGH~<vz}_BJ|uRYyggR`wp8kP_T|smPDiib#>aZu&g~Sq(N(Xe
zHhbz1?r+7?Pa|(mrG7_NJ}tlRnOW}Zz23IHnp(TFcJ}ehzUB23+Th8Rd+$yj={QZD
WTkCuNIpX~aZ(}YyuD%$#dHXK|UqU+o

literal 0
HcmV?d00001

diff --git a/cms/static/img/home-icon-blue.png b/cms/static/img/home-icon-blue.png
new file mode 100644
index 0000000000000000000000000000000000000000..45b4971a2a2a8ca2a195623fe8847e5ac5587852
GIT binary patch
literal 1106
zcmaJ=O-K|`93NX<R#CKsXeH`3iY2r=JF~jFgOjd1YrD{FvM#ts=i})PIv>tF+f~Tg
z^srG-f*>8DYfwlZhYmqWY+_JRbjwSZpi3V_P?xYb>S~9!VP@WYe}2E;|MOiQN}g`0
zYpEj$q9GCIQ+RF0Uz5j;|36B+gcmQ0WzeuOhH|0>iHKrI5F|8l9HyYC%uKz2y#(QE
zQ_~rg5zer(q4`Az<Iig*W)nnjU)~hu35b9M$5ovpzdn9S0#)J2kuD)1m{FKj<FghV
zo=v9Z*$FwUkbS2>Z=S^h8bl(<Ym>Uo<~edpm&JR>Op#y<f+jd}JE)8>1fqroL6<-1
zlLIsjLLooh*%b=WCjk?n87hF^kdN+UyFx6}4R#(9d$W`=HpLI__`)ZS%pzp66qU>6
z{JEgtu*NAm91c4g4CBKHpFN`^G4Ipu*0KT*ZP`*yq#8PK6h+CHMjVMF-A+L>cV%^Z
zr%bqDR9-YG+8=OIDgy=K|4>caMcXI^_u~Dhu$`VUA(eu*F>T4XabvBHE0c{{P(+56
zHjK$~6^F70GVH8jg6MDvoDf7=)g42}7DEu&gl;2ImtlhENUY&kRfUaq4@A3T!7vjI
z4A69p2?qzlu~>)?c6QRZ1A#J^H{@vz>Zr_B_PCLXTxS?G6MN>NrJjSzpk-)aD`{4(
z97}gay&bMnIhLM^TnYz6Ij#Mx)nyZ&A7{HexcIO;`cTL7ZsEb+xcktBFGVTAN7DKC
zQvJ=j<$`CmzI36sLn5DnR`A4Knq6vfGug(bI}w$$8s@!io{v`!Fip$iTHMX;lPEAZ
zxZdA>*!_8sS>IoL<htK{%ypv}_;e)wrG4qzyZ-iGcNlo9U5~zb*B71x_wC5fsfFV&
z`>)2Uylb9PaIs!mm75+E>f`Q}YU$v0akJ3lDK>t1^Xq7>>{>4L)D<`H_1BCRe%~sf
xQKGb2e3e{S?Mr=ce|xd!Y|kQ@JilC3eTbMJVH#InZ<L%{o`@y+m4VSqe*oMHU{3%5

literal 0
HcmV?d00001

diff --git a/cms/static/img/log-out-icon.png b/cms/static/img/log-out-icon.png
new file mode 100644
index 0000000000000000000000000000000000000000..c89373619acdede7526d0a0b42497319349c5198
GIT binary patch
literal 1073
zcmaJ=O-K|`93L~RwYGvj&^{kyM3%er;qKH9yXm&G)}kY_F0>cHaptLm&b)Ev>8?iM
zM;{v<g6JR-1a*iyL}iDdLmfQW!H5bHFM%EM5J(=vF4ddWT|2Z5k9q(9pa1Xo|9scl
zTF-bZ_f}FA<xQNGlH}g*%9|_5f9PN!O0H@gPvdsfjWdc3si=m!AV?TW4@^Qu8y<KA
z!xUA1SWl&KT5b_lWcU@=$DcJUf~Kf&L)KE%K8QgV?9t5#z4Y=G4RkF+p9{*YY{g)&
zes;u$?IW!zb)-)XX>`LW5YCE(z<^i*S)<={#B7Al^NK`v%?u6lF1Rm3uO^k2+dvH2
z5Cr}8K9%J-AP9ag5EKNi4)83;Gb}lRj|+%FLF7+>wT~vzY^_^NN=<9Ah!&xHF}6g8
z$z(GAOuZl3Jq#BLg<KAv_Yn`DGi+id>oc920)qq{)z&SnBNMocN*5Z$5t?MWT7qE}
zX-#LXO{8H=R<Rh)&$=ZQ9A)|cu7*+cc5o7|=lf4$CpBzACJ7xhXscv!-8F6~ON`l2
z!N^V_)L-agTQ9=M=|vWZwF}^=tf;!_8fx<hSr!wfgB4SS2`NGo4!^EzVjvi73ZCRx
zUJ3;`F3yMQPlw`hL8=cBH4tPASP7|v1~hR2tF2?Xl2~^c42wjTpsf!<t;t3P$QLc@
zC39ipCHdB{TFG44rjl5OB*VC){cF?(6WJeEEG{llimMMzvhOxo?5XkVZ^@&$pOB)d
z?0na^$rp<a<riP)n#VoYE^Nw8jZW@+RMxTc_^H`rjbU%@(87~Nu%r3Q`>o~l$vgd?
z>91pRp1a*uD>tr08+YY0WdplsI*(K=Q*-gU!<YD(AD<fcd#2BO^eg&kwY@(V8(XPu
zxp{fxgZc9BNGsbD7Vb@ao?H0o-S(SbXzpNVm*3qQy!sJr(tlM<e;7+2$W4r`R6V_2
bwqYx^CAIJ2((}b<?jugbTcyXRJIDV3?3h~=

literal 0
HcmV?d00001

diff --git a/cms/static/img/small-home-icon.png b/cms/static/img/small-home-icon.png
new file mode 100644
index 0000000000000000000000000000000000000000..fb6adcd7cd273a2f23751b69091dd1344cf9fa02
GIT binary patch
literal 1064
zcmaJ=U1-x#6wW#vV|1>vp*R(<sT9REY5M0HR=2k4*1|GMSFrdXrpa9!w&cd-&UQnj
zs0=4Q3=|zh^vx&nS^Qz(d{CSy4qtrmL3|X)#0LdIZ@RVf!5Wg>dk)|CopaAQcRn*V
z(%I45K~Yp^IwfSu>LTCH_BQhOu(z+0WiL+V@i>~mWyyq8OhE+*(wbC+StuzpXJ5hr
zifTQq=JGf%j`A|n7|F&k70n=QiW(TK7?L~*F(|;Isz>Sd$ICQOl_-5OB>F@n0ZVFX
z)`a7;V>x+tQjRF};0Z8L;fa6-u>>mGly32rC|%R#$=-IeG^j!FWR%`aDlcY00+|qm
zn1EOIaU2MT87>$Khq*rB_i=vKN8YfP3-X~b?>`Q<9-2fml?gs83~$9ER+KJbZ15~w
zE|-~dfI()F<sy-Yt>O233Bqg5=vb<Fb<15>5TGTSs)1Fc16xrlplKYXNv4}e(2Rzx
zZf%u`6pXD%2Fo!%`$%=5DE=R+X$`c6vv51#e+pZ<83VFeXrXCSCXJhL+o23TVL}Nb
zGl$Sry^5I<!pJHi10=@7;D{*6s%|@u))=D5r*#WUx(w4olqMRCsw#Xi6dDfo`x1U3
z66Cm~KN5&XlF6_T2of_G^3}NllBYGO<2qN_<_b-@_AqD$i7Y@<JqMLx6KSA!XkKle
zORTBh7FTJWOS~zUCCRXMYyWC>-9_fd-Zlo87>&_~I+=Hq4EE)xuNZPEmeN8jSNTx*
zviNYJr7P3+X?^II^OnQoSn8rSE`Xc#dny7x?s)DWx<B{E<=MX!>%CF^;c^{ZDYkdF
zygr?|w&o(>Wyi+I`8nUNx6ao7PAR^&T1^HX9df4TQkR^i<h#}Cy`O_U?tRayN~-lm
z)d{}J;6U~J=Ri#B^Q=${chIP_$FaMw@O!?;y}0L!gKBA`zCAg1{nXujw|#fh$uZ$U
H{LIBa72Hi*

literal 0
HcmV?d00001

diff --git a/cms/static/js/base.js b/cms/static/js/base.js
index 328c118405..8f2b822ece 100644
--- a/cms/static/js/base.js
+++ b/cms/static/js/base.js
@@ -43,6 +43,8 @@ $(document).ready(function() {
     $('.unit .item-actions .delete-button').bind('click', deleteUnit);
     $('.new-unit-item').bind('click', createNewUnit);
 
+    $('.collapse-all-button').bind('click', collapseAll);
+
     // autosave when a field is updated on the subsection page
     $body.on('keyup', '.subsection-display-name-input, .unit-subtitle, .policy-list-value', checkForNewValue);
     $('.subsection-display-name-input, .unit-subtitle, .policy-list-name, .policy-list-value').each(function(i) {
@@ -128,6 +130,11 @@ $(document).ready(function() {
     });
 });
 
+function collapseAll(e) {
+    $('.branch').addClass('collapsed');
+    $('.expand-collapse-icon').removeClass('collapse').addClass('expand');
+}
+
 function editSectionPublishDate(e) {
     e.preventDefault();
     $modal = $('.edit-subsection-publish-settings').show();
@@ -597,11 +604,11 @@ function hideToastMessage(e) {
 function addNewSection(e, isTemplate) {
     e.preventDefault();
 
-    $(e.target).hide();
+    $(e.target).addClass('disabled');
 
     var $newSection = $($('#new-section-template').html());
     var $cancelButton = $newSection.find('.new-section-name-cancel');
-    $('.new-courseware-section-button').after($newSection);
+    $('.courseware-overview').prepend($newSection);
     $newSection.find('.new-section-name').focus().select();
     $newSection.find('.section-name-form').bind('submit', saveNewSection);
     $cancelButton.bind('click', cancelNewSection);
@@ -638,7 +645,7 @@ function saveNewSection(e) {
 
 function cancelNewSection(e) {
     e.preventDefault();
-    $('.new-courseware-section-button').show();
+    $('.new-courseware-section-button').removeClass('disabled');
     $(this).parents('section.new-section').remove();
 }
 
diff --git a/cms/static/sass/_base.scss b/cms/static/sass/_base.scss
index 07ff92251d..a1bd203624 100644
--- a/cms/static/sass/_base.scss
+++ b/cms/static/sass/_base.scss
@@ -28,6 +28,7 @@ a {
 }
 
 h1 {
+    display: none;
     float: left;
     font-size: 28px;
     font-weight: 300;
@@ -39,8 +40,7 @@ h1 {
 }
 
 .page-actions {
-    float: right;
-    margin-top: 42px;
+    margin-bottom: 25px;
 }
 
 .main-wrapper {
@@ -349,7 +349,7 @@ body.show-wip {
 }
 
 .new-button {
-    @include blue-button;
+    @include green-button;
     font-size: 13px;
     padding: 8px 20px 10px;
     text-align: center;
diff --git a/cms/static/sass/_cms_mixins.scss b/cms/static/sass/_cms_mixins.scss
index 637f4b48f9..5f2a0aadb8 100644
--- a/cms/static/sass/_cms_mixins.scss
+++ b/cms/static/sass/_cms_mixins.scss
@@ -88,7 +88,28 @@
 
 	&:hover {
 		background-color: #d9e3ee;
-		color: #6d788b;
+	}
+}
+
+@mixin green-button {
+	@include button;
+	border: 1px solid $darkGreen;
+	border-radius: 3px;
+	@include linear-gradient(top, rgba(255, 255, 255, .3), rgba(255, 255, 255, 0));
+	background-color: $green;
+	@include box-shadow(0 1px 0 rgba(255, 255, 255, .3) inset);
+	color: #fff;
+
+	&:hover {
+		background-color: $brightGreen;
+		color: #fff;
+	}
+
+	&.disabled {
+		border: 1px solid $disabledGreen !important;
+		background: $disabledGreen !important;
+		color: #fff !important;
+		@include box-shadow(none);
 	}
 }
 
diff --git a/cms/static/sass/_courseware.scss b/cms/static/sass/_courseware.scss
index a48105eb59..05ddcefb48 100644
--- a/cms/static/sass/_courseware.scss
+++ b/cms/static/sass/_courseware.scss
@@ -9,7 +9,7 @@ input.courseware-unit-search-input {
 	position: relative;
 	background: #fff;
 	border-radius: 3px;
-	margin: 15px 0;
+	margin-top: 15px;
 	padding-bottom: 12px;
 	@include box-shadow(0 1px 1px rgba(0,0,0,0.2), 0 0 0 1px rgba(0, 0, 0, 0.1));
 
@@ -192,6 +192,17 @@ input.courseware-unit-search-input {
 	}
 }
 
+.collapse-all-button {
+	float: right;
+	margin-top: 10px;
+	font-size: 13px;
+	color: $darkGrey;
+
+	.collapse-all-icon {
+		margin-right: 6px;
+	}
+}
+
 .new-section-name,
 .new-subsection-name-input {
 	width: 515px;
diff --git a/cms/static/sass/_graphics.scss b/cms/static/sass/_graphics.scss
index 4a63a8a885..80599f7bc4 100644
--- a/cms/static/sass/_graphics.scss
+++ b/cms/static/sass/_graphics.scss
@@ -56,6 +56,27 @@
 	background: url(../img/home-icon.png) no-repeat;
 }
 
+.small-home-icon {
+	display: inline-block;
+	width: 16px;
+	height: 14px;
+	background: url(../img/small-home-icon.png) no-repeat;
+}
+
+.log-out-icon {
+	display: inline-block;
+	width: 15px;
+	height: 13px;
+	background: url(../img/log-out-icon.png) no-repeat;
+}
+
+.collapse-all-icon {
+	display: inline-block;
+	width: 15px;
+	height: 9px;
+	background: url(../img/collapse-all-icon.png) no-repeat;
+}
+
 .calendar-icon {
 	display: inline-block;
 	width: 12px;
diff --git a/cms/static/sass/_header.scss b/cms/static/sass/_header.scss
index cb9a7ed121..039ac69898 100644
--- a/cms/static/sass/_header.scss
+++ b/cms/static/sass/_header.scss
@@ -5,18 +5,16 @@ body.no-header {
 }
 
 @mixin active {
-	@include linear-gradient(top, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.3));
-	@include box-shadow(0 2px 8px rgba(0, 0, 0, .7) inset);
+	color: #3c3c3c;
+	border-bottom: 3px solid $mediumGrey;
 }
 
 .primary-header {
 	width: 100%;
-	height: 36px;
-	border-bottom: 1px solid #2c2e33;
-	@include linear-gradient(top, #686b76, #54565e);
-	font-size: 13px;
-	color: #fff;
-	@include box-shadow(0 1px 1px rgba(0, 0, 0, 0.2), 0 -1px 0px rgba(255, 255, 255, 0.05) inset);
+	margin-bottom: 25px;
+	border-top: 6px solid $blue;
+	border-bottom: 1px solid $mediumGrey;
+	background: #fff;
 
 	&.active-tab-courseware #courseware-tab {
 		@include active;
@@ -38,23 +36,6 @@ body.no-header {
 		@include active;
 	}
 
-	#import-tab {
-		@include box-shadow(1px 0 0 #787981 inset, -1px 0 0 #3d3e44 inset, 1px 0 0 #787981, -1px 0 0 #3d3e44);
-	}
-
-	.left {
-		position: absolute;
-		left: 0;
-		width: 100%;
-	}
-
-	.class-name {
-		max-width: 350px;
-		text-overflow: ellipsis;
-    white-space: nowrap;
-    overflow: hidden;
-	}
-
 	.drop-icon {
 		margin-left: 5px;
 		font-size: 11px;
@@ -65,26 +46,46 @@ body.no-header {
 		line-height: 18px;
 	}
 
-	a,
-	.username {
-		float: left;
-		display: inline-block;
-		height: 29px;
-		padding: 7px 15px 0;
-		color: #e4e6ee;
+	.class-nav-bar {
+		clear: both;
 	}
 
-	.class-nav,
-	.class-nav li {
-		float: left;
-	}
+	.class-nav {
+		@include clearfix;
+		border-top: 1px solid $mediumGrey;
 
-	a {
-		@include box-shadow(1px 0 0 #787981 inset, -1px 0 0 #3d3e44 inset, 1px 0 0 #787981, -1px 0 0 #3d3e44);
-
-		&:hover {
-			background: rgba(255, 255, 255, .1);
+		a {
+			float: left;
+			display: inline-block;
+			padding: 20px 25px 22px;
+			font-size: 15px;
 		}
 
+		li {
+			float: left;
+		}
+	}
+
+	.class {
+		@include clearfix;
+		font-size: 12px;
+		color: $darkGrey;
+
+		a {
+			display: inline-block;
+			height: 20px;
+			padding: 5px 10px 6px;
+			color: $darkGrey;
+		}
+
+		.home {
+			position: relative;
+			top: 1px;
+		}
+
+		.log-out {
+			position: relative;
+			top: 3px;
+		}
 	}
 }
\ No newline at end of file
diff --git a/cms/static/sass/_variables.scss b/cms/static/sass/_variables.scss
index 8666dc192c..81bf252a34 100644
--- a/cms/static/sass/_variables.scss
+++ b/cms/static/sass/_variables.scss
@@ -22,4 +22,9 @@ $lightGrey: #edf1f5;
 $mediumGrey: #ced2db;
 $darkGrey: #8891a1;
 $extraDarkGrey: #3d4043;
-$paleYellow: #fffcf1;
\ No newline at end of file
+$paleYellow: #fffcf1;
+
+$green: rgb(37, 184, 90);
+$brightGreen: rgb(22, 202, 87);
+$disabledGreen: rgb(124, 206, 153);
+$darkGreen: rgb(52, 133, 76);
diff --git a/cms/templates/overview.html b/cms/templates/overview.html
index c1f99a2e30..f1a527bb38 100644
--- a/cms/templates/overview.html
+++ b/cms/templates/overview.html
@@ -99,9 +99,11 @@
   <div class="main-wrapper">
     <div class="inner-wrapper">
       <h1>Courseware</h1>
-      <div class="page-actions"></div>
-      <article class="courseware-overview" data-course-id="${context_course.location.url()}">
+      <div class="page-actions">
         <a href="#" class="new-button new-courseware-section-button"><span class="plus-icon white"></span> New Section</a>
+        <a href="#" class="collapse-all-button"><span class="collapse-all-icon"></span>Collapse All</a>
+      </div>
+      <article class="courseware-overview" data-course-id="${context_course.location.url()}">        
         % for section in sections:
         <section class="courseware-section branch" data-id="${section.location}">
           <header>
diff --git a/cms/templates/widgets/header.html b/cms/templates/widgets/header.html
index f65becb9c7..7f27dd378b 100644
--- a/cms/templates/widgets/header.html
+++ b/cms/templates/widgets/header.html
@@ -2,12 +2,28 @@
 
 <% active_tab_class = 'active-tab-' + active_tab if active_tab else '' %>
 <header class="primary-header ${active_tab_class}">
-  <nav class="inner-wrapper">
-    <div class="left">
-      <a href="/"><span class="home-icon"></span></a>
+  <div class="inner-wrapper">
+    <div class="class">
+      <div class="left">        
+        % if context_course:
+          <% ctx_loc = context_course.location %>
+          <a href="/" class="home"><span class="small-home-icon"></span></a> › 
+          <a href="${reverse('course_index', kwargs=dict(org=ctx_loc.org, course=ctx_loc.course, name=ctx_loc.name))}" class="class-name">${context_course.display_name}</a> ›
+        % endif
+      </div>
+
+      <div class="right">
+        <span class="username">${ user.username }</span>
+        % if user.is_authenticated():
+           <a href="${reverse('logout')}" class="log-out"><span class="log-out-icon"></span></a>
+        % else:
+           <a href="${reverse('login')}">Log in</a>
+        % endif
+      </div>
+    </div>
+    <nav class="class-nav-bar">
       % if context_course:
       <% ctx_loc = context_course.location %>
-      <a href="${reverse('course_index', kwargs=dict(org=ctx_loc.org, course=ctx_loc.course, name=ctx_loc.name))}" class="class-name">${context_course.display_name}</a>
       <ul class="class-nav">
         <li><a href="${reverse('course_index', kwargs=dict(org=ctx_loc.org, course=ctx_loc.course, name=ctx_loc.name))}" id='courseware-tab'>Courseware</a></li>
         <li><a href="${reverse('course_info', kwargs=dict(org=ctx_loc.org, course=ctx_loc.course, name=ctx_loc.name))}" id='courseinfo-tab'>Course Info</a></li>
@@ -18,14 +34,6 @@
         <li><a href="${reverse('import_course', kwargs=dict(org=ctx_loc.org, course=ctx_loc.course, name=ctx_loc.name))}" id='import-tab'>Import</a></li>
       </ul>
       % endif
-    </div>
-    <div class="right">
-      <span class="username">${ user.username }</span>
-      % if user.is_authenticated():
-         <a href="${reverse('logout')}">Log out</a>
-      % else:
-         <a href="${reverse('login')}">Log in</a>
-      % endif
-    </div>
-  </nav>
+    </nav>
+  </div>
 </header>

From 39a882e278b9bd21047db6b1cf18a089b36d5ce9 Mon Sep 17 00:00:00 2001
From: Tom Giannattasio <tom@mitx.mit.edu>
Date: Wed, 5 Dec 2012 17:01:29 -0500
Subject: [PATCH 21/43] more defined header, new icons, cleaner static tabs
 page

---
 cms/static/img/log-out-icon.png    | Bin 1073 -> 1073 bytes
 cms/static/img/small-home-icon.png | Bin 1064 -> 1064 bytes
 cms/static/sass/_base.scss         |  16 +++++++-------
 cms/static/sass/_courseware.scss   |  18 +++-------------
 cms/static/sass/_header.scss       |  33 +++++++++++++++++++----------
 cms/static/sass/_static-pages.scss |  12 ++++-------
 cms/templates/edit-tabs.html       |  13 +++++-------
 cms/templates/overview.html        |   1 -
 cms/templates/widgets/header.html  |  32 +++++++++++++---------------
 9 files changed, 57 insertions(+), 68 deletions(-)

diff --git a/cms/static/img/log-out-icon.png b/cms/static/img/log-out-icon.png
index c89373619acdede7526d0a0b42497319349c5198..887d59f45da9d2c659acf52704c76f93637cef6c 100644
GIT binary patch
delta 276
zcmdnUv5{kg2NRE_tAVkhi=~B;i;KbJ2TWp<vzVk{f|g*x2}~|90W+v71DJq0RE6kd
zLuSYNMGEI{GcYhL_H=O!skoICv#08KJ=>oK!Rai*LcjS0(isiSLzs7|h1JXoZK#kE
zus@P`(NSUAv89r1E(I1hg*whNZxpsWYw$syx4A(>;62kLtqBKxc%CqB=#KE<NS*L@
zeWQg?$9JJiJeL`apI8XAGkpx6p~B7Sx0U_T{S!<&4iz~r?E5z!{VXl>FZIauT?w<E
zF4TO@x6+aC(jVTA<;)wc1lXBB8YY=Cvq&&}7L)$sajxD0=w1d-S3j3^P6<r_%H3g<

delta 276
zcmdnUv5{kg2NREpsi~W(g`t6wi>1lr2TWp<vzVk{f`(wh2}~|f0Rva4Dg&5+8&rkp
zWJ6}h`pr$<=NK3m7JIrlhE&{2dNX6k3w!3e10CK?oSn7o9h)0wNUvgy71p*ptL0$B
z+adpG!wUrg@5h&Tn3XK%<ZvE&-gtv^ewxIO{x(Mkk&bf4LeUcmYHXhvZn)~Gv>2WE
zcHKdS^GG#kW?N>1WRXmVbK?(9pGmDO%WpA%%uitybFeX6)O`QOqo2Hd|BW7b#~Pgd
zbYV(q`xOQD%ztc0E;mNVb~HEskk~kjk%@<aJ4AZr`z<dv0o}{s>FVdQ&MBb@07PD9
ATL1t6

diff --git a/cms/static/img/small-home-icon.png b/cms/static/img/small-home-icon.png
index fb6adcd7cd273a2f23751b69091dd1344cf9fa02..5755bf659db9f74960071ee1ba6a6c83fec87c9d 100644
GIT binary patch
delta 267
zcmZ3%v4UfR2NRE_tAVkhi>0%Xi;KbJ2TWp<vzVk{f-Yde2}~|90Y|7R1DJplRE6kd
zLuSW%ZN6K37#J94dAc};RNP96*;B>NEVqE?$o<A2l6tH@EGF^{kN!I7xUOO>a@fP&
zk=hW!J73Yq!lc<mgYl!Hf?eBr0X3#sdlyJ7R|G1qXMNQFgC|jGfh1dj)S;GTGa0+n
zN}MGo@JwWrywJ5|CZq4?dJQ+T7RHkk*d{PaI@~co?qJ36@??6`tq7ksMg`mZGbA)v
nbRv%Y6V`My&=+83VB%q5$kV>BW*2Y-=u8GrS3j3^P6<r_&aG7{

delta 267
zcmZ3%v4UfR2NREpsi~W(g@Ln?i>1lr2TWp<vzVk{f-Yde2}~|90Y|7R1DJplRE6kd
zLuSYNmc6I-7#J94dAc};RNP8>Gh@dDM*aY{NADf}@Jwe?W17X!@Uc!|n$lGUOND!^
zM~ocSw4E1FlbPixHKpN)fPnnrbPi$0vvC1Emj!@|_cMKTuW2(7yuib3!JFuG`AmbW
z@h(Lkk2a5Ho($JZXBw9Mv=>p9KGcxn!F-~DN8z1$vVv^GmnX)KxjJfx879oj_u&y?
o64Ocg-zlOzL%f5Dfsu{j(;n@~QS&2&fzD*`boFyt=akR{00Wd*6951J

diff --git a/cms/static/sass/_base.scss b/cms/static/sass/_base.scss
index a1bd203624..e3ec19e165 100644
--- a/cms/static/sass/_base.scss
+++ b/cms/static/sass/_base.scss
@@ -6,7 +6,7 @@
 
 body {
     min-width: 980px;
-    background: #eaebed;
+    background: #eaecf3;
     font-size: 16px;
     line-height: 1.6;
     color: #3c3c3c;
@@ -28,7 +28,6 @@ a {
 }
 
 h1 {
-    display: none;
     float: left;
     font-size: 28px;
     font-weight: 300;
@@ -40,7 +39,7 @@ h1 {
 }
 
 .page-actions {
-    margin-bottom: 25px;
+    margin-bottom: 30px;
 }
 
 .main-wrapper {
@@ -177,6 +176,12 @@ code {
     padding: 10px 0;
 }
 
+.details {
+    display: none;
+    margin-bottom: 30px;
+    font-size: 14px;
+}
+
 .window {
     margin-bottom: 20px;
 
@@ -184,11 +189,6 @@ code {
         padding: 20px;
     }
 
-    .details {
-      margin-bottom: 30px;
-      font-size: 14px;
-    }
-
     h4 {
         padding: 6px 14px;
         border-bottom: 1px solid #cbd1db;
diff --git a/cms/static/sass/_courseware.scss b/cms/static/sass/_courseware.scss
index 05ddcefb48..10985d430a 100644
--- a/cms/static/sass/_courseware.scss
+++ b/cms/static/sass/_courseware.scss
@@ -1,4 +1,3 @@
-
 input.courseware-unit-search-input {
 	float: left;
 	width: 260px;
@@ -9,9 +8,9 @@ input.courseware-unit-search-input {
 	position: relative;
 	background: #fff;
 	border-radius: 3px;
-	margin-top: 15px;
+	margin: 15px 0;
 	padding-bottom: 12px;
-	@include box-shadow(0 1px 1px rgba(0,0,0,0.2), 0 0 0 1px rgba(0, 0, 0, 0.1));
+	@include box-shadow(0 1px 1px rgba(0, 0, 0, .2));
 
 	&:first-child {
 		margin-top: 0;
@@ -192,17 +191,6 @@ input.courseware-unit-search-input {
 	}
 }
 
-.collapse-all-button {
-	float: right;
-	margin-top: 10px;
-	font-size: 13px;
-	color: $darkGrey;
-
-	.collapse-all-icon {
-		margin-right: 6px;
-	}
-}
-
 .new-section-name,
 .new-subsection-name-input {
 	width: 515px;
@@ -219,7 +207,7 @@ input.courseware-unit-search-input {
 .new-section-name-cancel,
 .new-subsection-name-cancel {
 	@include white-button;
-	padding: 2px 20px 5px;
+	padding: 4px 20px 7px;
 	color: #8891a1 !important;
 }
 
diff --git a/cms/static/sass/_header.scss b/cms/static/sass/_header.scss
index 039ac69898..ab1dcea03a 100644
--- a/cms/static/sass/_header.scss
+++ b/cms/static/sass/_header.scss
@@ -5,16 +5,16 @@ body.no-header {
 }
 
 @mixin active {
-	color: #3c3c3c;
-	border-bottom: 3px solid $mediumGrey;
+	color: $blue;
+	@include linear-gradient(top, rgba(255, 255, 255, .4), rgba(255, 255, 255, 0));
+	background-color: rgba(255, 255, 255, .3);
+	@include box-shadow(0 -1px 0 rgba(0, 0, 0, .2) inset, 0 1px 0 #fff inset);
+	text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
 }
 
 .primary-header {
 	width: 100%;
-	margin-bottom: 25px;
-	border-top: 6px solid $blue;
-	border-bottom: 1px solid $mediumGrey;
-	background: #fff;
+	margin-bottom: 30px;
 
 	&.active-tab-courseware #courseware-tab {
 		@include active;
@@ -48,17 +48,25 @@ body.no-header {
 
 	.class-nav-bar {
 		clear: both;
+		@include linear-gradient(top, rgba(255, 255, 255, .4), rgba(255, 255, 255, 0));
+		background-color: rgb(197, 207, 223);
+		@include box-shadow(0 1px 0 rgba(255, 255, 255, 0.2) inset, 0 -1px 0 rgba(0, 0, 0, 0.2) inset, 0 1px 1px rgba(0, 0, 0, 0.1));
 	}
 
 	.class-nav {
-		@include clearfix;
-		border-top: 1px solid $mediumGrey;
+		@include clearfix;		
 
 		a {
 			float: left;
 			display: inline-block;
-			padding: 20px 25px 22px;
+			padding: 15px 25px 17px;
 			font-size: 15px;
+			color: #3c3c3c;
+			text-shadow: 0 1px 0 rgba(255, 255, 255, 0.3);
+
+			&:hover {
+				@include linear-gradient(top, rgba(255, 255, 255, .2), rgba(255, 255, 255, 0));
+			}
 		}
 
 		li {
@@ -69,13 +77,16 @@ body.no-header {
 	.class {
 		@include clearfix;
 		font-size: 12px;
-		color: $darkGrey;
+		color: rgb(163, 171, 184);
+		@include linear-gradient(top, rgba(255, 255, 255, 0), rgba(255, 255, 255, .1));
+		background-color: rgb(47, 53, 63);
+		@include box-shadow(0 -1px 3px rgba(0, 0, 0, 0.6) inset);
 
 		a {
 			display: inline-block;
 			height: 20px;
 			padding: 5px 10px 6px;
-			color: $darkGrey;
+			color: rgb(163, 171, 184);			
 		}
 
 		.home {
diff --git a/cms/static/sass/_static-pages.scss b/cms/static/sass/_static-pages.scss
index 68cb3e1d07..f862484250 100644
--- a/cms/static/sass/_static-pages.scss
+++ b/cms/static/sass/_static-pages.scss
@@ -6,12 +6,8 @@
     padding: 12px 0;
   }
 
-  .new-tab {
-    margin-bottom: 15px;
-  }
-
   .unit-body {
-    padding: 30px 40px;
+    padding: 0;
   }
 
   .components > li {
@@ -40,7 +36,7 @@
       }
 
       .drag-handle {
-        background: url(../img/drag-handles.png) center no-repeat $lightGrey;
+        background: url(../img/drag-handles.png) center no-repeat #fff;
       }
     }
 
@@ -50,7 +46,7 @@
       z-index: 11;
       width: 35px;
       border: none;
-      background: url(../img/drag-handles.png) center no-repeat $lightGrey;
+      background: url(../img/drag-handles.png) center no-repeat #fff;
 
       &:hover {
         background: url(../img/drag-handles.png) center no-repeat $lightGrey;
@@ -73,7 +69,7 @@
     padding: 20px 20px 22px;
     font-size: 24px;
     font-weight: 300;
-    background: $lightGrey;
+    background: #fff;
   }
 
   .static-page-item {
diff --git a/cms/templates/edit-tabs.html b/cms/templates/edit-tabs.html
index 8e75b49410..637329f356 100644
--- a/cms/templates/edit-tabs.html
+++ b/cms/templates/edit-tabs.html
@@ -17,18 +17,15 @@
 <%block name="content">
 <div class="main-wrapper">
   <div class="inner-wrapper">
-    <div>
-      <h1>Static Tabs</h1>
-    </div>
-    <article class="unit-body window">
-      <div class="details">
-        <p>Here you can add and manage additional pages for your course. These pages will be added to the primary navigation menu alongside Courseware, Course Info, Discussion, etc.</p>
-      </div>
-      <div class="list-header">
+    <div class="page-actions">
         <a href="#" class="new-button new-tab">
           <span class="plus-icon white"></span>New Tab
         </a>
       </div>
+    <article class="unit-body">
+      <div class="details">
+        <p>Here you can add and manage additional pages for your course. These pages will be added to the primary navigation menu alongside Courseware, Course Info, Discussion, etc.</p>
+      </div>
       <div class="tab-list">
         <ol class='components'>
           % for id in components:
diff --git a/cms/templates/overview.html b/cms/templates/overview.html
index f1a527bb38..9e8742db24 100644
--- a/cms/templates/overview.html
+++ b/cms/templates/overview.html
@@ -98,7 +98,6 @@
 
   <div class="main-wrapper">
     <div class="inner-wrapper">
-      <h1>Courseware</h1>
       <div class="page-actions">
         <a href="#" class="new-button new-courseware-section-button"><span class="plus-icon white"></span> New Section</a>
         <a href="#" class="collapse-all-button"><span class="collapse-all-icon"></span>Collapse All</a>
diff --git a/cms/templates/widgets/header.html b/cms/templates/widgets/header.html
index 7f27dd378b..c6e28f9c29 100644
--- a/cms/templates/widgets/header.html
+++ b/cms/templates/widgets/header.html
@@ -1,9 +1,9 @@
 <%! from django.core.urlresolvers import reverse %>
 
 <% active_tab_class = 'active-tab-' + active_tab if active_tab else '' %>
-<header class="primary-header ${active_tab_class}">
-  <div class="inner-wrapper">
-    <div class="class">
+<header class="primary-header ${active_tab_class}">  
+  <div class="class">
+    <div class="inner-wrapper">
       <div class="left">        
         % if context_course:
           <% ctx_loc = context_course.location %>
@@ -21,19 +21,17 @@
         % endif
       </div>
     </div>
-    <nav class="class-nav-bar">
-      % if context_course:
-      <% ctx_loc = context_course.location %>
-      <ul class="class-nav">
-        <li><a href="${reverse('course_index', kwargs=dict(org=ctx_loc.org, course=ctx_loc.course, name=ctx_loc.name))}" id='courseware-tab'>Courseware</a></li>
-        <li><a href="${reverse('course_info', kwargs=dict(org=ctx_loc.org, course=ctx_loc.course, name=ctx_loc.name))}" id='courseinfo-tab'>Course Info</a></li>
-        <li><a href="${reverse('edit_tabs', kwargs=dict(org=ctx_loc.org, course=ctx_loc.course, coursename=ctx_loc.name))}" id='pages-tab'>Tabs</a></li>
-        <li><a href="${reverse('asset_index', kwargs=dict(org=ctx_loc.org, course=ctx_loc.course, name=ctx_loc.name))}" id='assets-tab'>Assets</a></li>
-        <li><a href="${reverse('manage_users', kwargs=dict(location=ctx_loc))}" id='users-tab'>Users</a></li>
-        <li><a href="${reverse('course_settings', kwargs=dict(org=ctx_loc.org, course=ctx_loc.course, name=ctx_loc.name))}" id='settings-tab'>Settings</a></li>
-        <li><a href="${reverse('import_course', kwargs=dict(org=ctx_loc.org, course=ctx_loc.course, name=ctx_loc.name))}" id='import-tab'>Import</a></li>
-      </ul>
-      % endif
-    </nav>
   </div>
+  <nav class="class-nav-bar">
+    % if context_course:
+    <% ctx_loc = context_course.location %>
+    <ul class="class-nav inner-wrapper">
+      <li><a href="${reverse('course_index', kwargs=dict(org=ctx_loc.org, course=ctx_loc.course, name=ctx_loc.name))}" id='courseware-tab'>Courseware</a></li>
+      <li><a href="${reverse('edit_tabs', kwargs=dict(org=ctx_loc.org, course=ctx_loc.course, coursename=ctx_loc.name))}" id='pages-tab'>Tabs</a></li>
+      <li><a href="${reverse('asset_index', kwargs=dict(org=ctx_loc.org, course=ctx_loc.course, name=ctx_loc.name))}" id='assets-tab'>Assets</a></li>
+      <li><a href="${reverse('course_settings', kwargs=dict(org=ctx_loc.org, course=ctx_loc.course, name=ctx_loc.name))}" id='settings-tab'>Settings</a></li>
+      <li><a href="${reverse('import_course', kwargs=dict(org=ctx_loc.org, course=ctx_loc.course, name=ctx_loc.name))}" id='import-tab'>Import</a></li>
+    </ul>
+    % endif
+  </nav>
 </header>

From 052b6f695a7db2457c9970f5c933507008cb3daa Mon Sep 17 00:00:00 2001
From: Tom Giannattasio <tom@mitx.mit.edu>
Date: Thu, 6 Dec 2012 14:25:30 -0500
Subject: [PATCH 22/43] cleaned up editor styles; cleaned up static tabs page

---
 cms/static/coffee/src/views/module_edit.coffee |  1 +
 cms/static/sass/_base.scss                     | 12 +++++++++---
 cms/static/sass/_cms_mixins.scss               | 13 +++++--------
 cms/static/sass/_header.scss                   |  5 ++---
 cms/static/sass/_static-pages.scss             |  5 +++++
 cms/static/sass/_unit.scss                     | 11 -----------
 cms/static/sass/_variables.scss                |  3 ++-
 cms/templates/widgets/metadata-edit.html       |  1 -
 8 files changed, 24 insertions(+), 27 deletions(-)

diff --git a/cms/static/coffee/src/views/module_edit.coffee b/cms/static/coffee/src/views/module_edit.coffee
index ad875294a1..068750c3d9 100644
--- a/cms/static/coffee/src/views/module_edit.coffee
+++ b/cms/static/coffee/src/views/module_edit.coffee
@@ -74,4 +74,5 @@ class CMS.Views.ModuleEdit extends Backbone.View
     event.preventDefault()
     @$el.addClass('editing')
     @$component_editor().slideDown(150)
+    # $modalCover.show()
     @loadEdit()
diff --git a/cms/static/sass/_base.scss b/cms/static/sass/_base.scss
index e3ec19e165..56fb61f4d9 100644
--- a/cms/static/sass/_base.scss
+++ b/cms/static/sass/_base.scss
@@ -9,7 +9,7 @@ body {
     background: #eaecf3;
     font-size: 16px;
     line-height: 1.6;
-    color: #3c3c3c;
+    color: $baseFontColor;
 }
 
 body,
@@ -93,7 +93,7 @@ input[type="password"] {
     @include box-shadow(0 1px 2px rgba(0, 0, 0, .1) inset);
     font-family: 'Open Sans', sans-serif;
     font-size: 11px;
-    color: #3c3c3c;
+    color: $baseFontColor;
     outline: 0;
 
     &::-webkit-input-placeholder,
@@ -110,7 +110,7 @@ input.search {
     border-radius: 20px;
     background: url(../img/search-icon.png) no-repeat 8px 7px #edf1f5;
     font-family: 'Open Sans', sans-serif;
-    color: #3c3c3c;
+    color: $baseFontColor;
     outline: 0;
 
     &::-webkit-input-placeholder {
@@ -129,6 +129,12 @@ code {
     font-family: Monaco, monospace;
 }
 
+.CodeMirror {
+    font-size: 13px;
+    border: 1px solid $darkGrey;
+    background: #fff;
+}
+
 .text-editor {
     width: 100%;
     min-height: 80px;
diff --git a/cms/static/sass/_cms_mixins.scss b/cms/static/sass/_cms_mixins.scss
index 5f2a0aadb8..ff2a6bb2c3 100644
--- a/cms/static/sass/_cms_mixins.scss
+++ b/cms/static/sass/_cms_mixins.scss
@@ -130,18 +130,17 @@
 @mixin edit-box {
 	padding: 15px 20px;
 	border-radius: 3px;
-	border: 1px solid #5597dd;
-	@include linear-gradient(top, rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0));
-	background-color: #5597dd;
+	background-color: $lightBluishGrey;
+	color: #3c3c3c;
 	@include box-shadow(0 1px 0 rgba(255, 255, 255, .2) inset);
 
 	label {
-		color: #fff;
+		color: $baseFontColor;
 	}
 
 	input,
 	textarea {
-		border: 1px solid #3c3c3c;
+		border: 1px solid $darkGrey;
 	}
 
 	textarea {
@@ -161,14 +160,12 @@
 	}
 
 	.save-button {
-		@include orange-button;
-		border-color: #3c3c3c;
+		@include blue-button;
 		margin-top: 0;
 	}
 
 	.cancel-button {
 		@include white-button;
-		border-color: #30649C;
 		margin-top: 0;
 	}
 }
diff --git a/cms/static/sass/_header.scss b/cms/static/sass/_header.scss
index ab1dcea03a..8402fa54be 100644
--- a/cms/static/sass/_header.scss
+++ b/cms/static/sass/_header.scss
@@ -49,8 +49,8 @@ body.no-header {
 	.class-nav-bar {
 		clear: both;
 		@include linear-gradient(top, rgba(255, 255, 255, .4), rgba(255, 255, 255, 0));
-		background-color: rgb(197, 207, 223);
-		@include box-shadow(0 1px 0 rgba(255, 255, 255, 0.2) inset, 0 -1px 0 rgba(0, 0, 0, 0.2) inset, 0 1px 1px rgba(0, 0, 0, 0.1));
+		background-color: $lightBluishGrey;
+		@include box-shadow(0 1px 0 rgba(255, 255, 255, 0.2) inset, 0 -1px 0 rgba(0, 0, 0, 0.2) inset);
 	}
 
 	.class-nav {
@@ -80,7 +80,6 @@ body.no-header {
 		color: rgb(163, 171, 184);
 		@include linear-gradient(top, rgba(255, 255, 255, 0), rgba(255, 255, 255, .1));
 		background-color: rgb(47, 53, 63);
-		@include box-shadow(0 -1px 3px rgba(0, 0, 0, 0.6) inset);
 
 		a {
 			display: inline-block;
diff --git a/cms/static/sass/_static-pages.scss b/cms/static/sass/_static-pages.scss
index f862484250..9a2d1303ec 100644
--- a/cms/static/sass/_static-pages.scss
+++ b/cms/static/sass/_static-pages.scss
@@ -10,6 +10,11 @@
     padding: 0;
   }
 
+  .component-editor {
+    border: none;
+    border-radius: 0;
+  }
+
   .components > li {
     margin: 0;
     border-radius: 0;
diff --git a/cms/static/sass/_unit.scss b/cms/static/sass/_unit.scss
index fdf737fc12..8f1500503e 100644
--- a/cms/static/sass/_unit.scss
+++ b/cms/static/sass/_unit.scss
@@ -157,7 +157,6 @@
     }
 
     &.editing {
-      border-color: #6696d7;
 
       .drag-handle,
       .component-actions {
@@ -204,10 +203,6 @@
     @include edit-box;
     display: none;
     padding: 20px;
-    border-radius: 2px 2px 0 0;
-    @include linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, .1));
-    background-color: $blue;
-    color: #fff;
     @include box-shadow(none);
 
     .metadata_edit {
@@ -224,12 +219,6 @@
       }
     }
 
-    .CodeMirror {
-      border: 1px solid #3c3c3c;
-      background: #fff;
-      color: #3c3c3c;
-    }
-
     h3 {
       margin-bottom: 10px;
       font-size: 18px;
diff --git a/cms/static/sass/_variables.scss b/cms/static/sass/_variables.scss
index 81bf252a34..819c0f3229 100644
--- a/cms/static/sass/_variables.scss
+++ b/cms/static/sass/_variables.scss
@@ -14,6 +14,7 @@ $pink: rgb(182,37,104);
 $error-red: rgb(253, 87, 87);
 
 $offBlack: #3c3c3c;
+$baseFontColor: #3c3c3c;
 $blue: #5597dd;
 $orange: #edbd3c;
 $red: #b20610;
@@ -23,8 +24,8 @@ $mediumGrey: #ced2db;
 $darkGrey: #8891a1;
 $extraDarkGrey: #3d4043;
 $paleYellow: #fffcf1;
-
 $green: rgb(37, 184, 90);
 $brightGreen: rgb(22, 202, 87);
 $disabledGreen: rgb(124, 206, 153);
 $darkGreen: rgb(52, 133, 76);
+$lightBluishGrey: rgb(197, 207, 223);
\ No newline at end of file
diff --git a/cms/templates/widgets/metadata-edit.html b/cms/templates/widgets/metadata-edit.html
index 069db424da..590baec3c9 100644
--- a/cms/templates/widgets/metadata-edit.html
+++ b/cms/templates/widgets/metadata-edit.html
@@ -4,7 +4,6 @@
   hlskey = hashlib.md5(module.location.url()).hexdigest()
 %>
 <section class="metadata_edit">
-  <h3>Metadata</h3>
   <ul>
     % for keyname in editable_metadata_fields:
     <li>

From 5b81d6b8cc0caaba6633bc13f86ed773fef9624c Mon Sep 17 00:00:00 2001
From: Tom Giannattasio <tom@mitx.mit.edu>
Date: Thu, 6 Dec 2012 16:34:13 -0500
Subject: [PATCH 23/43] cleaned up subsection and unit page

---
 .../coffee/src/views/module_edit.coffee       |  1 -
 cms/static/sass/_base.scss                    | 26 ++++++-------
 cms/static/sass/_cms_mixins.scss              | 38 +++++++++++--------
 cms/static/sass/_courseware.scss              |  5 ++-
 cms/static/sass/_static-pages.scss            |  2 +-
 cms/static/sass/_unit.scss                    | 15 +++-----
 cms/static/sass/_variables.scss               |  5 ++-
 7 files changed, 47 insertions(+), 45 deletions(-)

diff --git a/cms/static/coffee/src/views/module_edit.coffee b/cms/static/coffee/src/views/module_edit.coffee
index 068750c3d9..ad875294a1 100644
--- a/cms/static/coffee/src/views/module_edit.coffee
+++ b/cms/static/coffee/src/views/module_edit.coffee
@@ -74,5 +74,4 @@ class CMS.Views.ModuleEdit extends Backbone.View
     event.preventDefault()
     @$el.addClass('editing')
     @$component_editor().slideDown(150)
-    # $modalCover.show()
     @loadEdit()
diff --git a/cms/static/sass/_base.scss b/cms/static/sass/_base.scss
index 56fb61f4d9..3c2d134919 100644
--- a/cms/static/sass/_base.scss
+++ b/cms/static/sass/_base.scss
@@ -6,7 +6,7 @@
 
 body {
     min-width: 980px;
-    background: #eaecf3;
+    background: rgb(240, 241, 245);
     font-size: 16px;
     line-height: 1.6;
     color: $baseFontColor;
@@ -57,12 +57,6 @@ h1 {
     }
 }
 
-.window {
-    background: #fff;
-    border-radius: 3px;
-    @include box-shadow(0 1px 1px rgba(0,0,0,0.2), 0 0 0 1px rgba(0, 0, 0, 0.1));
-}
-
 .sidebar {
     float: right;
     width: 28%;
@@ -86,7 +80,7 @@ input[type="email"],
 input[type="password"] {
     padding: 6px 8px 8px;
     @include box-sizing(border-box);
-    border: 1px solid #b0b6c2;
+    border: 1px solid $mediumGrey;
     border-radius: 2px;
     @include linear-gradient(top, rgba(255, 255, 255, 0), rgba(255, 255, 255, .3));
     background-color: #edf1f5;
@@ -140,7 +134,7 @@ code {
     min-height: 80px;
     padding: 10px;
     @include box-sizing(border-box);
-    border: 1px solid #b0b6c2;
+    border: 1px solid $mediumGrey;
     @include linear-gradient(top, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.3));
     background-color:  #edf1f5;
     @include box-shadow(0 1px 2px rgba(0, 0, 0, 0.1) inset);
@@ -190,6 +184,10 @@ code {
 
 .window {
     margin-bottom: 20px;
+    border: 1px solid $mediumGrey;
+    border-radius: 3px;
+    background: #fff;
+    @include box-shadow(0 1px 1px rgba(0, 0, 0, 0.1));
 
     .window-contents {
         padding: 20px;
@@ -197,13 +195,13 @@ code {
 
     h4 {
         padding: 6px 14px;
-        border-bottom: 1px solid #cbd1db;
+        border-bottom: 1px solid $mediumGrey;
         border-radius: 3px 3px 0 0;
-        @include linear-gradient(top, rgba(255, 255, 255, .3), rgba(255, 255, 255, 0) 70%);
-        background-color: #edf1f5;
-        @include box-shadow(0 1px 0 rgba(255, 255, 255, .7) inset);
+        @include linear-gradient(top, rgba(255, 255, 255, .4), rgba(255, 255, 255, 0));
+        background-color: $lightBluishGrey;
+        @include box-shadow(0 1px 0 rgba(255, 255, 255, 0.2) inset);
         font-size: 14px;
-        font-weight: 600;
+        text-shadow: 0 1px 0 rgba(255, 255, 255, 0.3);
     }
 
     label {
diff --git a/cms/static/sass/_cms_mixins.scss b/cms/static/sass/_cms_mixins.scss
index ff2a6bb2c3..361aa6929c 100644
--- a/cms/static/sass/_cms_mixins.scss
+++ b/cms/static/sass/_cms_mixins.scss
@@ -48,18 +48,19 @@
 }
 
 @mixin white-button {
-	@include button;
-	border: 1px solid $darkGrey;
-	border-radius: 3px;
-	@include linear-gradient(top, rgba(255, 255, 255, 0.6), rgba(255, 255, 255, 0));
-	background-color: #dfe5eb;
-	@include box-shadow(0 1px 0 rgba(255, 255, 255, .3) inset);
-	color: #778192;
-	
-	&:hover {
-		background-color: #f2f6f9;
-		color: #778192;
-	}
+  @include button;
+  border: 1px solid $mediumGrey;
+  border-radius: 3px;
+  @include linear-gradient(top, rgba(255, 255, 255, 0.6), rgba(255, 255, 255, 0));
+  background-color: #dfe5eb;
+  @include box-shadow(0 1px 0 rgba(255, 255, 255, .3) inset);
+  color: rgb(92, 103, 122);
+  text-shadow: 0 1px 0 rgba(255, 255, 255, .5);
+
+  &:hover {
+    background-color: rgb(222, 236, 247);
+    color: rgb(92, 103, 122);
+  }
 }
 
 @mixin orange-button {
@@ -88,6 +89,7 @@
 
 	&:hover {
 		background-color: #d9e3ee;
+		color: #6d788b;
 	}
 }
 
@@ -130,7 +132,7 @@
 @mixin edit-box {
 	padding: 15px 20px;
 	border-radius: 3px;
-	background-color: $lightBluishGrey;
+	background-color: $lightBluishGrey2;
 	color: #3c3c3c;
 	@include box-shadow(0 1px 0 rgba(255, 255, 255, .2) inset);
 
@@ -171,8 +173,8 @@
 }
 
 @mixin tree-view {
-	border: 1px solid #ced2db;
-	background: #edf1f5;
+	border: 1px solid $mediumGrey;
+	background: $lightGrey;
 
 	.branch {
 		margin-bottom: 10px;
@@ -232,7 +234,11 @@
 	}
 
 	a {
-		color: #2c2e33;
+		color: $baseFontColor;
+
+		&.new-unit-item {
+			color: #6d788b;
+		}
 	}
 
 	ol {
diff --git a/cms/static/sass/_courseware.scss b/cms/static/sass/_courseware.scss
index 10985d430a..ef4ddb7755 100644
--- a/cms/static/sass/_courseware.scss
+++ b/cms/static/sass/_courseware.scss
@@ -8,9 +8,10 @@ input.courseware-unit-search-input {
 	position: relative;
 	background: #fff;
 	border-radius: 3px;
-	margin: 15px 0;
+	border: 1px solid $mediumGrey;
+	margin-top: 15px;
 	padding-bottom: 12px;
-	@include box-shadow(0 1px 1px rgba(0, 0, 0, .2));
+	@include box-shadow(0 1px 1px rgba(0, 0, 0, 0.1));
 
 	&:first-child {
 		margin-top: 0;
diff --git a/cms/static/sass/_static-pages.scss b/cms/static/sass/_static-pages.scss
index 9a2d1303ec..78d6ba66d7 100644
--- a/cms/static/sass/_static-pages.scss
+++ b/cms/static/sass/_static-pages.scss
@@ -54,7 +54,7 @@
       background: url(../img/drag-handles.png) center no-repeat #fff;
 
       &:hover {
-        background: url(../img/drag-handles.png) center no-repeat $lightGrey;
+        background: url(../img/drag-handles.png) center no-repeat #fff;
       }
     }
 
diff --git a/cms/static/sass/_unit.scss b/cms/static/sass/_unit.scss
index 8f1500503e..fc84a818ca 100644
--- a/cms/static/sass/_unit.scss
+++ b/cms/static/sass/_unit.scss
@@ -142,7 +142,7 @@
   }
 
   .component {
-    border: 1px solid #d1ddec;
+    border: 1px solid $lightBluishGrey2;
     border-radius: 3px;
     background: #fff;
     @include transition(none);
@@ -157,6 +157,7 @@
     }
 
     &.editing {
+      border: 1px solid $lightBluishGrey2;
 
       .drag-handle,
       .component-actions {
@@ -172,11 +173,6 @@
       position: absolute;
       top: 7px;
       right: 9px;
-      @include transition(opacity .15s);
-
-      a {
-        color: $darkGrey;
-      }
     }
 
     .drag-handle {
@@ -188,10 +184,10 @@
       width: 15px;
       height: 100%;
       border-radius: 0 3px 3px 0;
-      border: 1px solid #d1ddec;
-      background: url(../img/white-drag-handles.png) center no-repeat #d1ddec;
+      border: 1px solid $lightBluishGrey2;
+      background: url(../img/white-drag-handles.png) center no-repeat $lightBluishGrey2;
       cursor: move;
-      @include transition(all .15s);
+      @include transition(none);
     }
   }
 
@@ -203,6 +199,7 @@
     @include edit-box;
     display: none;
     padding: 20px;
+    border-radius: 2px 2px 0 0;
     @include box-shadow(none);
 
     .metadata_edit {
diff --git a/cms/static/sass/_variables.scss b/cms/static/sass/_variables.scss
index 819c0f3229..d556ca87a9 100644
--- a/cms/static/sass/_variables.scss
+++ b/cms/static/sass/_variables.scss
@@ -20,7 +20,7 @@ $orange: #edbd3c;
 $red: #b20610;
 $green: #108614;
 $lightGrey: #edf1f5;
-$mediumGrey: #ced2db;
+$mediumGrey: #b0b6c2;
 $darkGrey: #8891a1;
 $extraDarkGrey: #3d4043;
 $paleYellow: #fffcf1;
@@ -28,4 +28,5 @@ $green: rgb(37, 184, 90);
 $brightGreen: rgb(22, 202, 87);
 $disabledGreen: rgb(124, 206, 153);
 $darkGreen: rgb(52, 133, 76);
-$lightBluishGrey: rgb(197, 207, 223);
\ No newline at end of file
+$lightBluishGrey: rgb(197, 207, 223);
+$lightBluishGrey2: rgb(213, 220, 228);

From 66004aeb2d884d1ef7220630c69647215404ad5a Mon Sep 17 00:00:00 2001
From: Tom Giannattasio <tom@mitx.mit.edu>
Date: Thu, 6 Dec 2012 17:00:16 -0500
Subject: [PATCH 24/43] pulled out component types from behind add component
 button

---
 cms/static/sass/_unit.scss | 30 ++++++++++++++++++++----------
 cms/templates/unit.html    |  8 ++------
 2 files changed, 22 insertions(+), 16 deletions(-)

diff --git a/cms/static/sass/_unit.scss b/cms/static/sass/_unit.scss
index fc84a818ca..2fbace8434 100644
--- a/cms/static/sass/_unit.scss
+++ b/cms/static/sass/_unit.scss
@@ -57,14 +57,10 @@
       margin: 20px 40px;
 
       &.new-component-item {
-        padding: 0;
+        padding: 20px;
         border: none;
-        border-radius: 0;
-
-        &.adding {
-          background-color: $blue;
-          border-color: #437fbf;
-        }
+        border-radius: 3px;
+        background: $lightGrey;
 
         .new-component-button {
           display: block;
@@ -88,14 +84,20 @@
         .new-component-type, .new-component-template {
           @include clearfix;
 
+          li {
+            display: inline-block;
+          }
+
           a {
             position: relative;
-            float: left;
+            display: inline-block;
             width: 100px;
             height: 100px;
             margin-right: 10px;
             margin-bottom: 10px;
             border-radius: 8px;
+            border: 1px solid $darkGreen;
+            background: $green;
             font-size: 13px;
             line-height: 14px;
             color: #fff;
@@ -104,7 +106,7 @@
             @include transition(background-color .15s);
 
             &:hover {
-              background-color: rgba(255, 255, 255, .2);
+              background: $brightGreen;
             }
 
             .name {
@@ -124,7 +126,15 @@
           }
         }
 
-        .new-component,
+        .new-component {          
+          text-align: center;
+
+          h5 {
+            color: $green;
+          }
+          
+        }
+        
         .new-component-templates {
           display: none;
           position: absolute;
diff --git a/cms/templates/unit.html b/cms/templates/unit.html
index f2601c7c7e..523d956f06 100644
--- a/cms/templates/unit.html
+++ b/cms/templates/unit.html
@@ -32,12 +32,9 @@
             % for id in components:
             <li class="component" data-id="${id}"/>
             % endfor
-            <li class="new-component-item">
-              <a href="#" class="new-component-button new-button big">
-                <span class="plus-icon"></span>New Component
-              </a>
+            <li class="new-component-item adding">              
               <div class="new-component">
-                <h5>Select Component Type</h5>
+                <h5>Add New Component</h5>
                 <ul class="new-component-type">
                   % for type in sorted(component_templates.keys()):
                   <li>
@@ -48,7 +45,6 @@
                   </li>
                   % endfor
                 </ul>
-                <a href="#" class="cancel-button">Cancel</a>
               </div>
               % for type, templates in sorted(component_templates.items()):
               <div class="new-component-templates new-component-${type}">

From d7b3f28d17dad4da327cbf1ef6ab5dacde3f5d72 Mon Sep 17 00:00:00 2001
From: Tom Giannattasio <tom@mitx.mit.edu>
Date: Fri, 7 Dec 2012 09:35:34 -0500
Subject: [PATCH 25/43] reworked add component steps

---
 cms/static/coffee/src/views/unit.coffee | 17 ++------
 cms/static/sass/_unit.scss              | 58 +++++++++++++++++--------
 2 files changed, 42 insertions(+), 33 deletions(-)

diff --git a/cms/static/coffee/src/views/unit.coffee b/cms/static/coffee/src/views/unit.coffee
index a250925bf9..fe8f928746 100644
--- a/cms/static/coffee/src/views/unit.coffee
+++ b/cms/static/coffee/src/views/unit.coffee
@@ -4,7 +4,6 @@ class CMS.Views.UnitEdit extends Backbone.View
     'click .new-component .cancel-button': 'closeNewComponent'
     'click .new-component-templates .new-component-template a': 'saveNewComponent'
     'click .new-component-templates .cancel-button': 'closeNewComponent'
-    'click .new-component-button': 'showNewComponentForm'
     'click .delete-draft': 'deleteDraft'
     'click .create-draft': 'createDraft'
     'click .publish-draft': 'publishDraft'
@@ -54,30 +53,20 @@ class CMS.Views.UnitEdit extends Backbone.View
         )
     )
 
-  # New component creation
-  showNewComponentForm: (event) =>
-    event.preventDefault()
-    @$newComponentItem.addClass('adding')
-    $(event.target).fadeOut(150)
-    @$newComponentItem.css('height', @$newComponentTypePicker.outerHeight())
-    @$newComponentTypePicker.slideDown(250)
-
   showComponentTemplates: (event) =>
     event.preventDefault()
 
     type = $(event.currentTarget).data('type')
-    @$newComponentTypePicker.fadeOut(250)
-    @$(".new-component-#{type}").fadeIn(250)
+    @$newComponentTypePicker.slideUp(250)
+    @$(".new-component-#{type}").slideDown(250)
 
   closeNewComponent: (event) =>
     event.preventDefault()
 
-    @$newComponentTypePicker.slideUp(250)
+    @$newComponentTypePicker.slideDown(250)
     @$newComponentTemplatePickers.slideUp(250)
-    @$newComponentButton.fadeIn(250)
     @$newComponentItem.removeClass('adding')
     @$newComponentItem.find('.rendered-component').remove()
-    @$newComponentItem.css('height', @$newComponentButton.outerHeight())
 
   saveNewComponent: (event) =>
     event.preventDefault()
diff --git a/cms/static/sass/_unit.scss b/cms/static/sass/_unit.scss
index 2fbace8434..5d117c26c0 100644
--- a/cms/static/sass/_unit.scss
+++ b/cms/static/sass/_unit.scss
@@ -81,33 +81,22 @@
           border-radius: 3px 3px 0 0;
         }
 
-        .new-component-type, .new-component-template {
-          @include clearfix;
-
+        .new-component-type {
+          a,
           li {
             display: inline-block;
           }
 
           a {
-            position: relative;
-            display: inline-block;
             width: 100px;
             height: 100px;
             margin-right: 10px;
             margin-bottom: 10px;
             border-radius: 8px;
-            border: 1px solid $darkGreen;
-            background: $green;
             font-size: 13px;
             line-height: 14px;
-            color: #fff;
             text-align: center;
-            @include box-shadow(0 1px 1px rgba(0, 0, 0, .4), 0 1px 0 rgba(255, 255, 255, .4) inset);
-            @include transition(background-color .15s);
-
-            &:hover {
-              background: $brightGreen;
-            }
+            @include box-shadow(0 1px 1px rgba(0, 0, 0, .2), 0 1px 0 rgba(255, 255, 255, .4) inset);
 
             .name {
               position: absolute;
@@ -120,9 +109,43 @@
           }
         }
 
+        .new-component-type,
         .new-component-template {
+          @include clearfix;
+
           a {
-            height: 60px;
+            position: relative;            
+            border: 1px solid $darkGreen;
+            background: $green;
+            color: #fff;            
+            @include transition(background-color .15s);
+
+            &:hover {
+              background: $brightGreen;
+            }
+          }
+        }
+
+        .new-component-template {
+          margin-bottom: 20px;
+
+          li:first-child {
+            a {
+              border-radius: 3px 3px 0 0;
+            }
+          }
+
+          li:last-child {
+            a {
+              border-radius: 0 0 3px 3px;
+            }
+          }
+
+          a {
+            display: block;
+            padding: 7px 20px;
+            border-bottom: none;
+            font-weight: 300;
           }
         }
 
@@ -137,14 +160,11 @@
         
         .new-component-templates {
           display: none;
-          position: absolute;
-          width: 100%;
           padding: 20px;
           @include clearfix;
 
           .cancel-button {
-            @include blue-button;
-            border-color: #30649c;
+            @include white-button;
           }
         }
       }

From 75c4909785342a5b5e18ad3f065fd3eea14113ee Mon Sep 17 00:00:00 2001
From: Tom Giannattasio <tom@mitx.mit.edu>
Date: Fri, 7 Dec 2012 14:31:48 -0500
Subject: [PATCH 26/43] added modal cover for editors

---
 cms/static/coffee/src/views/module_edit.coffee |   3 +++
 cms/static/img/upload-icon.png                 | Bin 0 -> 1122 bytes
 cms/static/sass/_assets.scss                   |   8 --------
 cms/static/sass/_graphics.scss                 |   8 ++++++++
 cms/static/sass/_header.scss                   |   1 -
 cms/static/sass/_static-pages.scss             |   3 +++
 cms/static/sass/_unit.scss                     |   1 +
 cms/static/sass/_users.scss                    |  10 +++-------
 cms/templates/asset_index.html                 |   7 ++++---
 cms/templates/edit-tabs.html                   |   8 ++++----
 cms/templates/manage_users.html                |  13 +++++++------
 11 files changed, 33 insertions(+), 29 deletions(-)
 create mode 100644 cms/static/img/upload-icon.png

diff --git a/cms/static/coffee/src/views/module_edit.coffee b/cms/static/coffee/src/views/module_edit.coffee
index ad875294a1..0617b01bb4 100644
--- a/cms/static/coffee/src/views/module_edit.coffee
+++ b/cms/static/coffee/src/views/module_edit.coffee
@@ -56,6 +56,7 @@ class CMS.Views.ModuleEdit extends Backbone.View
     event.preventDefault()
     data = @module.save()
     data.metadata = @metadata()
+    $modalCover.hide()
     @model.save(data).done( =>
     #   # showToastMessage("Your changes have been saved.", null, 3)
       @module = null
@@ -69,9 +70,11 @@ class CMS.Views.ModuleEdit extends Backbone.View
     event.preventDefault()
     @$el.removeClass('editing')
     @$component_editor().slideUp(150)
+    $modalCover.hide()
 
   clickEditButton: (event) ->
     event.preventDefault()
     @$el.addClass('editing')
+    $modalCover.show()
     @$component_editor().slideDown(150)
     @loadEdit()
diff --git a/cms/static/img/upload-icon.png b/cms/static/img/upload-icon.png
new file mode 100644
index 0000000000000000000000000000000000000000..0a78627f8787dd2b4a3f706e6a0039aff5572199
GIT binary patch
literal 1122
zcmaJ=TSyd97#>^Gl(x2lz@j>g5eDwgW!I@0cH6a`H8&cO-K7kIoSix9pmS;F*p5PJ
zcY6tX47$8@p`b8&DT<=3hp@1umwJej2!fz`2sVoBjJno?HXP>s=kR~u|NWP9vbANK
zzj{?QK@k3QvzWpAO3z+Yf&bSpomcQygHmlMYj&W5Y(t_^HS-Xpb-5E}pse=odkUij
z;ajie+EAOcLr_dTBzry~SGO>lAfj>Cl9g_VKpu8#MvVM&_W=nsHAe1gkZ8$D!Y-}3
z--g-#mYmYxt?()t-vXkpfC+SnWZ>#Oh9kH!a*9{Lws%dDV9Et`$H-|>ZBi>pnl=Ot
zp>R;483u4%h>0|C98(Winqes#FD}SLga%GvH-VXt#L;ZEL&%6tGqLa~Ms^`&2^3W*
z6heh?$h12thUa;YgJpx*Bk1%QNOpsUQ(IyXp`+NEg*4Lu9;2K$dr^$UN~crMtyx;b
znJE)480E?q#e`@trIMp0{ohsBXT2Sifq(VRN$lkMEJ$UbWA@q#Zd^yL7s?WnHk6TR
z=S;JwRK?aV6PZqzX@O*x19g(DXoh#OaS9<xLfUYUY$z}-#z@Q&(lk}zQ*@XS8);S)
zaotlaAKuERQk)o$L>Sxwx`Y)?rB{arDq&TO71_w<#xO&(DW+*otTzn0g(Hj5*7ifS
z$u@N`m9(JEtA$U^uVosm&Y@*G558$$EQQ5TUTgnpb?FMvk7v#fE<VhTJ~Z&W+jy`)
z?0lWTkK$EYY|OcD^2N!?xUa0o|9JFJu_`cGK5?b>esIfy;$pRI;_BqLBcBq_wqJXg
z{k@{{^6C8W_kr=j;LQrE_T@Vz(Q|UNeIYniIS~K{e_V*ttB1~<_8VmraW@jJ$QQst
z@#y;}^pTOOy7HQ93wj6HWyj;kYVMtDPS!NjXV+c)T3>bi(eU!MBLjou+zOv>WOv1m
zujNB)4i%U9_FGGb)(jSzm3N*eey#5KSs8u%=wp7*J3cT<Ua1a(x7CmLrX$65fq@en
h#ug^({aIh2ogl|<eSXn*`?dG#)2SBm#@6=3e*l5Ra9aQX

literal 0
HcmV?d00001

diff --git a/cms/static/sass/_assets.scss b/cms/static/sass/_assets.scss
index 29c3d4000d..23d9ea4d9a 100644
--- a/cms/static/sass/_assets.scss
+++ b/cms/static/sass/_assets.scss
@@ -5,14 +5,6 @@
     background-color: #fff;
   }
 
-  .upload-button {
-    @include blue-button;
-    float: left;
-    margin-right: 20px;
-    padding: 8px 30px 10px;
-    font-size: 12px;
-  }
-
   .asset-library {
     @include clearfix;
 
diff --git a/cms/static/sass/_graphics.scss b/cms/static/sass/_graphics.scss
index 80599f7bc4..4ed22c570d 100644
--- a/cms/static/sass/_graphics.scss
+++ b/cms/static/sass/_graphics.scss
@@ -34,6 +34,14 @@
 	background: url(../img/video-icon.png) no-repeat;
 }
 
+.upload-icon {
+	display: inline-block;
+	width: 22px;
+	height: 13px;
+	margin-right: 5px;
+	background: url(../img/upload-icon.png) no-repeat;
+}
+
 .list-icon {
 	display: inline-block;
 	width: 14px;
diff --git a/cms/static/sass/_header.scss b/cms/static/sass/_header.scss
index 8402fa54be..76add36477 100644
--- a/cms/static/sass/_header.scss
+++ b/cms/static/sass/_header.scss
@@ -5,7 +5,6 @@ body.no-header {
 }
 
 @mixin active {
-	color: $blue;
 	@include linear-gradient(top, rgba(255, 255, 255, .4), rgba(255, 255, 255, 0));
 	background-color: rgba(255, 255, 255, .3);
 	@include box-shadow(0 -1px 0 rgba(0, 0, 0, .2) inset, 0 1px 0 #fff inset);
diff --git a/cms/static/sass/_static-pages.scss b/cms/static/sass/_static-pages.scss
index 78d6ba66d7..9f39d2ad53 100644
--- a/cms/static/sass/_static-pages.scss
+++ b/cms/static/sass/_static-pages.scss
@@ -65,6 +65,9 @@
   }
 
   .component.editing {
+    border-left: 1px solid $mediumGrey;
+    border-right: 1px solid $mediumGrey;
+
     .xmodule_display {
       display: none;
     }
diff --git a/cms/static/sass/_unit.scss b/cms/static/sass/_unit.scss
index 5d117c26c0..a6b9e56c2e 100644
--- a/cms/static/sass/_unit.scss
+++ b/cms/static/sass/_unit.scss
@@ -188,6 +188,7 @@
 
     &.editing {
       border: 1px solid $lightBluishGrey2;
+      z-index: 9999;
 
       .drag-handle,
       .component-actions {
diff --git a/cms/static/sass/_users.scss b/cms/static/sass/_users.scss
index 4daefa55cc..eb48bcd219 100644
--- a/cms/static/sass/_users.scss
+++ b/cms/static/sass/_users.scss
@@ -4,14 +4,10 @@
     padding: 30px 40px;
   }
 
-  .new-user-button {
-    margin-bottom: 15px;
-  }
-
   .new-user-form {
     display: none;
     padding: 15px 20px;
-    background: $mediumGrey;
+    background-color: $lightBluishGrey2;
 
     #result {
       display: none;
@@ -41,12 +37,12 @@
 
     .add-button {
       @include blue-button;
-      padding: 6px 20px 8px;
+      padding: 5px 20px 9px;
     }
 
     .cancel-button {
       @include white-button;
-      padding: 6px 20px 8px;
+      padding: 5px 20px 9px;
     }
   }
 
diff --git a/cms/templates/asset_index.html b/cms/templates/asset_index.html
index 173b751305..ca205157ab 100644
--- a/cms/templates/asset_index.html
+++ b/cms/templates/asset_index.html
@@ -35,10 +35,11 @@
 
   <div class="main-wrapper">
     <div class="inner-wrapper">
-      <h1>Asset Library</h1>
       <div class="page-actions">
-        <a href="#" class="upload-button">Upload New File</a>
-	      <input type="text" class="asset-search-input search wip-box" placeholder="search assets" style="display:none"/>
+        <a href="#" class="upload-button new-button">
+          <span class="upload-icon"></span>Upload New Asset
+        </a>
+        <input type="text" class="asset-search-input search wip-box" placeholder="search assets" style="display:none"/>
       </div>
       <article class="asset-library">
         <table>
diff --git a/cms/templates/edit-tabs.html b/cms/templates/edit-tabs.html
index 637329f356..a48c683db1 100644
--- a/cms/templates/edit-tabs.html
+++ b/cms/templates/edit-tabs.html
@@ -18,10 +18,10 @@
 <div class="main-wrapper">
   <div class="inner-wrapper">
     <div class="page-actions">
-        <a href="#" class="new-button new-tab">
-          <span class="plus-icon white"></span>New Tab
-        </a>
-      </div>
+      <a href="#" class="new-button new-tab">
+        <span class="plus-icon white"></span>New Tab
+      </a>
+    </div>
     <article class="unit-body">
       <div class="details">
         <p>Here you can add and manage additional pages for your course. These pages will be added to the primary navigation menu alongside Courseware, Course Info, Discussion, etc.</p>
diff --git a/cms/templates/manage_users.html b/cms/templates/manage_users.html
index 6f33b67d41..d8266f0622 100644
--- a/cms/templates/manage_users.html
+++ b/cms/templates/manage_users.html
@@ -5,17 +5,18 @@
 <%block name="content">
 <div class="main-wrapper">
   <div class="inner-wrapper">
-    <h1>Users</h1>
-
-    <article class="user-overview">
-      <div class="details">
-        <p>The following list of users have been designated as course staff. This means that these users will have permissions to modify course content. You may add additional course staff below, if you are the course instructor. Please note that they must have already registered and verified their account.</p>
-      </div>
+    <div class="page-actions">
       %if allow_actions:
       <a href="#" class="new-button new-user-button">
         <span class="plus-icon white"></span>New User
       </a>
       %endif
+    </div>
+
+    <article class="user-overview">
+      <div class="details">
+        <p>The following list of users have been designated as course staff. This means that these users will have permissions to modify course content. You may add additional course staff below, if you are the course instructor. Please note that they must have already registered and verified their account.</p>
+      </div>      
       %if allow_actions:
       <form class="new-user-form">
         <div id="result"></div>

From 2be1f852e714fa28abb0dfdd22981fbed8711cd8 Mon Sep 17 00:00:00 2001
From: Tom Giannattasio <tom@mitx.mit.edu>
Date: Fri, 7 Dec 2012 15:37:22 -0500
Subject: [PATCH 27/43] clean up of users page

---
 cms/static/coffee/src/views/tabs.coffee |  4 ++++
 cms/static/sass/_base.scss              |  2 +-
 cms/static/sass/_static-pages.scss      |  5 +++++
 cms/static/sass/_users.scss             | 22 ++++++++++++----------
 cms/static/sass/_variables.scss         |  1 +
 cms/templates/edit-tabs.html            |  2 +-
 cms/templates/import.html               |  1 -
 cms/templates/manage_users.html         |  9 +++++----
 cms/templates/widgets/header.html       |  2 +-
 9 files changed, 30 insertions(+), 18 deletions(-)

diff --git a/cms/static/coffee/src/views/tabs.coffee b/cms/static/coffee/src/views/tabs.coffee
index 34d86a3051..1fbc6ffa7f 100644
--- a/cms/static/coffee/src/views/tabs.coffee
+++ b/cms/static/coffee/src/views/tabs.coffee
@@ -33,6 +33,10 @@ class CMS.Views.TabsEdit extends Backbone.View
     )
 
     $('.new-component-item').before(editor.$el)
+    editor.$el.addClass('new')
+    setTimeout(=>
+      editor.$el.removeClass('new')
+    , 500)
 
     editor.cloneTemplate(
       @model.get('id'),
diff --git a/cms/static/sass/_base.scss b/cms/static/sass/_base.scss
index 3c2d134919..e09c7fdd54 100644
--- a/cms/static/sass/_base.scss
+++ b/cms/static/sass/_base.scss
@@ -196,7 +196,7 @@ code {
     h4 {
         padding: 6px 14px;
         border-bottom: 1px solid $mediumGrey;
-        border-radius: 3px 3px 0 0;
+        border-radius: 2px 2px 0 0;
         @include linear-gradient(top, rgba(255, 255, 255, .4), rgba(255, 255, 255, 0));
         background-color: $lightBluishGrey;
         @include box-shadow(0 1px 0 rgba(255, 255, 255, 0.2) inset);
diff --git a/cms/static/sass/_static-pages.scss b/cms/static/sass/_static-pages.scss
index 9f39d2ad53..e6d8ef0e58 100644
--- a/cms/static/sass/_static-pages.scss
+++ b/cms/static/sass/_static-pages.scss
@@ -73,11 +73,16 @@
     }
   }
 
+  .new .xmodule_display {
+    background: $yellow;
+  }
+
   .xmodule_display {
     padding: 20px 20px 22px;
     font-size: 24px;
     font-weight: 300;
     background: #fff;
+    @include transition(background-color 3s);
   }
 
   .static-page-item {
diff --git a/cms/static/sass/_users.scss b/cms/static/sass/_users.scss
index eb48bcd219..e107bdbb6d 100644
--- a/cms/static/sass/_users.scss
+++ b/cms/static/sass/_users.scss
@@ -1,9 +1,4 @@
 .users {
-  .user-overview {
-    @extend .window;
-    padding: 30px 40px;
-  }
-
   .new-user-form {
     display: none;
     padding: 15px 20px;
@@ -48,11 +43,11 @@
 
   .user-list {
     border: 1px solid $mediumGrey;
-    background: $lightGrey;
+    background: #fff;
 
     li {
       position: relative;
-      padding: 10px 20px;
+      padding: 20px;
       border-bottom: 1px solid $mediumGrey;
 
       &:last-child {
@@ -64,12 +59,19 @@
       }
 
       .user-name {
-        width: 30%;
-        font-weight: 700;
+        margin-right: 10px;
+        font-size: 24px;
+        font-weight: 300;
+      }
+
+      .user-email {
+        font-size: 14px;
+        font-style: italic;
+        color: $mediumGrey;
       }
 
       .item-actions {
-        top: 9px;
+        top: 24px;
       }
     }
   }
diff --git a/cms/static/sass/_variables.scss b/cms/static/sass/_variables.scss
index d556ca87a9..10c31c3a21 100644
--- a/cms/static/sass/_variables.scss
+++ b/cms/static/sass/_variables.scss
@@ -24,6 +24,7 @@ $mediumGrey: #b0b6c2;
 $darkGrey: #8891a1;
 $extraDarkGrey: #3d4043;
 $paleYellow: #fffcf1;
+$yellow: rgb(255, 254, 223);
 $green: rgb(37, 184, 90);
 $brightGreen: rgb(22, 202, 87);
 $disabledGreen: rgb(124, 206, 153);
diff --git a/cms/templates/edit-tabs.html b/cms/templates/edit-tabs.html
index a48c683db1..16bca8568b 100644
--- a/cms/templates/edit-tabs.html
+++ b/cms/templates/edit-tabs.html
@@ -19,7 +19,7 @@
   <div class="inner-wrapper">
     <div class="page-actions">
       <a href="#" class="new-button new-tab">
-        <span class="plus-icon white"></span>New Tab
+        <span class="plus-icon white"></span>New Page
       </a>
     </div>
     <article class="unit-body">
diff --git a/cms/templates/import.html b/cms/templates/import.html
index 18d9a1604d..e4f8019714 100644
--- a/cms/templates/import.html
+++ b/cms/templates/import.html
@@ -8,7 +8,6 @@
 <%block name="content">
 <div class="main-wrapper">
   <div class="inner-wrapper">
-    <h1>Import</h1>
     <article class="import-overview">
       <div class="description">
         <h2>Please <a href="https://edge.edx.org/courses/edX/edx101/edX_Studio_Reference/about" target="_blank">read the documentation</a> before attempting an import!</h2>
diff --git a/cms/templates/manage_users.html b/cms/templates/manage_users.html
index d8266f0622..36930f5386 100644
--- a/cms/templates/manage_users.html
+++ b/cms/templates/manage_users.html
@@ -13,10 +13,11 @@
       %endif
     </div>
 
-    <article class="user-overview">
-      <div class="details">
-        <p>The following list of users have been designated as course staff. This means that these users will have permissions to modify course content. You may add additional course staff below, if you are the course instructor. Please note that they must have already registered and verified their account.</p>
-      </div>      
+    <div class="details">
+      <p>The following list of users have been designated as course staff. This means that these users will have permissions to modify course content. You may add additional course staff below, if you are the course instructor. Please note that they must have already registered and verified their account.</p>
+    </div>
+
+    <article class="user-overview">           
       %if allow_actions:
       <form class="new-user-form">
         <div id="result"></div>
diff --git a/cms/templates/widgets/header.html b/cms/templates/widgets/header.html
index c6e28f9c29..ac1379ebe8 100644
--- a/cms/templates/widgets/header.html
+++ b/cms/templates/widgets/header.html
@@ -27,7 +27,7 @@
     <% ctx_loc = context_course.location %>
     <ul class="class-nav inner-wrapper">
       <li><a href="${reverse('course_index', kwargs=dict(org=ctx_loc.org, course=ctx_loc.course, name=ctx_loc.name))}" id='courseware-tab'>Courseware</a></li>
-      <li><a href="${reverse('edit_tabs', kwargs=dict(org=ctx_loc.org, course=ctx_loc.course, coursename=ctx_loc.name))}" id='pages-tab'>Tabs</a></li>
+      <li><a href="${reverse('edit_tabs', kwargs=dict(org=ctx_loc.org, course=ctx_loc.course, coursename=ctx_loc.name))}" id='pages-tab'>Pages</a></li>
       <li><a href="${reverse('asset_index', kwargs=dict(org=ctx_loc.org, course=ctx_loc.course, name=ctx_loc.name))}" id='assets-tab'>Assets</a></li>
       <li><a href="${reverse('course_settings', kwargs=dict(org=ctx_loc.org, course=ctx_loc.course, name=ctx_loc.name))}" id='settings-tab'>Settings</a></li>
       <li><a href="${reverse('import_course', kwargs=dict(org=ctx_loc.org, course=ctx_loc.course, name=ctx_loc.name))}" id='import-tab'>Import</a></li>

From 9f863fd96ed4de61cbf4ef5ea06e3400169c388a Mon Sep 17 00:00:00 2001
From: Brian Talbot <btalbot@edx.org>
Date: Thu, 13 Dec 2012 11:37:51 -0500
Subject: [PATCH 28/43] styling - adjusting collapse button CSS lost in
 cms-master rebase

---
 cms/static/sass/_courseware.scss | 7 +++++++
 1 file changed, 7 insertions(+)

diff --git a/cms/static/sass/_courseware.scss b/cms/static/sass/_courseware.scss
index ef4ddb7755..f7a3e0d447 100644
--- a/cms/static/sass/_courseware.scss
+++ b/cms/static/sass/_courseware.scss
@@ -291,4 +291,11 @@ input.courseware-unit-search-input {
 	.cancel-button {
 		font-size: 16px;
 	}
+}
+
+.collapse-all-button {
+	float: right;
+	margin-top: 10px;
+	font-size: 13px;
+	color: $darkGrey;
 }
\ No newline at end of file

From 9b9bdb44a3daa72b0ce042f301975b76e9676bdb Mon Sep 17 00:00:00 2001
From: Don Mitchell <dmitchell@edx.org>
Date: Thu, 13 Dec 2012 12:58:59 -0500
Subject: [PATCH 29/43] Fix video string parse for empty and completely
 malformed strings

---
 cms/static/js/models/settings/course_details.js | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/cms/static/js/models/settings/course_details.js b/cms/static/js/models/settings/course_details.js
index 222d2fd11e..de4831e186 100644
--- a/cms/static/js/models/settings/course_details.js
+++ b/cms/static/js/models/settings/course_details.js
@@ -56,6 +56,7 @@ CMS.Models.Settings.CourseDetails = Backbone.Model.extend({
 			for (var i=0; i<videos.length; i++) {
 				// doesn't call parseFloat or Number b/c they stop on first non parsable and return what they have
 				if (!isFinite(videos[i].speed)) vid_errors.push(videos[i].speed + " is not a valid speed.");
+				else if (!videos[i].key) vid_errors.push(videos[i].speed + " does not have a video id");
 				// can't use get from client to test if video exists b/c of CORS (crossbrowser get not allowed)
 				// GET "http://gdata.youtube.com/feeds/api/videos/" + videokey
 			}
@@ -76,7 +77,7 @@ CMS.Models.Settings.CourseDetails = Backbone.Model.extend({
 	// the below is lax to enable validation
 	_videospeedparse : /[^:]*/g, // /\d+\.?\d*(?=:)/g,
 	_videokeyparse : /([^,\/]+)/g,
-	_videonosuffix : /[^\"]+/g,
+	_videonosuffix : /[^\"\/\>]+/g,
 	_getNextMatch : function (regex, string, cursor) {
 		regex.lastIndex = cursor;
 		var result = regex.exec(string);
@@ -141,12 +142,13 @@ CMS.Models.Settings.CourseDetails = Backbone.Model.extend({
 		cursor = 0;
 		// parsed to "fff:kkk,fff:kkk"
 		var result = new Array();
+		if (!videostring || videostring.length == 0) return result;
 		while (cursor < videostring.length) {
 			var speed = this._getNextMatch(this._videospeedparse, videostring, cursor);
 			if (speed) cursor = this._videospeedparse.lastIndex + 1;
 			else return result;
 			var key = this._getNextMatch(this._videokeyparse, videostring, cursor);
-			cursor = this._videokeyparse.lastIndex + 1;
+			if (key) cursor = this._videokeyparse.lastIndex + 1;
 			// See the WTF above
 			if (_.isArray(key)) key = key[0];
 			result.push({speed: speed, key: key});

From 69c26a08e3a1fa5eb9d796fb44a6c41ac76677db Mon Sep 17 00:00:00 2001
From: Brian Talbot <btalbot@edx.org>
Date: Thu, 13 Dec 2012 13:06:56 -0500
Subject: [PATCH 30/43] settings/style - general UI clean up - wip

---
 cms/djangoapps/contentstore/views.py          |  2 +-
 .../client_templates/course_grade_policy.html |  4 ++--
 cms/static/sass/_base.scss                    | 12 ++++++++---
 cms/static/sass/_header.scss                  |  8 ++++++++
 cms/static/sass/_settings.scss                | 20 ++++++++++---------
 cms/static/sass/_variables.scss               |  4 +++-
 cms/templates/settings.html                   | 12 +++++------
 7 files changed, 40 insertions(+), 22 deletions(-)

diff --git a/cms/djangoapps/contentstore/views.py b/cms/djangoapps/contentstore/views.py
index d2f19802af..017b6a963d 100644
--- a/cms/djangoapps/contentstore/views.py
+++ b/cms/djangoapps/contentstore/views.py
@@ -995,7 +995,7 @@ def get_course_settings(request, org, course, name):
     course_details = CourseDetails.fetch(location)
     
     return render_to_response('settings.html', {
-        'active_tab': 'settings-tab', 
+        'active_tab': 'settings', 
         'context_course': course_module,
         'course_details' : json.dumps(course_details, cls=CourseSettingsEncoder)
     })
diff --git a/cms/static/client_templates/course_grade_policy.html b/cms/static/client_templates/course_grade_policy.html
index 97b0c20eb8..92fc32c2d8 100644
--- a/cms/static/client_templates/course_grade_policy.html
+++ b/cms/static/client_templates/course_grade_policy.html
@@ -64,6 +64,6 @@
                     <span class="tip tip-inline">total exercises that won't be graded</span>
 			</div>
 		</div>
-	</div> <a href="#" class="remove-item remove-grading-data"><span
-		class="delete-icon"></span> Delete Assignment Type</a>
+	</div>		
+		<a href="#" class="delete-button remove-item remove-grading-data"><span class="delete-icon"></span>Delete</a>
 </li>
diff --git a/cms/static/sass/_base.scss b/cms/static/sass/_base.scss
index e09c7fdd54..8e6ceaa10a 100644
--- a/cms/static/sass/_base.scss
+++ b/cms/static/sass/_base.scss
@@ -77,13 +77,14 @@ footer {
 
 input[type="text"],
 input[type="email"],
-input[type="password"] {
+input[type="password"],
+textarea.text {
     padding: 6px 8px 8px;
     @include box-sizing(border-box);
     border: 1px solid $mediumGrey;
     border-radius: 2px;
-    @include linear-gradient(top, rgba(255, 255, 255, 0), rgba(255, 255, 255, .3));
-    background-color: #edf1f5;
+    @include linear-gradient($lightGrey, tint($lightGrey, 90%));
+    background-color: $lightGrey;
     @include box-shadow(0 1px 2px rgba(0, 0, 0, .1) inset);
     font-family: 'Open Sans', sans-serif;
     font-size: 11px;
@@ -95,6 +96,11 @@ input[type="password"] {
     &:-ms-input-placeholder {
         color: #979faf;
     }
+
+    &:focus {
+      @include linear-gradient($paleYellow, tint($paleYellow, 90%));
+      outline: 0;
+    }
 }
 
 input.search {
diff --git a/cms/static/sass/_header.scss b/cms/static/sass/_header.scss
index 76add36477..8ca39b9b84 100644
--- a/cms/static/sass/_header.scss
+++ b/cms/static/sass/_header.scss
@@ -31,10 +31,18 @@ body.no-header {
 		@include active;
 	}
 
+	&.active-tab-settings #settings-tab {
+		@include active;
+	}
+
 	&.active-tab-import #import-tab {
 		@include active;
 	}
 
+	&.active-tab-export #export-tab {
+		@include active;
+	}
+
 	.drop-icon {
 		margin-left: 5px;
 		font-size: 11px;
diff --git a/cms/static/sass/_settings.scss b/cms/static/sass/_settings.scss
index 3f1106584a..34721ed2c4 100644
--- a/cms/static/sass/_settings.scss
+++ b/cms/static/sass/_settings.scss
@@ -144,19 +144,21 @@
         min-width: 75px !important;
       }
 
-      &:focus {
-        @include linear-gradient(tint($blue, 80%), tint($blue, 90%));
-        border-color: $blue;
-        outline: 0;
-      }
-
       &:disabled {
-        border-color: $mediumGrey;
-        color: $mediumGrey;
+        border: none;
+        @include box-shadow(none);
+        padding: 0;
+        color: $darkGrey;
+        font-weight: bold;
         background: #fff;
       }
     }
 
+    textarea.tinymce {
+      border: 1px solid $darkGrey;
+      height: 300px;
+    }
+
     input[type="checkbox"], input[type="radio"] {
 
     }
@@ -241,7 +243,7 @@
           &.multi {
             display: block;
             background: tint($lightGrey, 50%);
-            padding: 20px 15px;
+            padding: 20px;
             @include border-radius(4px);
             @include box-sizing(border-box);
 
diff --git a/cms/static/sass/_variables.scss b/cms/static/sass/_variables.scss
index 10c31c3a21..95ee847b5c 100644
--- a/cms/static/sass/_variables.scss
+++ b/cms/static/sass/_variables.scss
@@ -13,8 +13,10 @@ $body-line-height: golden-ratio(.875em, 1);
 $pink: rgb(182,37,104);
 $error-red: rgb(253, 87, 87);
 
-$offBlack: #3c3c3c;
 $baseFontColor: #3c3c3c;
+$offBlack: #3c3c3c;
+$black: rgb(0,0,0);
+$white: rgb(255,255,255);
 $blue: #5597dd;
 $orange: #edbd3c;
 $red: #b20610;
diff --git a/cms/templates/settings.html b/cms/templates/settings.html
index 559df38cf4..2498d31a7d 100644
--- a/cms/templates/settings.html
+++ b/cms/templates/settings.html
@@ -93,7 +93,6 @@ from contentstore import utils
                 <div class="field">
                   <div class="input">
                     <input type="text" class="short" id="course-number" value="[Course No.]" disabled="disabled">
-                    <span class="tip tip-inline">e.g. 101x</span>
                     <span class="tip tip-stacked">This is used in <a href="${utils.get_lms_link_for_item(context_course.location, True)}">your course URL</a>, and cannot be changed</span>
                   </div>
                 </div>
@@ -231,8 +230,8 @@ from contentstore import utils
                   </div>
 
                   <div class="input">
-                    <input type="text" class="new-item new-course-introduction-video add-video-data" id="course-introduction-video" value="" placeholder="speed:id,speed:id" autocomplete="off">
-                    <span class="tip tip-inline">Video restrictions go here</span>          
+                    <input type="text" class="long new-course-introduction-video add-video-data" id="course-introduction-video" value="" placeholder="speed:id,speed:id" autocomplete="off">
+                    <span class="tip tip-stacked">Video restrictions go here</span>
                   </div>
                 </div>
               </div>
@@ -251,7 +250,7 @@ from contentstore import utils
                 <div class="field">
                   <div class="input">
                     <input type="text" class="short time" id="course-effort" placeholder="HH:MM">
-                    <span class="tip tip-stacked">Time students should spend on all course work</span>
+                    <span class="tip tip-stacked">Time spent on all course work</span>
                   </div>
                 </div>
               </div>
@@ -421,8 +420,8 @@ from contentstore import utils
                   <ul class="input-list course-grading-assignment-list">
                   </ul>
 
-                  <a href="#" class="new-item new-course-grading-item add-grading-data">
-                    <span class="plus-icon"></span>New Assignment Type
+                  <a href="#" class="new-button new-course-grading-item add-grading-data">
+                    <span class="plus-icon white"></span>New Assignment Type
                   </a>
                   </div>
                 </div>
@@ -727,4 +726,5 @@ from contentstore import utils
       </article>
     </div>
   </div>
+  <footer></footer>
 </%block>

From 3b784f21456242ebd3e67f284111a26c81b2edb7 Mon Sep 17 00:00:00 2001
From: Brian Talbot <btalbot@edx.org>
Date: Thu, 13 Dec 2012 13:21:43 -0500
Subject: [PATCH 31/43] styling - setting form field layout

---
 cms/static/sass/_settings.scss | 1 -
 cms/templates/settings.html    | 4 ++--
 2 files changed, 2 insertions(+), 3 deletions(-)

diff --git a/cms/static/sass/_settings.scss b/cms/static/sass/_settings.scss
index 34721ed2c4..c753d6e85f 100644
--- a/cms/static/sass/_settings.scss
+++ b/cms/static/sass/_settings.scss
@@ -139,7 +139,6 @@
       }
 
       &.time {
-        display: block !important;
         width: 75px !important;
         min-width: 75px !important;
       }
diff --git a/cms/templates/settings.html b/cms/templates/settings.html
index 2498d31a7d..050eba6957 100644
--- a/cms/templates/settings.html
+++ b/cms/templates/settings.html
@@ -250,7 +250,7 @@ from contentstore import utils
                 <div class="field">
                   <div class="input">
                     <input type="text" class="short time" id="course-effort" placeholder="HH:MM">
-                    <span class="tip tip-stacked">Time spent on all course work</span>
+                    <span class="tip tip-inline">Time spent on all course work</span>
                   </div>
                 </div>
               </div>
@@ -404,7 +404,7 @@ from contentstore import utils
                 <div class="field">
                   <div class="input">
                     <input type="text" class="short time" id="course-grading-graceperiod" value="0:00" placeholder="e.g. 10 minutes">
-                    <span class="tip tip-stacked">leeway on due dates</span>
+                    <span class="tip tip-inline">leeway on due dates</span>
                   </div>
                 </div>
               </div>

From 6b17659195154b0ff4a55002bc830c1c8be0b819 Mon Sep 17 00:00:00 2001
From: Brian Talbot <btalbot@edx.org>
Date: Thu, 13 Dec 2012 13:35:58 -0500
Subject: [PATCH 32/43] styling - settings layout and delete buttons

---
 .../client_templates/course_grade_policy.html |  2 +-
 cms/static/sass/_settings.scss                | 28 +++----------------
 2 files changed, 5 insertions(+), 25 deletions(-)

diff --git a/cms/static/client_templates/course_grade_policy.html b/cms/static/client_templates/course_grade_policy.html
index 92fc32c2d8..c9a21280dd 100644
--- a/cms/static/client_templates/course_grade_policy.html
+++ b/cms/static/client_templates/course_grade_policy.html
@@ -65,5 +65,5 @@
 			</div>
 		</div>
 	</div>		
-		<a href="#" class="delete-button remove-item remove-grading-data"><span class="delete-icon"></span>Delete</a>
+		<a href="#" class="delete-button standard remove-item remove-grading-data"><span class="delete-icon"></span>Delete</a>
 </li>
diff --git a/cms/static/sass/_settings.scss b/cms/static/sass/_settings.scss
index c753d6e85f..6a31f7ec64 100644
--- a/cms/static/sass/_settings.scss
+++ b/cms/static/sass/_settings.scss
@@ -147,7 +147,7 @@
         border: none;
         @include box-shadow(none);
         padding: 0;
-        color: $darkGrey;
+        color: $darkGrey !important;
         font-weight: bold;
         background: #fff;
       }
@@ -291,10 +291,6 @@
                 width: 100%;
               }
             }
-
-            .remove-item {
-              float: right;
-            }       
           }
         }
 
@@ -305,6 +301,7 @@
             margin-bottom: 15px;
             padding-bottom: 15px;
             border-bottom: 1px dotted $lightGrey;
+            @include clearfix();
 
             &:last-child {
               border: 0;
@@ -393,20 +390,8 @@
 
 
     // editing controls - removing
-    .remove-item {
-      clear: both;
-      display: block;
-      margin-top: 10px;
-      opacity: 0.75;
-      font-size: 13px;
-      text-align: right;
-      @include transition(opacity 0.25s ease-in-out);
-
-
-      &:hover {
-        color: $blue;
-        opacity: 0.99;
-      }
+    .delete-button {
+      float: right;
     }
 
     // editing controls - preview
@@ -500,11 +485,6 @@
 
       .course-grading-assignment-list-item {
 
-        .row:nth-child(4) {
-          border: none;
-          margin-bottom: 0;
-          padding-bottom: 0;
-        }
       }
 
       .input-list {

From 34441759dd1019ba56ea753253194a92c902380a Mon Sep 17 00:00:00 2001
From: Brian Talbot <btalbot@edx.org>
Date: Thu, 13 Dec 2012 13:44:03 -0500
Subject: [PATCH 33/43] settings - added in preventDefault() for all grading
 controls that needed it

---
 cms/static/js/views/settings/main_settings_view.js | 8 ++++++--
 1 file changed, 6 insertions(+), 2 deletions(-)

diff --git a/cms/static/js/views/settings/main_settings_view.js b/cms/static/js/views/settings/main_settings_view.js
index db347bae82..09d68684b4 100644
--- a/cms/static/js/views/settings/main_settings_view.js
+++ b/cms/static/js/views/settings/main_settings_view.js
@@ -356,7 +356,8 @@ CMS.Views.Settings.Grading = CMS.Views.ValidatingView.extend({
 		
 		return this;
 	},
-	addAssignmentType : function() {
+	addAssignmentType : function(e) {
+		e.preventDefault();
 		this.model.get('graders').push({});
 	},
 	fieldToSelectorMap : {
@@ -503,6 +504,7 @@ CMS.Views.Settings.Grading = CMS.Views.ValidatingView.extend({
 	},
 	
 	addNewGrade: function(e) {
+		e.preventDefault();
 		var gradeLength = this.descendingCutoffs.length; // cutoffs doesn't include fail/f so this is only the passing grades
 		if(gradeLength > 3) {
 			// TODO shouldn't we disable the button
@@ -541,6 +543,7 @@ CMS.Views.Settings.Grading = CMS.Views.ValidatingView.extend({
 	},
 	
 	removeGrade: function(e) {
+		e.preventDefault();
 		var domElement = $(e.currentTarget).closest('li');
 		var index = domElement.index();
 		// copy the boundary up to the next higher grade then remove
@@ -614,8 +617,9 @@ CMS.Views.Settings.GraderView = CMS.Views.ValidatingView.extend({
 			
 		}
 	},
-	deleteModel : function() {
+	deleteModel : function(e) {
 		this.model.destroy();
+		e.preventDefault();
 	}
 	
 });
\ No newline at end of file

From f33efe3dde7d1b6066e7020875aecf689a51515a Mon Sep 17 00:00:00 2001
From: Brian Talbot <btalbot@edx.org>
Date: Thu, 13 Dec 2012 13:45:57 -0500
Subject: [PATCH 34/43] settings - debugged height issue with new/manipulated
 grade bars and moved solution back to CSS layer

---
 cms/static/js/views/settings/main_settings_view.js | 2 --
 cms/static/sass/_settings.scss                     | 2 +-
 2 files changed, 1 insertion(+), 3 deletions(-)

diff --git a/cms/static/js/views/settings/main_settings_view.js b/cms/static/js/views/settings/main_settings_view.js
index 09d68684b4..e31f4b4f41 100644
--- a/cms/static/js/views/settings/main_settings_view.js
+++ b/cms/static/js/views/settings/main_settings_view.js
@@ -462,7 +462,6 @@ CMS.Views.Settings.Grading = CMS.Views.ValidatingView.extend({
 		// 0th ele doesn't have a bar; so, will never invoke this
 		var cachethis = this;
 		return function(event, ui) {
-			ui.element.height("50px");
 			var barIndex = ui.element.index();
 			// min and max represent limits not labels (note, can's make smaller than 3 points wide)
 			var min = (barIndex < cachethis.descendingCutoffs.length ? cachethis.descendingCutoffs[barIndex]['cutoff'] + 3 : 3);
@@ -488,7 +487,6 @@ CMS.Views.Settings.Grading = CMS.Views.ValidatingView.extend({
 		var cachethis = this;
 		return function(event, ui) {
 			// for some reason the resize is setting height to 0
-			ui.element.height("50px");
 			cachethis.saveCutoffs();
 		}
 	},
diff --git a/cms/static/sass/_settings.scss b/cms/static/sass/_settings.scss
index 6a31f7ec64..8420e033d0 100644
--- a/cms/static/sass/_settings.scss
+++ b/cms/static/sass/_settings.scss
@@ -699,7 +699,7 @@
       }
       
       .grade-specific-bar {
-        height: 50px;
+        height: 50px !important;
       }
 
       .grades {

From 090e83b709337d83d69c5e79ce1288887142ac0a Mon Sep 17 00:00:00 2001
From: Brian Talbot <btalbot@edx.org>
Date: Thu, 13 Dec 2012 14:16:51 -0500
Subject: [PATCH 35/43] styling - resolved FF top whitespace bug

---
 cms/static/sass/_header.scss | 1 +
 1 file changed, 1 insertion(+)

diff --git a/cms/static/sass/_header.scss b/cms/static/sass/_header.scss
index 8ca39b9b84..e031e16f50 100644
--- a/cms/static/sass/_header.scss
+++ b/cms/static/sass/_header.scss
@@ -83,6 +83,7 @@ body.no-header {
 
 	.class {
 		@include clearfix;
+		height: 100%;
 		font-size: 12px;
 		color: rgb(163, 171, 184);
 		@include linear-gradient(top, rgba(255, 255, 255, 0), rgba(255, 255, 255, .1));

From 25249929657b2486131d6dad8f74a87cbbfce0a7 Mon Sep 17 00:00:00 2001
From: Brian Talbot <btalbot@edx.org>
Date: Thu, 13 Dec 2012 14:24:09 -0500
Subject: [PATCH 36/43] styling - settings UI tweaks

---
 cms/static/sass/_settings.scss | 11 +++++++++--
 1 file changed, 9 insertions(+), 2 deletions(-)

diff --git a/cms/static/sass/_settings.scss b/cms/static/sass/_settings.scss
index 8420e033d0..b11378145b 100644
--- a/cms/static/sass/_settings.scss
+++ b/cms/static/sass/_settings.scss
@@ -139,8 +139,8 @@
       }
 
       &.time {
-        width: 75px !important;
-        min-width: 75px !important;
+        width: 85px !important;
+        min-width: 85px !important;
       }
 
       &:disabled {
@@ -483,6 +483,13 @@
 
     .settings-grading {
 
+      .setting-grading-assignment-types {
+
+        .row .field.enum {
+          width: 684px;
+        }
+      }
+
       .course-grading-assignment-list-item {
 
       }

From 15942aae0513e40afec88df4832fce91e8be8a5d Mon Sep 17 00:00:00 2001
From: Brian Talbot <btalbot@edx.org>
Date: Thu, 13 Dec 2012 15:02:38 -0500
Subject: [PATCH 37/43] styling - re-aligned unit edit controls and added
 visual divider

---
 cms/static/sass/_unit.scss | 19 +++++++++++++++++++
 1 file changed, 19 insertions(+)

diff --git a/cms/static/sass/_unit.scss b/cms/static/sass/_unit.scss
index a6b9e56c2e..0fb9e9b75d 100644
--- a/cms/static/sass/_unit.scss
+++ b/cms/static/sass/_unit.scss
@@ -463,3 +463,22 @@
     display: none;
   }
 }
+
+// editing units from courseware
+body.unit {
+
+  .component {
+      padding-top: 30px;
+
+      .component-actions {
+        @include box-sizing(border-box);
+        position: absolute;
+        width: 811px;
+        padding: 15px;
+        top: 0;
+        left: 0;
+        border-bottom: 1px solid $lightBluishGrey2;
+        background: $lightGrey;
+      }
+    }
+}

From 59f1b1d1f56735450b60885a788115882431d946 Mon Sep 17 00:00:00 2001
From: Brian Talbot <btalbot@edx.org>
Date: Thu, 13 Dec 2012 15:15:30 -0500
Subject: [PATCH 38/43] styling - re-aligned unit controls for unit editing and
 styled standard delete button

---
 cms/static/sass/_base.scss | 7 +++++++
 1 file changed, 7 insertions(+)

diff --git a/cms/static/sass/_base.scss b/cms/static/sass/_base.scss
index 8e6ceaa10a..92cde28756 100644
--- a/cms/static/sass/_base.scss
+++ b/cms/static/sass/_base.scss
@@ -384,6 +384,13 @@ body.show-wip {
   }
 }
 
+.delete-button.standard {
+
+    &:hover {
+      background-color: tint($orange, 75%);
+    }
+}
+
 .tooltip {
   position: absolute;
   top: 0;

From fb47f30918135c8139582a852bc23befd4d3323c Mon Sep 17 00:00:00 2001
From: Brian Talbot <btalbot@edx.org>
Date: Thu, 13 Dec 2012 15:48:39 -0500
Subject: [PATCH 39/43] bug - removed placeholdit image references in template
 HTML

---
 cms/templates/settings.html                 | 1 -
 cms/templates/widgets/video-box-unused.html | 2 +-
 cms/templates/widgets/video-box.html        | 2 +-
 3 files changed, 2 insertions(+), 3 deletions(-)

diff --git a/cms/templates/settings.html b/cms/templates/settings.html
index 050eba6957..0c2e5f6be8 100644
--- a/cms/templates/settings.html
+++ b/cms/templates/settings.html
@@ -289,7 +289,6 @@ from contentstore import utils
                         <div class="field">
                           <div class="input input-existing">
                             <div class="current current-faculty-1-photo">
-                              <img src="http://placehold.it/400x300&text=Faculty+Photo" alt="Faculty Photo" />
                               <a href="#" class="remove-item remove-faculty-photo remove-video-data"><span class="delete-icon"></span> Delete Faculty Photo</a>
                             </div>
                           </div>
diff --git a/cms/templates/widgets/video-box-unused.html b/cms/templates/widgets/video-box-unused.html
index 3d643ff3c9..1ef7f2250d 100644
--- a/cms/templates/widgets/video-box-unused.html
+++ b/cms/templates/widgets/video-box-unused.html
@@ -1,6 +1,6 @@
 <li class="video-box">
 
-  <div class="thumb"><img src="http://placehold.it/100x65" /></div>
+  <div class="thumb"></div>
 
   <div class="meta">
     <strong>video-name</strong> 236mb Uploaded 6 hours ago by <em>Anant Agrawal</em>
diff --git a/cms/templates/widgets/video-box.html b/cms/templates/widgets/video-box.html
index 1f17e33511..60133bedfb 100644
--- a/cms/templates/widgets/video-box.html
+++ b/cms/templates/widgets/video-box.html
@@ -1,5 +1,5 @@
 <li class="video-box">
-  <div class="thumb"><img src="http://placehold.it/155x90" /></div>
+  <div class="thumb"></div>
 
   <div class="meta">
     <strong>video-name</strong> 236mb

From bb3b7cb3a9491147fb210de83681173a5b24e0f6 Mon Sep 17 00:00:00 2001
From: Chris Dodge <cdodge@edx.org>
Date: Thu, 13 Dec 2012 16:28:47 -0500
Subject: [PATCH 40/43] add back the course info tab in the CMS

---
 cms/templates/widgets/header.html | 1 +
 1 file changed, 1 insertion(+)

diff --git a/cms/templates/widgets/header.html b/cms/templates/widgets/header.html
index ac1379ebe8..922925860e 100644
--- a/cms/templates/widgets/header.html
+++ b/cms/templates/widgets/header.html
@@ -27,6 +27,7 @@
     <% ctx_loc = context_course.location %>
     <ul class="class-nav inner-wrapper">
       <li><a href="${reverse('course_index', kwargs=dict(org=ctx_loc.org, course=ctx_loc.course, name=ctx_loc.name))}" id='courseware-tab'>Courseware</a></li>
+      <li><a href="${reverse('course_info', kwargs=dict(org=ctx_loc.org, course=ctx_loc.course, name=ctx_loc.name))}" id='courseinfo-tab'>Course Info</a></li>
       <li><a href="${reverse('edit_tabs', kwargs=dict(org=ctx_loc.org, course=ctx_loc.course, coursename=ctx_loc.name))}" id='pages-tab'>Pages</a></li>
       <li><a href="${reverse('asset_index', kwargs=dict(org=ctx_loc.org, course=ctx_loc.course, name=ctx_loc.name))}" id='assets-tab'>Assets</a></li>
       <li><a href="${reverse('course_settings', kwargs=dict(org=ctx_loc.org, course=ctx_loc.course, name=ctx_loc.name))}" id='settings-tab'>Settings</a></li>

From e2918c2dbd3fa8cdb57e776b2c1f77c12b430060 Mon Sep 17 00:00:00 2001
From: Don Mitchell <dmitchell@edx.org>
Date: Thu, 13 Dec 2012 17:23:40 -0500
Subject: [PATCH 41/43] Don't save null about items to db as it chokes lms.

---
 cms/djangoapps/contentstore/utils.py             | 9 +++++++++
 cms/djangoapps/models/settings/course_details.py | 9 +++++----
 2 files changed, 14 insertions(+), 4 deletions(-)

diff --git a/cms/djangoapps/contentstore/utils.py b/cms/djangoapps/contentstore/utils.py
index 62c46cc9d4..6343098554 100644
--- a/cms/djangoapps/contentstore/utils.py
+++ b/cms/djangoapps/contentstore/utils.py
@@ -116,3 +116,12 @@ def compute_unit_state(unit):
 
 def get_date_display(date):
     return date.strftime("%d %B, %Y at %I:%M %p")
+
+def update_item(location, value):
+    """
+    If value is None, delete the db entry. Otherwise, update it using the correct modulestore.
+    """
+    if value is None:
+        get_modulestore(location).delete_item(location)
+    else:
+        get_modulestore(location).update_item(location, value)
\ No newline at end of file
diff --git a/cms/djangoapps/models/settings/course_details.py b/cms/djangoapps/models/settings/course_details.py
index 90f49a7b32..e16dcc35c9 100644
--- a/cms/djangoapps/models/settings/course_details.py
+++ b/cms/djangoapps/models/settings/course_details.py
@@ -7,6 +7,7 @@ import time
 from contentstore.utils import get_modulestore
 from util.converters import jsdate_to_time, time_to_date
 from cms.djangoapps.models.settings import course_grading
+from cms.djangoapps.contentstore.utils import update_item
 
 class CourseDetails:
     def __init__(self, location):
@@ -117,16 +118,16 @@ class CourseDetails:
         # NOTE: below auto writes to the db w/o verifying that any of the fields actually changed
         # to make faster, could compare against db or could have client send over a list of which fields changed.
         temploc = Location(course_location)._replace(category='about', name='syllabus')
-        get_modulestore(temploc).update_item(temploc, jsondict['syllabus'])
+        update_item(temploc, jsondict['syllabus'])
 
         temploc = temploc._replace(name='overview')
-        get_modulestore(temploc).update_item(temploc, jsondict['overview'])
+        update_item(temploc, jsondict['overview'])
         
         temploc = temploc._replace(name='effort')
-        get_modulestore(temploc).update_item(temploc, jsondict['effort'])
+        update_item(temploc, jsondict['effort'])
         
         temploc = temploc._replace(name='video')
-        get_modulestore(temploc).update_item(temploc, jsondict['intro_video'])
+        update_item(temploc, jsondict['intro_video'])
         
                     
         # Could just generate and return a course obj w/o doing any db reads, but I put the reads in as a means to confirm

From 1eacd5e346520b54cf849c8ae93d4af5873e9bf6 Mon Sep 17 00:00:00 2001
From: Don Mitchell <dmitchell@edx.org>
Date: Fri, 14 Dec 2012 09:45:25 -0500
Subject: [PATCH 42/43] Fix infinite loop in videosourceSample. Had fixed same
 one in parse_videosource but neglected to fix this one.

---
 cms/static/js/models/settings/course_details.js | 10 ++++++----
 1 file changed, 6 insertions(+), 4 deletions(-)

diff --git a/cms/static/js/models/settings/course_details.js b/cms/static/js/models/settings/course_details.js
index de4831e186..7204e8a525 100644
--- a/cms/static/js/models/settings/course_details.js
+++ b/cms/static/js/models/settings/course_details.js
@@ -76,8 +76,8 @@ CMS.Models.Settings.CourseDetails = Backbone.Model.extend({
 	_videoprefix : /\s*<video\s*youtube="/g,
 	// the below is lax to enable validation
 	_videospeedparse : /[^:]*/g, // /\d+\.?\d*(?=:)/g,
-	_videokeyparse : /([^,\/]+)/g,
-	_videonosuffix : /[^\"\/\>]+/g,
+	_videokeyparse : /([^,\/>]+)/g,
+	_videonosuffix : /[^"\/>]+/g,
 	_getNextMatch : function (regex, string, cursor) {
 		regex.lastIndex = cursor;
 		var result = regex.exec(string);
@@ -113,13 +113,15 @@ CMS.Models.Settings.CourseDetails = Backbone.Model.extend({
 				cursor = this._videokeyparse.lastIndex + 1;
 				while (cursor < videostring.length && bestspeed != 1.0) {
 					parsedspeed = this._getNextMatch(this._videospeedparse, videostring, cursor);
-					cursor = this._videospeedparse.lastIndex + 1;
+					if (parsedspeed) cursor = this._videospeedparse.lastIndex + 1;
+					else break;
 					if (Math.abs(Number(parsedspeed) - 1.0) < Math.abs(bestspeed - 1.0)) {
 						bestspeed = Number(parsedspeed);
 						bestkey = this._getNextMatch(this._videokeyparse, videostring, cursor);
 					}
 					else this._getNextMatch(this._videokeyparse, videostring, cursor);
-					cursor = this._videokeyparse.lastIndex + 1;
+					if (this._videokeyparse.lastIndex > cursor)	cursor = this._videokeyparse.lastIndex + 1;
+					else cursor++;
 				}
 			}
 			else {

From b9d9c7b8c062c50687f52dd94fcf01ef335b7ad4 Mon Sep 17 00:00:00 2001
From: Don Mitchell <dmitchell@edx.org>
Date: Fri, 14 Dec 2012 09:48:04 -0500
Subject: [PATCH 43/43] Fixed infinite loop in the 2nd video string parser
 which I'd fixed in the first yesterday. Fixed formatting of compounded video
 string errors.

---
 cms/static/js/models/settings/course_details.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/cms/static/js/models/settings/course_details.js b/cms/static/js/models/settings/course_details.js
index 7204e8a525..446fbd7041 100644
--- a/cms/static/js/models/settings/course_details.js
+++ b/cms/static/js/models/settings/course_details.js
@@ -61,7 +61,7 @@ CMS.Models.Settings.CourseDetails = Backbone.Model.extend({
 				// GET "http://gdata.youtube.com/feeds/api/videos/" + videokey
 			}
 			if (!_.isEmpty(vid_errors)) {
-				errors.intro_video = vid_errors.join('/n');
+				errors.intro_video = vid_errors.join(' ');
 			}
 		}
 		if (!_.isEmpty(errors)) return errors;