From 2ee488733cfc71628d6a7d95e89efeab29617384 Mon Sep 17 00:00:00 2001
From: Brian Talbot <btalbot@edx.org>
Date: Sat, 15 Dec 2012 00:25:29 -0500
Subject: [PATCH] cms pull request 1160 - brought back all css changes lost in
 this request - mostly overview related

---
 cms/static/sass/_cms_mixins.scss |  38 +-
 cms/static/sass/_courseware.scss | 581 +++++++++++++++++--------------
 cms/static/sass/_subsection.scss | 174 ++++-----
 cms/static/sass/_variables.scss  |   7 -
 4 files changed, 419 insertions(+), 381 deletions(-)

diff --git a/cms/static/sass/_cms_mixins.scss b/cms/static/sass/_cms_mixins.scss
index dfd0ac0e48..0f2e139455 100644
--- a/cms/static/sass/_cms_mixins.scss
+++ b/cms/static/sass/_cms_mixins.scss
@@ -48,17 +48,17 @@
 }
 
 @mixin green-button {
-	@include button;
-	border: 1px solid #0d7011;
-	border-radius: 3px;
-	@include linear-gradient(top, rgba(255, 255, 255, .3), rgba(255, 255, 255, 0));
-	background-color: $green;
-	color: #fff;
+  @include button;
+  border: 1px solid #0d7011;
+  border-radius: 3px;
+  @include linear-gradient(top, rgba(255, 255, 255, .3), rgba(255, 255, 255, 0));
+  background-color: $green;
+  color: #fff;
 
-	&:hover {
-		background-color: #129416;
-		color: #fff;
-	}
+  &:hover {
+  background-color: #129416;
+  color: #fff;
+  }
 }
 
 @mixin white-button {
@@ -277,12 +277,12 @@
 }
 
 @mixin sr-text {
-	border: 0; 
-	clip: rect(0 0 0 0); 
-	height: 1px; 
-	margin: -1px; 
-	overflow: hidden; 
-	padding: 0; 
-	position: absolute; 
-	width: 1px;
-}
+  border: 0; 
+  clip: rect(0 0 0 0); 
+  height: 1px; 
+  margin: -1px; 
+  overflow: hidden; 
+  padding: 0; 
+  position: absolute; 
+  width: 1px;
+}
\ No newline at end of file
diff --git a/cms/static/sass/_courseware.scss b/cms/static/sass/_courseware.scss
index 94cffa4f13..e2037916cb 100644
--- a/cms/static/sass/_courseware.scss
+++ b/cms/static/sass/_courseware.scss
@@ -5,6 +5,127 @@ input.courseware-unit-search-input {
 	background-color: #fff;
 }
 
