ui: styles, simpler active state

ui/styles/_buttons.scss

@@ -2,6 +2,7 @@
     text-transform: uppercase;
     font-weight: 600;
     font-size: 12px;
+    border-width: 2px;
     color: $gray;
     @include transition(background-color .1s ease-in-out);
 
@@ -19,9 +20,9 @@
     }
 
     &.btn-primary, &.active {
-        color: $purple;
+        color: $purple-dark;
         background-color: transparent;
-        border: 2px solid $purple;
+        border: 2px solid $purple-dark;
 
         &:hover {
             background-color: $light-purple;

ui/styles/_lists.scss

@@ -1,7 +1,7 @@
 .list-group-item {
     padding: 0;
     border-width: 2px;
-    border-bottom-width: 4px;
+    border-bottom-width: 2px;
     border-radius: 0px;
     margin-bottom: 15px;
     margin-top: 15px;
@@ -42,7 +42,7 @@
     }
 
     &.active {
-        background-color: $purple;
+        border-color: $gray;
     }
 
 }

ui/styles/_panels.scss

@@ -46,11 +46,11 @@
     }
 
     &.panel-link {
-        border-bottom-width: 4px;
+        border-bottom-width: 2px;
     }
 
     &.panel-short {
-        border-bottom-width: 2px;
+        border-bottom-width: 0px;
     }
 
     &.panel-link:hover {

ui/styles/_variables.scss

@@ -12,7 +12,8 @@ $red-darker:                #b03c44;
 $tan:                       #f0f0e5;
 $consul-gray:               #909090;
 $consul-footer-gray:        #d7d4d7;
-$purple:                    #69499a;
+$purple-dark:                    #69499a;
+$purple:                    lighten($purple-dark, 20%);
 $light-purple:              #f7f3f9;
 
 $green-faded:               #BBF085;