More SCSS Adjustments

_scss/config.scss

@@ -1,5 +1,18 @@
 $primary-color: #00AEEF;
 $secondary-color: #F21847;
+$secondary-hover-color: #A20023;
+
+$light-font-color: #666;
+$light-font-strong-color: #555;
+$light-font-bold-color: #333;
+
+$panel-header-color: #DDD;
+$panel-border-color: $panel-header-color;
+$panel-recessed-color: #E6E6E6;
+$panel-body-color: #EEE;
+
+$axis-color: #DDD;
+$axis-rugline-color: #AAA;
 
 $standard-font: "Open Sans";
 $stylized-font: "Cubano";

_scss/layout.scss

@@ -17,7 +17,7 @@ a {
   text-decoration: none;
 
   &:hover {
-    color: #A20023;
+    color: $secondary-hover-color;
     text-decoration: none;
   }
 }
@@ -28,18 +28,8 @@ h1, h2, h3 {
   font-family: $stylized-font
 }
 
-.home-link {
-  color: #555;
-  text-decoration: none;
-
-  &:hover {
-    text-decoration: underline;
-    color: #555;
-  }
-}
-
 h1 {
-  color: #555;
+  color: $light-font-strong-color;
   .gdq-link {
     font-size: 32px;
     border-bottom: 2px solid $primary-color;
@@ -51,7 +41,6 @@ h3 {
   font-size: 18px;
 }
 
-
 tbody {
   tr {
     display: block;
@@ -71,13 +60,13 @@ tbody {
   font-weight: 200;
 
   text {
-    fill: #222;
+    fill: $light-font-bold-color;
     font-weight: 300;
   }
 
   path, line {
     shape-rendering: crispEdges;
-    stroke: #ddd;
+    stroke: $axis-color;
     fill: none;
   }
 }
@@ -117,7 +106,7 @@ tbody {
 }
 
 .gameLine {
-  stroke: #aaa;
+  stroke: $axis-rugline-color;
   stroke-width: 1px;
 }
 
@@ -133,7 +122,7 @@ tbody {
 }
 
 .brush .extent {
-  stroke: #fff;
+  stroke: white;
   fill-opacity: .125;
   fill: $primary-color;
   shape-rendering: crispEdges;
@@ -146,18 +135,18 @@ tbody {
 }
 
 .section {
-  border-left:  2px solid #ddd;
-  border-right: 2px solid #ddd;
+  border-left:  2px solid $panel-border-color;
+  border-right: 2px solid $panel-border-color;
   margin-bottom: 40px;
   vertical-align: top;
-  border-bottom: 2px solid #ddd;
+  border-bottom: 2px solid $panel-border-color;
 
   h2 {
     text-align: left;
     padding: 10px;
     margin-bottom: 0px;
     font-size: 18px;
-    background-color: #ddd;
+    background-color: $panel-header-color;
   }
 }
 
@@ -170,13 +159,13 @@ tbody {
   text-align: left;
   padding: 10px;
   font-size: 16px;
-  background-color: #eee;
+  background-color: $panel-body-color;
   margin-top: 0px;
 }
 
 .gdq-links {
-  background-color: #e6e6e6;
-  border-top: 2px #ddd solid;
+  background-color: $panel-recessed-color;
+  border-top: 2px $panel-border-color solid;
 
   div {
     width: 33%;
@@ -217,22 +206,22 @@ tbody {
   margin: 3px solid #fdfdfd;
   margin-right: 10px;
   margin-right: 10px;
-  border: 1px solid #ddd;
+  border: 1px solid $panel-border-color;
   text-align: center;
   font-family: $standard-font;
   width: 225px;
 }
 
 .tool-game {
-  background-color: #ddd;
+  background-color: $panel-header-color;
   font-family: $stylized-font;
   font-weight: bold;
   font-size: 16px;
   height: 40px;
 }
 
 .tool-date {
-  background-color: #ddd;
+  background-color: $panel-header-color;
   color: #777;
   font-weight: 300;
 }
@@ -250,7 +239,7 @@ tbody {
 }
 
 .tool-footer {
-  background-color: #ddd;
+  background-color: $panel-header-color;
   font-weight: 800;
   color: #555;
 }
@@ -271,10 +260,10 @@ tbody {
 #game-list {
   height: 500px;
   overflow: hidden;
-  border-bottom: 2px solid #ddd;
+  border-bottom: 2px solid $panel-border-color;
 
   thead {
-    background-color: #eee;
+    background-color: $panel-body-color;
     padding: 0px;
     display: block;
   }
@@ -309,7 +298,7 @@ tbody {
 }
 
 .game-info-box {
-  border: 1px #ddd solid;
+  border: 1px $panel-border-color solid;
 }
 
 .column {
@@ -348,7 +337,7 @@ tbody {
 }
 
 .series-options {
-  background-color: #eee;
+  background-color: $panel-body-color;
   padding: 10px;
   font-family: $stylized-font;
   font-size: 14px;
@@ -375,12 +364,12 @@ tbody {
   text-align: right;
 
   a {
-    color: #333;
+    color: $light-font-bold-color;
     font-weight: bold;
     padding-right: 5px;
 
     &:hover {
-      color: #666;
+      color: $light-font-color;
     }
   }
 }
@@ -394,6 +383,6 @@ tbody {
 }
 
 footer {
-  color: #666;
+  color: $light-font-color;
   font-size: 14px;
 }