From ad5fcbe7845e2feb074463ba71811274b9e9b68c Mon Sep 17 00:00:00 2001
From: Tom Giannattasio <tom@mitx.mit.edu>
Date: Tue, 21 Aug 2012 14:46:35 -0400
Subject: [PATCH] new header styles

---
 lms/static/images/small-header-home-icon.png  | Bin 0 -> 1128 bytes
 lms/static/images/small-header-logo.png       | Bin 0 -> 2159 bytes
 lms/static/sass/base/_variables.scss          |   2 +-
 lms/static/sass/course.scss                   |   3 +
 .../sass/course/courseware/_sidebar.scss      |   3 +-
 .../sass/course/instructor/_instructor.scss   |  15 +++++
 .../course/layout/_courseware_header.scss     |  62 ++++++++++++++----
 lms/static/sass/shared/_footer.scss           |   3 -
 lms/static/sass/shared/_header.scss           |  17 ++---
 9 files changed, 80 insertions(+), 25 deletions(-)
 create mode 100644 lms/static/images/small-header-home-icon.png
 create mode 100644 lms/static/images/small-header-logo.png
 create mode 100644 lms/static/sass/course/instructor/_instructor.scss

diff --git a/lms/static/images/small-header-home-icon.png b/lms/static/images/small-header-home-icon.png
new file mode 100644
index 0000000000000000000000000000000000000000..2e81217b772fbd7449e47b18cda2eea07f5a6c19
GIT binary patch
literal 1128
zcmaJ=TWHfz7>;vznF#9iK^Yh`k$Gv-v`x0g)!8PkD=u@kRVU6%nw+j-OHNGAY*!F3
z2s%U*MDhBfPm1~=sHmV+M7%vX^+Br0Kp*Cl;zUpwc(Se2hs}`Wob&U4-~auW)7RFz
zZg$n8DuN(p$D5@DUaRppXT~)A|M6H#<7FX=wxcA>pqyd@BCNqQAmfJ82@*ijdUrnq
zjRY}ush(;_?Q)BtLW5RZA3ASX7)=n3O?gXEy8t57pi?(P)YtnDDN@%$)D}+m%9aSS
zdUL@B$wF&NEp(|tjcQs$Hs%FPU;w0$d86BOgnWn^;T7=SH8T`B;)1$D)TpR-xs4Q|
z4M>jmdsHvWk~~kd0gmU{Riw|$`WP>Mc@G;9I9~A8lVcBsquE+UNJz1<Sojp8vItoM
z!{l-~I_IaM-N~@QV9@38`8?Re<Mf(H$$Lzvw#*;_N40ee>ChxyMkNh<P>8}xM^iAY
zaaz+ED-$jllUFQ;rM+%SWk*^5zpG)4dpjrr{_35O*h%$TfJp!c_Sh<JT&C6yWeK7U
z6a?)Qgx%#Twq+rLP8M3EnB>ViSy6S<H7p-N$g&VO9i*5lh)W>~bI`i331O)|!1>t*
zNel#7Hp&JA^<2;&3<P2^pFhfrWvm3%9s`)DjMXq!j5ajH_()U|xyXcAcNh!{N0xxC
z?*UrOh6Xv3w4hI}g`Zr@C{~+5%UB-ulVTYxhH+c_Ppiu&JU{Msd~oq$eDr~d=iSDG
z4cGsghc87bE`?M1(zTOKRgb*$5ARIV0|N_cjt-U%3W8AZA0L=mgXR<}!>_`{Vlw-Q
zIrmgN-?VApxBkz!hMRXBc{+4q-s_4x@7DRkZ>O(5F}%Wmi5o0+{=ELOue9f5-^{%?
zr&M1oR(7N#U*=vvldU|xtET#SWq<#J_wVm+shfIfN%h^DNMvg*wNmK){pHZ&!)dMJ
z<=G<@6uop=2LZH2EyX88mosm{tjxgG?jpA>IrL-gslvtdl@DvP!yPRf=Re-O?BnhD
rfqQi?zO!uy)^JzeJiPtu`S$%&hz;@JPwv<t>E8W#v{kwh*>&&_{QG-Y

literal 0
HcmV?d00001

