fixed wiki bugs; started sequence nav bugs

common/lib/xmodule/xmodule/css/sequence/display.scss

@@ -2,10 +2,13 @@ nav.sequence-nav {
   // TODO (cpennington): This doesn't work anymore. XModules aren't able to
   // import from external sources.
   @extend .topbar;
-  border-bottom: 1px solid $border-color;
-  @include border-top-right-radius(4px);
-  margin: 0 0 lh() (-(lh()));
+  border: 1px solid #ccc;
+  height: 44px;
+  @include linear-gradient(top, #f6f6f6, #e6e6e6);
+  @include border-radius(25px);
+  margin: 0 -20px 30px;
   position: relative;
+  @include box-shadow(0 1px 0 #fff inset);
 
   ol {
     @include box-sizing(border-box);
@@ -25,42 +28,34 @@ nav.sequence-nav {
       min-width: 20px;
 
       a {
-        background-position: center;
+        width: 35px;
+        height: 35px;
+        margin: 4px auto;
+        background-position: center 10px;
         background-repeat: no-repeat;
         border: 1px solid transparent;
-        border-bottom: none;
-        @include border-radius(3px 3px 0 0);
+        @include border-radius(35px);
         cursor: pointer;
         display: block;
-        height: 10px;
-        padding: 15px 0 14px;
+        padding: 0;
         position: relative;
         @include transition();
-        width: 100%;
 
         &:hover {
+          background-color: #fff;
           background-repeat: no-repeat;
-          background-position: center;
-          background-color: #F3F3F3;
-        }
-
-        &.visited {
-          background-color: #F3F3F3;
-
-          &:hover {
-            background-position: center center;
-          }
+          background-position: center 10px;
         }
 
         &.active {
-          border-color: $border-color;
-          @include box-shadow(0 2px 0 #fff);
+          border-color: $blue;
           background-color: #fff;
           z-index: 9;
 
           &:hover {
-            background-position: center;
             background-color: #fff;
+            background-repeat: no-repeat;
+            background-position: center 10px;
           }
         }
 
@@ -176,24 +171,27 @@ nav.sequence-nav {
     position: absolute;
     right: 0;
     top: 0;
-    width: flex-grid(1, 9);
-    border: 1px solid $border-color;
+    width: 81px;
+    margin-right: 5px;
+    border: none;
     border-bottom: 0;
     @include border-radius(3px 3px 0 0);
 
     li {
       float: left;
       margin-bottom: 0;
-      width: 50%;
+      height: 35px;
+      width: 40px;
 
       &.prev, &.next {
+        @include linear-gradient(top, #ccc, #888);
 
         a {
           background-position: center;
           background-repeat: no-repeat;
           display: block;
-          height: 10px;
-          padding: 15px 0 14px;
+          height: 35px;
+          width: 40px;
           text-indent: -9999px;
           @include transition(all, .2s, $ease-in-out-quad);
 
@@ -210,12 +208,16 @@ nav.sequence-nav {
       }
 
       &.prev {
+        border-radius: 35px 0 0 35px;
+
         a {
           background-image: url('../images/sequence-nav/previous-icon.png');
         }
       }
 
       &.next {
+        border-radius: 0 35px 35px 0;
+
         a {
           border-left: 1px solid lighten($border-color, 10%);
           background-image: url('../images/sequence-nav/next-icon.png');

lms/static/sass/README.txt

@@ -0,0 +1,3 @@
+Sass Watch:
+
+sass --watch lms/static/sass:lms/static/sass -r ./lms/static/sass/bourbon/lib/bourbon.rb

lms/static/sass/course/base/_base.scss

@@ -1,5 +1,6 @@
 body {
   min-width: 980px;
+  min-height: 100%;
   background: url(../images/bg-texture.png) #f7f7f7;
 }
 

lms/static/sass/course/base/_extends.scss

@@ -47,10 +47,10 @@ h1.top-header {
 }
 
 .sidebar {
-  // border-right: 1px solid #C8C8C8;
   @include box-sizing(border-box);
   display: table-cell;
   font-family: $sans-serif;
+  font-size: 14px;
   position: relative;
   vertical-align: top;
   width: flex-grid(3);
@@ -58,7 +58,7 @@ h1.top-header {
 
   h1, h2 {
    font-size: em(20);
-   font-weight: 100;
+   font-weight: bold;
    letter-spacing: 0;
    text-transform: none;
    font-family: $sans-serif;
@@ -66,6 +66,11 @@ h1.top-header {
    font-style: normal;
   }
 
+  h1 {
+    font-size: 18px;
+    padding: 32px 26px 20px 26px;
+  }
+
   a {
     border: none;
     font-style: normal;

lms/static/sass/course/courseware/_courseware.scss

@@ -12,8 +12,7 @@ div.course-wrapper {
 
   section.course-content {
     @extend .content;
-    padding-right: 0;
-    padding-left: lh();
+    padding: 40px;
 
     h1 {
       margin: 0 0 lh();

lms/static/sass/course/discussion/_discussion.scss

@@ -3,15 +3,16 @@ body.askbot {
   section.container {
     div.discussion-wrapper {
       @extend .table-wrapper;
+      display: table;
 
       div.discussion-content {
         @include box-sizing(border-box);
         display: table-cell;
         min-width: 650px;
-        padding-right: lh();
-        vertical-align: top;
+        padding: 40px;
         width: flex-grid(9) + flex-gutter();
 
+
         a.tabula-rasa, .tabula-rasa{
           @extend .light-button;
           @include border-radius(5px);

lms/static/sass/course/discussion/_sidebar.scss

@@ -2,9 +2,10 @@
 
 div.discussion-wrapper aside {
   @extend .sidebar;
-  border-left: 1px solid $border-color;
+  border-left: 1px solid #ccc;
   border-right: 0;
   width: flex-grid(3);
+  border-radius: 0 3px 3px 0;
 
   &:after {
     left: -1px;
@@ -16,9 +17,7 @@ div.discussion-wrapper aside {
   }
 
   h1 {
-    @extend .bottom-border;
-    padding: lh(.5) lh();
-    margin-bottom: em(16, 20);
+    margin-bottom: 0;
   }
 
   h2 {
@@ -54,7 +53,7 @@ div.discussion-wrapper aside {
 
   div.box {
     display: block;
-    padding: lh(.5) lh();
+    padding: 18px 26px;
     border-top: 1px solid lighten($border-color, 10%);
 
     &:first-child {
@@ -67,7 +66,7 @@ div.discussion-wrapper aside {
 
       li {
         border-bottom: 0;
-        background: #eee;
+        background: #ddd;
         padding: 6px 10px 6px 5px;
 
         a {
@@ -298,6 +297,7 @@ div.discussion-wrapper aside {
 
   div.view-profile {
     border-top: 0;
+    padding-top: 0;
 
     a {
       @extend .gray-button;

lms/static/sass/course/discussion/_tags.scss

@@ -10,7 +10,7 @@ ul.tags {
   }
 
   li {
-    background: #eee;
+    background: #ddd;
     color: #555;
     display: inline-block;
     font-size: 12px;
@@ -19,7 +19,7 @@ ul.tags {
     padding: 6px 10px 6px 5px;
 
     &:before {
-     border-color:transparent #eee transparent transparent;
+     border-color:transparent #ddd transparent transparent;
      border-style:solid;
      border-width:12px 10px 12px 0;
      content:"";

lms/templates/wiki/article.html

@@ -22,8 +22,7 @@
         {% endblock %}      
     </article>
 
-    <div class="article-functions">
-      
+    <div class="article-functions">      
       <ul class="nav nav-tabs">
         {% include "wiki/includes/article_menu.html" %}
       </ul>

lms/templates/wiki/settings.html

@@ -35,16 +35,16 @@
 
 
 
-    <div class="article-functions">
-      <div class="timestamp">
-        <span class="label">{% trans "Last modified:" %}</span><br />
-        <span class="date">{{ article.current_revision.modified }}</span>
-      </div>
+    <div class="article-functions">      
       <ul class="nav nav-tabs">
         {% with "settings" as selected %}
           {% include "wiki/includes/article_menu.html" %}
         {% endwith %}
       </ul>
+      <div class="timestamp">
+        <span class="label">{% trans "Last modified:" %}</span><br />
+        <span class="date">{{ article.current_revision.modified }}</span>
+      </div>
     </div>
   </div>