Make active links bold; fix badge styling

app/assets/stylesheets/framework/header.scss

@@ -100,26 +100,42 @@ header {
         }
       }
     }
-    .global-dropdown {
-      position: absolute;
-      left: -10px;
+  }
+  .global-dropdown {
+    position: absolute;
+    left: -10px;
+
+    .badge {
+      font-size: 11px;
     }
-    .global-dropdown-toggle {
-      margin: 7px 0;
-      font-size: 18px;
-      padding: 6px 10px;
-      border: none;
-      background-color: $gray-light;
-      &:hover {
-        background-color: $white-normal;
-        color: $gl-header-nav-hover-color;
+    li.active {
+      a {
+        font-weight: bold;
+      }
+    }
+    li:hover {
+      .badge {
+        background-color: $white-light;
       }
     }
   }
+  .global-dropdown-toggle {
+    margin: 7px 0;
+    font-size: 18px;
+    padding: 6px 10px;
+    border: none;
+    background-color: $gray-light;
+
+    &:hover {
+      background-color: $white-normal;
+      color: $gl-header-nav-hover-color;
+    }
+  }
+
   .header-content {
     position: relative;
     height: $header-height;

app/views/layouts/header/_default.html.haml

@@ -6,12 +6,11 @@
         %button.global-dropdown-toggle{ type: 'button', 'data-toggle' => 'dropdown' }
           %span.sr-only Toggle navigation
           = icon('bars')
-        .dropdown-menu-nav
-          %ul
-            - if current_user
-              = render 'layouts/nav/dashboard'
-            - else
-              = render 'layouts/nav/explore'
+        .dropdown-menu-nav.global-dropdown-menu
+          - if current_user
+            = render 'layouts/nav/dashboard'
+          - else
+            = render 'layouts/nav/explore'
       %button.navbar-toggle{ type: 'button' }
         %span.sr-only Toggle navigation
         = icon('ellipsis-v')