diff --git a/lms/static/images/small-header-logo.png b/lms/static/images/small-header-logo.png
new file mode 100644
index 0000000000000000000000000000000000000000..a841b5429d38d38c8fd1b3f6809118e2d8bd31af
GIT binary patch
literal 2159
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
Wx|y1Nf!3(J0<c^?85IXZPW%^Iu8)ZT

literal 0
HcmV?d00001

diff --git a/lms/static/sass/base/_variables.scss b/lms/static/sass/base/_variables.scss
index b208ec36e6..821701ace8 100644
--- a/lms/static/sass/base/_variables.scss
+++ b/lms/static/sass/base/_variables.scss
@@ -15,7 +15,7 @@ $monospace: Monaco, 'Bitstream Vera Sans Mono', 'Lucida Console', monospace;
 $body-font-size: em(14);
 $body-line-height: golden-ratio(.875em, 1);
 $base-font-color: rgb(60,60,60);
-$lighter-base-font-color: rgb(160,160,160);
+$lighter-base-font-color: rgb(100,100,100);
 
 $blue: rgb(29,157,217);
 $pink: rgb(182,37,104);
diff --git a/lms/static/sass/course.scss b/lms/static/sass/course.scss
index ba40de32e4..9f0f4eaf49 100644
--- a/lms/static/sass/course.scss
+++ b/lms/static/sass/course.scss
@@ -34,6 +34,9 @@
 @import "course/profile";
 @import "course/gradebook";
 
+// instructor
+@import "course/instructor/instructor";
+
 // Askbot / Discussion styles
 @import "course/discussion/askbot-original";
 @import "course/discussion/discussion";
