changes to textbook upload buttons, success message and styling

cms/static/sass/views/_textbooks.scss

@@ -334,7 +334,7 @@ body.course.textbooks {
 
           .action-close {
             @include transition(color 0.25s ease-in-out);
-            @include font-size(18);
+            @include font-size(22);
             display: inline-block;
             float: right;
             margin-top: ($baseline*2);
@@ -465,23 +465,44 @@ body.course.textbooks {
 
          }
 
-        .success {
-          color: $green;
-
-          [class^="icon-"] {
-            @include font-size(20);
+        .message-status {
+          @include border-top-radius(2px);
+          @include box-sizing(border-box);
+          @include font-size(14);
+          display: none;
+          border-bottom: 2px solid $yellow;
+          margin: 0 0 20px 0;
+          padding: 10px 20px;
+          font-weight: 500;
+          background: $paleYellow;
+
+          .text {
             display: inline-block;
-            margin-right: ($baseline/4);
-            vertical-align: text-bottom;
           }
 
+          &.error {
+            border-color: shade($red, 50%);
+            background: tint($red, 20%);
+            color: $white;
+          }
 
+          &.confirm {
+            border-color: shade($green, 50%);
+            background: tint($green, 20%);
+            color: $white;
+          }
+
+          &.is-shown {
+            display: block;
+          }
         }
       }
 
       .actions {
         padding: ($baseline*0.75) $baseline ($baseline/2) $baseline;
 
+
+
         .action-item {
           @extend .t-action4;
           @include font-size(12);
@@ -492,7 +513,7 @@ body.course.textbooks {
             margin-right: 0;
           }
         }
-
+/*
         .action-upload {
           @extend .btn-primary-blue;
           color: $white;
@@ -518,6 +539,22 @@ body.course.textbooks {
           }
 
         }
+*/
+
+           .action-primary {
+              @include blue-button();
+              @include font-size(12); // needed due to bad button mixins for now
+              border-color: $blue-d1;
+              color: $white;
+            }
+
+            a {
+              color: $blue;
+
+              &:hover {
+                color: $blue-s2;
+              }
+            }
 
       }
 

cms/templates/js/edit-chapter.underscore

@@ -2,13 +2,13 @@
     <% if (error && error.attributes && error.attributes.name) { print('error'); } %>">
   <label for="chapter<%= order %>-name"><%= gettext("Chapter Name") %></label>
   <input id="chapter<%= order %>-name" name="chapter<%= order %>-name" class="chapter-name short" placeholder="<%= _.str.sprintf(gettext("Chapter %s"), order) %>" value="<%= name %>" type="text">
-  <span class="tip tip-stacked"><%= gettext("the title/name of the chapter that will be used in navigating") %></span>
+  <span class="tip tip-stacked"><%= gettext("provide the title/name of the chapter that will be used in navigating") %></span>
 </div>
 <div class="input-wrap field text required field-add-chapter-asset chapter<%= order %>-asset
     <% if (error && error.attributes && error.attributes.asset_path) { print('error'); } %>">
   <label for="chapter<%= order %>-asset-path"><%= gettext("Chapter Asset") %></label>
   <input id="chapter<%= order %>-asset-path" name="chapter<%= order %>-asset-path" class="chapter-asset-path" placeholder="<%= _.str.sprintf(gettext("path/to/introductionToCookieBaking-CH%d.pdf"), order) %>" value="<%= asset_path %>" type="text">
-  <span class="tip tip-stacked"><%= gettext("provide the path to a file added to this course or upload a new one") %></span>
+  <span class="tip tip-stacked"><%= gettext("upload a PDF file or provide the path to a Studio asset file") %></span>
 <button class="action action-upload"><%= gettext("Upload Asset") %></button>
 </div>
 <a href="" class="action action-close"><i class="icon-remove-sign"></i> <span class="sr"><%= gettext("delete chapter") %></span></a>

cms/templates/js/edit-textbook.underscore

@@ -11,7 +11,7 @@
         <div class="input-wrap field text required add-textbook-name <% if(error && error.attributes && error.attributes.name) { print('error'); } %>">
           <label for="textbook-name-input"><%= gettext("Textbook Name") %></label>
           <input id="textbook-name-input" name="textbook-name" type="text" placeholder="<%= gettext("Introduction to Cookie Baking") %>" value="<%= name %>">
-          <span class="tip tip-stacked"><%= gettext("the title/name of the text book as you would like your students to see it.") %></span>
+          <span class="tip tip-stacked"><%= gettext("provide the title/name of the text book as you would like your students to see it") %></span>
         </div>
   </fieldset>
   <fieldset class="chapters-fields">

cms/templates/js/upload-dialog.underscore

@@ -17,7 +17,6 @@
   <p id="dialog-assetupload-description" class="message"><%= message %></p>
   <input type="file" name="file" />
 
-
     <div class="status-upload">
 
     <% if(uploading) { %>
@@ -31,8 +30,11 @@
     <% } %>
 
     <% if(finished) { %>
-       <p class="success"><i class="icon-ok"></i><%= gettext("Success!") %></p>
+      <div id="upload_confirm" class="message message-status message-status confirm is-shown" name="upload_confirm">
+        <p><%= gettext("Success!") %></p>
+      </div>
     <% } %>
+
     </div>
   </div>
 
@@ -40,10 +42,10 @@
     <h3 class="sr"><%= gettext('Form Actions') %></h3>
   <ul>
   <li class="action-item">
-    <input type="button" class="button action-upload" value="<%= gettext('Upload') %>" <% if (!selectedFile) { %>disabled="disabled"<% } %> />
+    <a href="#" class="button action-primary action-upload <% if (!selectedFile) { %>disabled<% } %>"><%= gettext('Upload') %></a>
   </li>
   <li class="action-item">
-    <input type="button" class="button action-cancel" value="<%= gettext('Cancel') %>" />
+    <a href="#" class="button action-secondary action-cancel"><%= gettext('Cancel') %></a>
   </li>
   </ul>
   </div>