Style Dashboard tabs to match visual style of other tabs in app

Author: andrewn

client/styles/components/_dashboard-header.scss

@@ -1,46 +1,35 @@
 .dashboard-header {
-  padding: 24px 66px;
+  padding: #{24 / $base-font-size}rem #{66 / $base-font-size}rem;
 }
 
 .dashboard-header__tabs {
   display: flex;
   padding-top: #{24 / $base-font-size}rem;
-  padding-bottom: #{24 / $base-font-size}rem;
+  margin-bottom: #{24 / $base-font-size}rem;
+  @include themify() {
+    border-bottom: 1px solid getThemifyVariable('inactive-text-color');
+  }
 }
 
 .dashboard-header__tab {
   @include themify() {
     color: getThemifyVariable('inactive-text-color');
-    border-right: 2px solid getThemifyVariable('inactive-text-color');
+    border-bottom: #{4 / $base-font-size}rem solid transparent;
 
-    padding: 0 13px;
+    padding: 0 0 #{8 / $base-font-size}rem 0;
+    margin-right: #{26 / $base-font-size}rem;
 
-    &:hover, &:focus {
-      color: getThemifyVariable('primary-text-color');
-      cursor: pointer; 
-    }
-    &:focus {
+    &:hover, &:focus, &.dashboard-header__tab--selected {
       color: getThemifyVariable('primary-text-color');
+      border-bottom-color: getThemifyVariable('nav-hover-color');
       cursor: pointer; 
     }
   }
 
   font-size: #{21 / $base-font-size}rem;
 }
 
-
-.dashboard-header__tab:first-child {
-  padding-left: 0;
-}
-
-.dashboard-header__tab:last-child {
-  border-right: none;
-}
-
 .dashboard-header__tab--selected {
-  @include themify() {
-    color: getThemifyVariable('primary-text-color');
-  }
   cursor: auto;
 }
 
@@ -49,5 +38,6 @@
 }
 
 .dashboard-header__tab__title {
+  font-weight: bold;
   margin: 0;
 }