diff --git a/lms/static/sass/course/courseware/_sidebar.scss b/lms/static/sass/course/courseware/_sidebar.scss
index 7c884bf5d3..bb3826fb61 100644
--- a/lms/static/sass/course/courseware/_sidebar.scss
+++ b/lms/static/sass/course/courseware/_sidebar.scss
@@ -69,7 +69,7 @@ section.course-index {
     .chapter {
       padding: 11px 14px;
       @include linear-gradient(top, #f9f9f9, #eee);
-      box-shadow: 0 1px 0 #fff inset, 0 -1px 0 rgba(0, 0, 0, .1) inset;
+      @include box-shadow(0 1px 0 #fff inset, 0 -1px 0 rgba(0, 0, 0, .1) inset);
 
       &:first-child {
         border-radius: 3px 0 0 0;
@@ -77,6 +77,7 @@ section.course-index {
 
       &:last-child {
         border-radius: 0 0 0 3px;
+        @include box-shadow(0 1px 0 #fff inset);
       }
     }
 
diff --git a/lms/static/sass/course/instructor/_instructor.scss b/lms/static/sass/course/instructor/_instructor.scss
new file mode 100644
index 0000000000..070f7bcc9c
--- /dev/null
+++ b/lms/static/sass/course/instructor/_instructor.scss
@@ -0,0 +1,15 @@
+.instructor-dashboard-wrapper {
+	@extend .table-wrapper;
+	display: table;
+
+	section.instructor-dashboard-content {
+		@extend .content;
+    padding: 40px;
+    width: 100%;
+
+    h1 {
+      @extend .top-header;
+    }
+	}
+}
+
diff --git a/lms/static/sass/course/layout/_courseware_header.scss b/lms/static/sass/course/layout/_courseware_header.scss
index ca8b9918d2..a4d5014baf 100644
--- a/lms/static/sass/course/layout/_courseware_header.scss
+++ b/lms/static/sass/course/layout/_courseware_header.scss
@@ -15,29 +15,32 @@ nav.course-material {
   ol.course-tabs {
     @include border-top-radius(4px);
     @include clearfix;
-    padding: 10px 0 0 0;
+    padding: 28px 0 10px 0;
     margin-left: 10px;
 
     li {
       float: left;
       list-style: none;
+      margin-right: 6px;
 
       a {
+        border-radius: 3px;
         color: #555;
         display: block;
         text-align: center;
-        padding: 8px 13px 12px;
+        padding: 10px 13px 12px;
         font-size: 14px;
         font-weight: bold;
         text-decoration: none;
-        text-shadow: 0 1px rgb(255,255,255);
 
         &:hover {
           color: #333;
+          background: rgba(0, 0, 0, .08);
         }
 
         &.active {
           color: $blue;
+          background: rgba(255, 255, 255, .8);
         }
       }
     }
@@ -52,13 +55,49 @@ nav.course-material {
   }
 }
 
-.global {
-  background: none !important;
-  border: none !important;
-  box-shadow: none !important;
+header.global {
+  border-bottom: 1px solid #bbb;
+  @include box-shadow(0 1px 2px rgba(0, 0, 0, .1));
+  height: 45px;
+  @include linear-gradient(top, #fff, #eee);
 
-  .logo {
-    margin-left: 13px !important;
+  nav {
+    padding-top: 2px;
+  }
+
+  h1.logo {    
+    margin-left: 13px;
+    margin-right: 20px;
+    padding-right: 20px;
+
+    &::before {
+      @extend .faded-vertical-divider;
+      content: "";
+      display: block;
+      height: 40px;
+      position: absolute;
+      right: 3px;
+      top: -8px;
+      width: 1px;
+    }
+
+    &::after {
+      @extend .faded-vertical-divider-light;
+      content: "";
+      display: block;
+      height: 40px;
+      position: absolute;
+      right: 0px;
+      top: -12px;
+      width: 1px;
+    }
+
+    a {
+      width: 48px;
+      height: 24px;
+      background: url(../images/small-header-logo.png) no-repeat !important;  
+    }
+    
   }
 
   .find-courses-button {
@@ -71,9 +110,9 @@ nav.course-material {
     float: left;
     font-size: 0.9em;
     font-weight: 600;
-    color: #888;
-    line-height: 40px;
+    color: #777;
     letter-spacing: 0;
+    margin-top: 9px;
     text-transform: none;
     text-shadow: 0 1px 0 #fff;
     white-space: nowrap;
@@ -83,7 +122,6 @@ nav.course-material {
     .provider {
       font: inherit;
       font-weight: bold;
-      color: #555;
     }
   }
 }
\ No newline at end of file
diff --git a/lms/static/sass/shared/_footer.scss b/lms/static/sass/shared/_footer.scss
index 4fb95f7004..442380d21b 100644
--- a/lms/static/sass/shared/_footer.scss
+++ b/lms/static/sass/shared/_footer.scss
@@ -48,7 +48,6 @@ footer {
 
           a:link, a:visited {
             color: $lighter-base-font-color;
-            letter-spacing: 1px;
             padding: 6px 0px;
           }
         }
@@ -90,7 +89,6 @@ footer {
         a {
           color: $lighter-base-font-color;
           @include inline-block;
-          letter-spacing: 1px;
           margin-right: 20px;
           padding-top: 2px;
           vertical-align: middle;
@@ -165,7 +163,6 @@ footer {
           color: $lighter-base-font-color;
           font-family: $serif;
           font-style: italic;
-          letter-spacing: 1px;
           line-height: 1.6em;
           margin-left: 20px;
           text-transform: lowercase;
diff --git a/lms/static/sass/shared/_header.scss b/lms/static/sass/shared/_header.scss
index 857db39a8d..116761ddc8 100644
--- a/lms/static/sass/shared/_header.scss
+++ b/lms/static/sass/shared/_header.scss
@@ -136,6 +136,7 @@ header.global {
 
     &.user {
       float: right;
+      margin-top: 4px;
 
       > li.primary {
         display: block;
@@ -151,22 +152,22 @@ header.global {
           > a {
             @include border-radius(0 4px 4px 0);
             border-left: none;
+            padding: 5px 8px 7px 8px;
           }
         }
       }
 
       a.user-link {
-        padding: 10px 12px 10px 42px;
+        padding: 6px 12px 8px 35px;
         position: relative;
         text-transform: none;
+        font-size: 14px;
+        font-weight: bold;
+        letter-spacing: 0;
 
         .avatar {
-          //background: rgb(220,220,220);
-          @include background-image(url('../images/portal-icons/home-icon.png'));
-          background-size: cover;
-          //@include border-radius(3px);
-          //border: 1px solid rgb(80,80,80);
-          //@include box-shadow(0 1px 0 0 rgba(255,255,255, 0.6));
+          @include background-image(url('../images/small-header-home-icon.png'));
+          background-repeat: no-repeat;
           height: 26px;
           @include inline-block;
           left: 8px;
@@ -194,7 +195,7 @@ header.global {
         padding: 5px 10px;
         position: absolute;
         right: 0px;
-        top: 50px;
+        top: 34px;
         width: 170px;
         z-index: 3;