+.branch {
+
+	.section-item {
+	  @include clearfix();
+
+	  .details {
+	  	display: block;
+	    float: left;
+	    margin-bottom: 0;
+	    width: 650px;
+	  }
+
+	  .gradable-status {
+	    float: right;
+	    position: relative;
+	    top: -4px;
+	    right: 50px;
+	    width: 145px;
+
+	    .status-label {
+	            position: absolute;
+	            top: 2px;
+	            right: -5px;
+	            display: none;
+	            width: 110px;
+	            padding: 5px 40px 5px 10px;
+	            @include border-radius(3px);
+	            color: $lightGrey;
+	            text-align: right;
+	            font-size: 12px;
+	            font-weight: bold;
+	            line-height: 16px;
+	    }
+
+	    .menu-toggle {
+	    	  z-index: 10;
+	    	  position: absolute;
+	    	  top: 0;
+	    	  right: 5px;
+	    	  padding: 5px;
+	    	  color: $mediumGrey;
+
+	    	  &:hover, &.is-active {
+	    	    color: $blue;
+	    	  }
+	    	}
+
+	    	.menu {
+	    	  z-index: 1;
+	    	  display: none;
+	    	  opacity: 0.0;
+	    	  position: absolute;
+	    	  top: -1px;
+	    	  left: 5px;
+	    	  margin: 0;
+	    	  padding: 8px 12px;
+	    	  background: $white;
+	    	  border: 1px solid $mediumGrey;
+	    	  font-size: 12px;
+	    	  @include border-radius(4px);
+	    	  @include box-shadow(0 1px 2px rgba(0, 0, 0, .2));
+	    	  @include transition(opacity .15s);
+
+
+	    	  li {
+	    	    width: 115px;
+	    	    margin-bottom: 3px;
+	    	    padding-bottom: 3px;
+	    	    border-bottom: 1px solid $lightGrey;
+
+	    	    &:last-child {
+	    	      margin-bottom: 0;
+	    	      padding-bottom: 0;
+	    	      border: none;
+
+	    	      a {
+	    	        color: $darkGrey;
+	    	      }
+	    	    }
+	    	  }
+
+          a {
+            color: $blue;
+
+            &.is-selected {
+              font-weight: bold;
+            }
+          }
+        }
+
+        // dropdown state
+        &.is-active {
+
+          .menu {
+            z-index: 1000;
+            display: block;
+            opacity: 1.0;
+          }
+
+          .menu-toggle {
+            z-index: 10000;
+          }
+        }
+
+        // set state
+        &.is-set {
+
+          .menu-toggle {
+            color: $blue;
+          }
+
+          .status-label {
+            display: block;
+            color: $blue;
+          }
+        }
+      }
+    }
+  }
+
+
 .courseware-section {
 	position: relative;
 	background: #fff;
@@ -32,6 +153,39 @@ input.courseware-unit-search-input {
 		margin-left: 10px;
 	}
 
+	.section-published-date {
+		position: absolute;
+		top: 19px;
+		right: 90px;
+		padding: 4px 10px;
+		border-radius: 3px;
+		background: $lightGrey;
+		text-align: right;
+
+		.published-status {
+			font-size: 12px;
+			margin-right: 15px;
+
+			strong {
+				font-weight: bold;
+			}
+		}
+
+		.schedule-button {
+			@include blue-button;
+		}
+
+		.edit-button {
+			@include blue-button;
+		}
+
+		.schedule-button,
+		.edit-button {
+			font-size: 11px;
+			padding: 3px 15px 5px;
+		}
+	}
+
 	.datepair .date,
 	.datepair .time {
 		padding-left: 0;
@@ -68,190 +222,193 @@ input.courseware-unit-search-input {
 		}
 
 		.item-details {
-			float: none;
 			display: inline-block;
 			padding: 20px 0 10px 0;
 			@include clearfix();
 
 			.section-name {
-				float: left;
-				margin-right: 10px;
-				width: 350px;
-				font-size: 19px;
-				font-weight: bold;
-				color: $blue;
+			  float: left;
+			  margin-right: 10px;
+			  width: 350px;
+			  font-size: 19px;
+			  font-weight: bold;
+			  color: $blue;
 			}
 
 			.section-name-span {
-				cursor: pointer;
-				@include transition(color .15s);
+			  cursor: pointer;
+			  @include transition(color .15s);
 
-				&:hover {
-					color: $orange;
-				}
+			  &:hover {
+			    color: $orange;
+			  }
 			}
 
 			.section-name-edit {
-				position: relative;
-				width: 400px;
-				background: $white;
+			  position: relative;
+			  width: 400px;
+			  background: $white;
 
-				input {
-					font-size: 16px;	
-				}
-				
-				.save-button {
-					@include blue-button;
-					padding: 7px 20px 7px;
-					margin-right: 5px;
-				}
+			  input {
+	  	    font-size: 16px;        
+	  	  }
+	  	                    
+	  	  .save-button {
+	  	    @include blue-button;
+	  	    padding: 7px 20px 7px;
+	  	    margin-right: 5px;
+	  	  }
 
-				.cancel-button {
-					@include white-button;
-					padding: 7px 20px 7px;
-				}
-			}
+	  	  .cancel-button {
+	  	    @include white-button;
+	  	    padding: 7px 20px 7px;
+	  	  }
+	  	}
 
-			.section-published-date {
-				float: right;
-				width: 265px;
-				margin-right: 220px;
-				padding: 4px 10px;
-				@include border-radius(3px);
-				background: $lightGrey;
+	  	.section-published-date {
+	  	  float: right;
+	  	  width: 265px;
+	  	  margin-right: 220px;                              
+	  	  @include border-radius(3px);
+	  	  background: $lightGrey;
 
-				.published-status {
-					font-size: 12px;
-					margin-right: 15px;
+	  	  .published-status {
+	  	    font-size: 12px;
+	  	    margin-right: 15px;
 
-					strong {
-						font-weight: bold;
-					}
-				}
+	  	    strong {
+	  	      font-weight: bold;
+	  	    }
+	  	  }
 
-				.schedule-button {
-					@include blue-button;
-				}
+	  	  .schedule-button {
+	  	    @include blue-button;
+	  	  }
 
-				.edit-button {
-					@include blue-button;
-				}
+	  	  .edit-button {
+	  	    @include blue-button;
+	  	  }
 
-				.schedule-button,
-				.edit-button {
-					font-size: 11px;
-					padding: 3px 15px 5px;
-				}
-			}
-		}
+	  	  .schedule-button,
+	  	  .edit-button {
+	  	    font-size: 11px;
+	  	    padding: 3px 15px 5px;
+	  	   
+	  	    }
+	  	  }
 
-		.gradable-status {
-			position: absolute;
-			top: 20px;
-			right: 70px;
-			width: 145px;
+	  	  .gradable-status {
+	  	    position: absolute;
+	  	    top: 20px;
+	  	    right: 70px;
+	  	    width: 145px;
 
-			.status-label {
-				position: absolute;
-				top: 0;
-				right: 2px;
-				display: none;
-				width: 100px;
-				padding: 10px 35px 10px 10px;
-				@include border-radius(3px);
-				background: $lightGrey;
-				color: $lightGrey;
-				text-align: right;
-				font-size: 12px;
-				font-weight: bold;
-				line-height: 16px;
-			}
+	  	    .status-label {
+	  	      position: absolute;
+	  	      top: 0;
+	  	      right: 2px;
+	  	      display: none;
+	  	      width: 100px;
+	  	      padding: 10px 35px 10px 10px;
+	  	      @include border-radius(3px);
+	  	      background: $lightGrey;
+	  	      color: $lightGrey;
+	  	      text-align: right;
+	  	      font-size: 12px;
+	  	      font-weight: bold;
+	  	      line-height: 16px;
+	  	    }
 
-			.menu-toggle {
-				z-index: 10;
-				position: absolute;
-				top: 2px;
-				right: 5px;
-				padding: 5px;
-				color: $lightGrey;
+	  	    .menu-toggle {
+	  	      z-index: 10;
+	  	      position: absolute;
+	  	      top: 2px;
+	  	      right: 5px;
+	  	      padding: 5px;
+	  	      color: $lightGrey;
 
-				&:hover, &.is-active {
-					color: $blue;
-				}
-			}
+	  	      &:hover, &.is-active {
+	  	        color: $blue;
+	  	      }
+	  	    }
 
-			.menu {
-				z-index: 1;
-				display: none;
-				opacity: 0.0;
-				position: absolute;
-				top: -1px;
-				left: 2px;
-				margin: 0;
-				padding: 8px 12px;
-				background: $white;
-				border: 1px solid $mediumGrey;
-				font-size: 12px;
-				@include border-radius(4px);
-				@include box-shadow(0 1px 2px rgba(0, 0, 0, .2));
-				@include transition(opacity .15s);
-				@include transition(display .15s);
+	  	    .menu {
+	  	      z-index: 1;
+	  	      display: none;
+	  	      opacity: 0.0;
+	  	      position: absolute;
+	  	      top: -1px;
+	  	      left: 2px;
+	          margin: 0;
+	          padding: 8px 12px;
+	          background: $white;
+	          border: 1px solid $mediumGrey;
+	          font-size: 12px;
+	          @include border-radius(4px);
+	          @include box-shadow(0 1px 2px rgba(0, 0, 0, .2));
+	          @include transition(opacity .15s);
+	          @include transition(display .15s);
 
 
-				li {
-					width: 115px;
-					margin-bottom: 3px;
-					padding-bottom: 3px;
-					border-bottom: 1px solid $lightGrey;
+	          li {
+	            width: 115px;
+	            margin-bottom: 3px;
+	            padding-bottom: 3px;
+	            border-bottom: 1px solid $lightGrey;
 
-					&:last-child {
-						margin-bottom: 0;
-						padding-bottom: 0;
-						border: none;
+	            &:last-child {
+	              margin-bottom: 0;
+	              padding-bottom: 0;
+	              border: none;
 
-						a {
-							color: $darkGrey;
-						}
-					}
-				}
+	              a {
+	                color: $darkGrey;
+	              }
+	            }
+	          }
 
-				a {
+	          a {
 
-					&.is-selected {
-						font-weight: bold;
-					}
-				}
-			}
+	            &.is-selected {
+	              font-weight: bold;
+	            }
+	          }
+	      }
 
-			// dropdown state
-			&.is-active {
+	      // dropdown state
+	      &.is-active {
 
-				.menu {
-					z-index: 1000;
-					display: block;
-					opacity: 1.0;
-				}
+	        .menu {
+	          z-index: 1000;
+	          display: block;
+	          opacity: 1.0;
+	        }
 
-				.menu-toggle {
-					z-index: 10000;
-				}
-			}
 
-			// set state
-			&.is-set {
+          .menu-toggle {
+            z-index: 10000;
+          }
+        }
 
-				.menu-toggle {
-					color: $blue;
-				}
+        // set state
+        &.is-set {
 
-				.status-label {
-					display: block;
-					color: $blue;
-				}
-			}
-		}
+          .menu-toggle {
+            color: $blue;
+          }
 
-		.item-actions {	
+          .status-label {
+            display: block;
+            color: $blue;
+          }
+        }
+
+        float: left;
+        padding: 21px 0 0;
+      }
+    }
+
+		.item-actions {			
 			margin-top: 21px;
 			margin-right: 12px;
 
@@ -270,6 +427,13 @@ input.courseware-unit-search-input {
 		.drag-handle {
 			margin-left: 11px;
 		}
+	}
+
+	h3 {
+		font-size: 19px;
+		font-weight: 700;
+		color: $blue;
+	}
 
 	.section-name-span {
 		cursor: pointer;
@@ -305,9 +469,8 @@ input.courseware-unit-search-input {
 		font-size: 12px;
 		color: #878e9d;
 
-			strong {
-				font-weight: bold;
-			}
+		strong {
+			font-weight: bold;
 		}
 	}
 
@@ -324,124 +487,6 @@ input.courseware-unit-search-input {
 			@include tree-view;
 			border-top-width: 0;
 		}
-
-		.branch {
-
-			.section-item {
-				@include clearfix();
-
-				.details {
-					float: left;
-					width: 650px;
-				}
-
-				.gradable-status {
-					float: right;
-					position: relative;
-					top: -4px;
-					right: 50px;
-					width: 145px;
-
-					.status-label {
-						position: absolute;
-						top: 2px;
-						right: -5px;
-						display: none;
-						width: 110px;
-						padding: 5px 40px 5px 10px;
-						@include border-radius(3px);
-						color: $lightGrey;
-						text-align: right;
-						font-size: 12px;
-						font-weight: bold;
-						line-height: 16px;
-					}
-
-					.menu-toggle {
-						z-index: 10;
-						position: absolute;
-						top: 0;
-						right: 5px;
-						padding: 5px;
-						color: $mediumGrey;
-
-						&:hover, &.is-active {
-							color: $blue;
-						}
-					}
-
-					.menu {
-						z-index: 1;
-						display: none;
-						opacity: 0.0;
-						position: absolute;
-						top: -1px;
-						left: 5px;
-						margin: 0;
-						padding: 8px 12px;
-						background: $white;
-						border: 1px solid $mediumGrey;
-						font-size: 12px;
-						@include border-radius(4px);
-						@include box-shadow(0 1px 2px rgba(0, 0, 0, .2));
-						@include transition(opacity .15s);
-
-
-						li {
-							width: 115px;
-							margin-bottom: 3px;
-							padding-bottom: 3px;
-							border-bottom: 1px solid $lightGrey;
-
-							&:last-child {
-								margin-bottom: 0;
-								padding-bottom: 0;
-								border: none;
-
-								a {
-									color: $darkGrey;
-								}
-							}
-						}
-
-						a {
-							color: $blue;
-
-							&.is-selected {
-								font-weight: bold;
-							}
-						}
-					}
-
-					// dropdown state
-					&.is-active {
-
-						.menu {
-							z-index: 1000;
-							display: block;
-							opacity: 1.0;
-						}
-
-						.menu-toggle {
-							z-index: 10000;
-						}
-					}
-
-					// set state
-					&.is-set {
-
-						.menu-toggle {
-							color: $blue;
-						}
-
-						.status-label {
-							display: block;
-							color: $blue;
-						}
-					}
-				}
-			}
-		}
 	}
 
 	&.new-section {
@@ -545,7 +590,7 @@ input.courseware-unit-search-input {
 	}
 
 	strong {
-		font-weight: bold;
+		font-weight: 700;
 	}
 
 	.start-date,
diff --git a/cms/static/sass/_subsection.scss b/cms/static/sass/_subsection.scss
index 116c887e10..32c983ee3a 100644
--- a/cms/static/sass/_subsection.scss
+++ b/cms/static/sass/_subsection.scss
@@ -182,106 +182,106 @@
 
 .gradable {
 
-	label {
-		display: inline-block;
-		vertical-align: top;
-	}
+  label {
+    display: inline-block;
+    vertical-align: top;
+  }
 
-	.gradable-status {
-		position: relative;
-		top: -4px;
-		display: inline-block;
-		margin-left: 10px;
-		width: 65%;
+  .gradable-status {
+    position: relative;
+    top: -4px;
+    display: inline-block;
+    margin-left: 10px;
+    width: 65%;
 
-		.status-label {
-			margin: 0;
-			padding: 0;
-			background: transparent;
-			color: $blue;
-			border: none;
-			font-size: 11px;
-			font-weight: bold;
-			text-transform: uppercase;
-		}
+    .status-label {
+      margin: 0;
+      padding: 0;
+      background: transparent;
+      color: $blue;
+      border: none;
+      font-size: 11px;
+      font-weight: bold;
+      text-transform: uppercase;
+    }
 
-		.menu-toggle {
-			z-index: 100;
-			position: absolute;
-			top: 0;
-			left: 0;
-			width: 100%;
-			height: 20px;
-			background: transparent;
+    .menu-toggle {
+      z-index: 100;
+      position: absolute;
+      top: 0;
+      left: 0;
+      width: 100%;
+      height: 20px;
+      background: transparent;
 
-			&:hover, &.is-active {
-				color: $blue;
-			}
-		}
+      &:hover, &.is-active {
+              color: $blue;
+      }
+    }
 
-		.menu {
-			z-index: 1;
-			position: absolute;
-			top: -12px;
-			left: -7px;
-			display: none;
-			width: 100%;
-			margin: 0;
-			padding: 8px 12px;
-			opacity: 0.0;
-			background: $white;
-			border: 1px solid $mediumGrey;
-			font-size: 12px;
-			@include border-radius(4px);
-			@include box-shadow(0 1px 2px rgba(0, 0, 0, .2));
-			@include transition(opacity .15s);
+    .menu {
+      z-index: 1;
+      position: absolute;
+      top: -12px;
+      left: -7px;
+      display: none;
+      width: 100%;
+      margin: 0;
+      padding: 8px 12px;
+      opacity: 0.0;
+      background: $white;
+      border: 1px solid $mediumGrey;
+      font-size: 12px;
+      @include border-radius(4px);
+      @include box-shadow(0 1px 2px rgba(0, 0, 0, .2));
+      @include transition(opacity .15s);
 
 
-			li {
-				margin-bottom: 3px;
-				padding-bottom: 3px;
-				border-bottom: 1px solid $lightGrey;
+      li {
+        margin-bottom: 3px;
+        padding-bottom: 3px;
+        border-bottom: 1px solid $lightGrey;
 
-				&:last-child {
-					margin-bottom: 0;
-					padding-bottom: 0;
-					border: none;
-				}
-			}
+        &:last-child {
+          margin-bottom: 0;
+          padding-bottom: 0;
+          border: none;
+        }
+      }
 
-			a {
+      a {
 
-				&.is-selected {
-					font-weight: bold;
-				}
-			}
-		}
+        &.is-selected {
+          font-weight: bold;
+        }
+      }
+    }
 
-		// dropdown state
-		&.is-active {
+    // dropdown state
+    &.is-active {
 
-			.menu {
-				z-index: 10000;
-				display: block;
-				opacity: 1.0;
-			}
+      .menu {
+        z-index: 10000;
+        display: block;
+        opacity: 1.0;
+      }
 
-			.menu-toggle {
-				z-index: 1000;
-			}
-		}
+      .menu-toggle {
+        z-index: 1000;
+      }
+    }
 
-		// set state
-		&.is-set {
+    // set state
+    &.is-set {
 
-			.menu-toggle {
-				color: $blue;
-			}
+      .menu-toggle {
+        color: $blue;
+      }
 
-			.status-label {
-				display: block;
-				color: $blue;
-			}
-		}
-	}
-	}
\ No newline at end of file
+      .status-label {
+        display: block;
+        color: $blue;
+      }
+    }
+  }
+}
\ No newline at end of file
diff --git a/cms/static/sass/_variables.scss b/cms/static/sass/_variables.scss
index 7aa589edc1..a783abeaeb 100644
--- a/cms/static/sass/_variables.scss
+++ b/cms/static/sass/_variables.scss
@@ -12,7 +12,6 @@ $body-line-height: golden-ratio(.875em, 1);
 
 $white: rgb(255,255,255);
 $black: rgb(0,0,0);
-
 $pink: rgb(182,37,104);
 $error-red: rgb(253, 87, 87);
 
@@ -21,12 +20,6 @@ $offBlack: #3c3c3c;
 $black: rgb(0,0,0);
 $white: rgb(255,255,255);
 $blue: #5597dd;
-$lightBlue: tint($blue, 75%);
-$extraLightBlue: tint($lightBlue, 75%);
-$darkBlue: shade($blue, 25%);
-$extraDarkBlue: shade($darkBlue, 25%);
-$lightTransparentBlue: rgba(167, 192, 221, 0.3);
-
 $orange: #edbd3c;
 $red: #b20610;
 $green: #108614;