Added some style for video sequence made topbar extend better

--HG--
branch : kf-video-layout

sass/_base-extends.scss

@@ -109,11 +109,18 @@
   @extend .clearfix;
 
   a {
-    text-transform: uppercase;
+    @include box-shadow(inset 1px 0 0 lighten(#f6efd4, 5%));
+    background: darken(#F6EFD4, 5%);
+    border-left: 1px solid darken(#f6efd4, 20%);
     color: darken(#F6EFD4, 80%);
+    padding: lh(.75);
+    text-transform: uppercase;
+    display: block;
 
     &:hover {
       color: darken(#F6EFD4, 60%);
+      text-decoration: none;
+      background: none;
     }
   }
 }

sass/_courseware.scss

@@ -106,14 +106,32 @@ div.course-wrapper {
 
     ol.sequence-nav {
       margin-bottom: $body-line-height;
+      @extend .topbar;
 
       li {
         border: none;
         cursor: pointer;
         display: table-cell;
-        min-width: 30px;
-        min-height: 30px;
-        padding: 0 10px;
+        padding: lh(.75);
+        float: left;
+
+        &.prev, &.next {
+          @include box-shadow(inset 1px 0 0 lighten(#f6efd4, 5%));
+          background: darken(#F6EFD4, 5%);
+          border-left: 1px solid darken(#f6efd4, 20%);
+          color: darken(#F6EFD4, 80%);
+          float: right;
+          letter-spacing: 1px;
+          padding: lh(.75);
+          text-transform: uppercase;
+
+          &:hover {
+            text-decoration: none;
+            color: darken(#F6EFD4, 60%);
+            text-decoration: none;
+            background: none;
+          }
+        }
       }
     }
   }

sass/_textbook.scss

@@ -18,17 +18,25 @@ div.book-wrapper {
 
     nav {
       @extend .topbar;
+      @extend .clearfix;
 
       ul {
         @extend .clearfix;
-        li {
-          padding: 15px;
 
+        li {
           &.last {
             float: left;
+            display: block;
+
+            a {
+              @include box-shadow(inset -1px 0 0 lighten(#f6efd4, 5%));
+              border-right: 1px solid darken(#f6efd4, 20%);
+              border-left: 0;
+            }
           }
 
           &.next {
+            display: block;
             float: right;
           }
         }

sass/_wiki.scss

@@ -8,8 +8,8 @@ div.wiki-wrapper {
 
     input[type="button"] {
       @extend h3;
-      color: lighten($text-color, 10%);
       @include transition();
+      color: lighten($text-color, 10%);
       font-size: $body-font-size;
       margin: 0  !important;
       padding: 7px 7px 7px 30px;
@@ -77,7 +77,7 @@ div.wiki-wrapper {
 
   section.wiki-body {
     @extend .content;
-    
+
     header {
       @extend .topbar;
 
@@ -91,6 +91,7 @@ div.wiki-wrapper {
 
       ul {
         float: right;
+        list-style: none;
 
         li {
           float: left;
@@ -108,7 +109,7 @@ div.wiki-wrapper {
             font-size: 12px;
             text-transform: uppercase;
             letter-spacing: 1px;
-            padding: 15px;
+            padding: lh(.75);
             margin: 0;
 
             &:hover {
@@ -136,4 +137,4 @@ div.wiki-wrapper {
       }
     }
   }
-}
+}

seq_module.html

@@ -4,8 +4,8 @@
   <li class="seq_inactive" id="tt_${ t }">&nbsp;</li>
   % endfor
 
-  <li id="${ id }prev">Previous</li>
-  <li id="${ id }next">Next</li>
+  <li id="${ id }next" class="next">Next</li>
+  <li id="${ id }prev" class="prev">Previous</li>
 </ol>