updated textbook page html and sass, and added basic styling for error on wrong file type

cms/static/js/models/textbook.js

@@ -101,7 +101,7 @@ CMS.Models.FileUpload = Backbone.Model.extend({
     },
     validate: function(attrs, options) {
         if(attrs.selectedFile && attrs.selectedFile.type !== "application/pdf") {
-            return gettext("Only PDF files can be uploaded");
+            return gettext("Only PDF files can be uploaded. Please select a file ending in .pdf to upload.");
         }
     }
 });

cms/static/js/views/textbook.js

@@ -72,6 +72,7 @@ CMS.Views.TextbookEdit = Backbone.View.extend({
         this.listenTo(this.model.collection, "editOne", this.remove);
     },
     tagName: "section",
+    className: "textbook",
     render: function() {
         this.$el.html(this.template({
             name: this.model.escape('name'),
@@ -155,7 +156,7 @@ CMS.Views.ListTextbooks = Backbone.View.extend({
         this.listenTo(this.collection, 'all', this.render);
     },
     tagName: "div",
-    className: "textbooks",
+    className: "textbooks-list",
     render: function() {
         var textbooks = this.collection;
         if(textbooks.length === 0) {
@@ -219,7 +220,7 @@ CMS.Views.ChapterEdit = Backbone.View.extend({
         var msg = new CMS.Models.FileUpload({
             title: _.str.sprintf(gettext("Upload a new asset to %s"),
                 section.escape('name')),
-            message: "This is sample text about asset upload requirements, like no bigger than 2MB, must be in PDF format or whatever."
+            message: "Files must be in PDF format."
         });
         var view = new CMS.Views.UploadDialog({model: msg, chapter: this.model});
         $(".wrapper-view").after(view.show().el);

cms/templates/js/textbook-edit.underscore

@@ -5,7 +5,7 @@
     </div>
   <% } %>
 
-  <fieldset class="textbook">
+  <fieldset class="textbook-fields">
     <legend class="sr"><%= gettext("Textbook information") %></legend>
         <div class="input-wrap field text required add-textbook-name">
           <label for="textbook-name-input"><%= gettext("Textbook Name") %></label>
@@ -13,7 +13,7 @@
           <span class="tip tip-stacked"><%= gettext("the title/name of the text book as you would like your students to see it.") %></span>
         </div>
   </fieldset>
-  <fieldset class="chapters">
+  <fieldset class="chapters-fields">
     <legend class="sr"><%= gettext("Chapter(s) information") %></legend>
       <ol class="chapters list-input enum"></ol>
   </fieldset>

cms/templates/js/textbook-show.underscore

+ <div class="view-textbook">
     <header>
         <h3 class="textbook-title"><%= name %></h3>
     </header>
@@ -5,21 +6,23 @@
 <% if(chapters.length > 1) {%>
     <p><a href="#" class="chapter-toggle
         <% if(showChapters){ print('hide'); } else { print('show'); } %>-chapters">
-        <i class="icon-chevron-<% if(showChapters){ print('down'); } else { print('right'); } %>"></i>
+        <i class="ui-toggle-expansion icon-caret-<% if(showChapters){ print('down'); } else { print('right'); } %>"></i>
         <%= chapters.length %> PDF Chapters
     </a></p>
 <% } else if(chapters.length === 1) { %>
-    <%= chapters.at(0).get("asset_path") %>
+    <p>
+        <%= chapters.at(0).get("asset_path") %>
+    </p>
 <% } %>
 
 <ul  class="actions textbook-actions">
-    <li>
+    <li class="action action-view">
         <a href="#" class="view"><%= gettext("view in course") %></a>
     </li>
-    <li>
+    <li class="action action-edit">
         <button class="edit"><%= gettext("Edit") %></button>
     </li>
-    <li>
+    <li class="action action-delete">
         <button class="delete"><%= gettext("Delete") %></button>
     </li>
 </ul>
@@ -29,9 +32,11 @@
 <% if(showChapters) { %>
 <ol class="chapters">
   <% chapters.each(function(chapter) { %>
-    <li><span class="chapter-name"><%= chapter.get('name') %></span>
+    <li class="chapter">
+        <span class="chapter-name"><%= chapter.get('name') %></span>
         <span class="chapter-asset-path"><%= chapter.get('asset_path') %></span>
     </li>
   <% }) %>
 </ol>
 <% } %>
+</div>

cms/templates/js/upload-dialog.underscore

@@ -27,7 +27,7 @@
     <h3 class="sr"><%= gettext('Form Actions') %></h3>
   <ul>
   <li class="action-item">
-    <input type="button" class="button action-upload btn-primary-blue" value="<%= gettext('Upload') %>" <% if (!selectedFile) { %>disabled="disabled"<% } %> />
+    <input type="button" class="button action-upload" value="<%= gettext('Upload') %>" <% if (!selectedFile) { %>disabled="disabled"<% } %> />
   </li>
   <li class="action-item">
     <input type="button" class="button action-cancel" value="<%= gettext('Cancel') %>" />

cms/templates/textbooks.html

@@ -71,23 +71,6 @@ $(function() {
     <section class="content">
       <article class="content-primary" role="main">
 
-<!--
-        <section id="textbook1" class="textbook">
-
-          <header>
-            <h3 class="textbook-title">
-            [textbook name]
-            </h3>
-          </header>
-
-          <ul class="chapter-list">
-            <li class="chapter"></li>
-          </ul>
-
-        </section>
--->
-
-
       </article>
       <aside class="content-supplementary" role="complimentary">