cleaned up textbook nav styles

lms/static/sass/course/_textbook.scss

@@ -9,10 +9,25 @@ div.book-wrapper {
     ul#booknav {
       font-size: em(14);
 
+      .chapter-number {
+        
+      }
+
+      .chapter {
+        float: left;
+        width: 87%;
+        line-height: 1.4em;
+      }
+
       .page-number {
         float: right;
+        width: 12%;
         font-size: .8em;
+        line-height: 2.1em;
+        text-align: right;
         color: #9a9a9a;
+        opacity: 0;
+        @include transition(opacity .15s);
       }
 
       li {
@@ -22,9 +37,14 @@ div.book-wrapper {
 
         a {
           padding: 0;
+          @include clearfix;
 
           &:hover {
             background-color: transparent;
+
+            .page-number {
+              opacity: 1;
+            }
           }
         }
 

lms/templates/staticbook.html

@@ -75,11 +75,14 @@ $("#open_close_accordion a").click(function(){
           <%def name="print_entry(entry)">
               <li>
                   <a href="javascript:goto_page(${entry.get('page')})">
-                      <!--${' '.join(entry.get(attribute, '') for attribute in ['chapter', 'name', 'page_label'])}-->
-                      %if entry.get('chapter'):
-                        <span class="chapter-number">${entry.get('chapter')}</span> 
-                      %endif
-                      <span class="chapter-name">${entry.get('name')}</span> <span class="page-number">${entry.get('page_label')}</span>
+                      <span class="chapter">
+                        %if entry.get('chapter'):
+                          <span class="chapter-number">${entry.get('chapter')}.</span> ${entry.get('name')}
+                        %else:
+                          ${entry.get('name')}
+                        %endif
+                      </span>
+                      <span class="page-number">${entry.get('page_label')}</span>
                   </a>
                   % if len(entry) > 0:
                       <ul>