UX: Globally dim categories slightly

app/assets/stylesheets/common/base/_topic-list.scss

@@ -50,9 +50,6 @@
   a.title:not(.badge-notification) {
     color: $primary-medium;
   }
-  a.badge-wrapper {
-    opacity: 0.6;
-  }
 }
 
 .topic-list-main-link {
@@ -136,6 +133,10 @@
 
   .link-bottom-line {
     font-size: $font-down-1;
+    a.badge-wrapper.box {
+      padding-top: 0;
+      padding-bottom: 0;
+    }
   }
 
   .topic-featured-link {

app/assets/stylesheets/common/base/header.scss

@@ -264,12 +264,22 @@
       min-width: 5px;
     }
   }
+  .badge-wrapper {
+    &.bullet,
+    &.bar,
+    &.none {
+      span.badge-category {
+        color: $header_primary-high;
+      }
+    }
+  }
   .topic-header-extra {
     display: inline-flex;
     align-items: center;
     max-width: 100%;
     flex: 1 0 0%; // unit on flex-basis is required for IE11
     .discourse-tags {
+      color: $header_primary-high;
       overflow: hidden;
       white-space: nowrap;
       text-overflow: ellipsis;

app/assets/stylesheets/common/base/tagging.scss

@@ -80,7 +80,7 @@ $tag-color: $primary-medium;
   }
 
   .extra-info-wrapper & {
-    color: $header-primary !important;
+    color: $header-primary_high !important;
   }
 
   &.box {

app/assets/stylesheets/common/components/badges.scss

@@ -42,7 +42,7 @@
   &.bullet {
     margin-right: 12px;
     span.badge-category {
-      color: $primary;
+      color: $primary-high;
       overflow: hidden;
       text-overflow: ellipsis;
       .extra-info-wrapper & {
@@ -114,7 +114,7 @@
     margin-right: 5px;
 
     span.badge-category {
-      color: $primary;
+      color: $primary-high;
       padding: 1px 3px;
       overflow: hidden;
       text-overflow: ellipsis;
@@ -139,7 +139,7 @@
   // ----- No category style
 
   &.none {
-    color: $primary;
+    color: $primary-high;
     margin-right: 5px;
   }
 }

app/assets/stylesheets/common/foundation/variables.scss

@@ -204,7 +204,12 @@ $primary-high: dark-light-diff($primary, $secondary, 30%, -10%);
 //header_primary
 $header_primary-low: dark-light-diff($header_primary, $secondary, 90%, -65%);
 $header_primary-medium: dark-light-diff($header_primary, $secondary, 50%, -20%);
-$header_primary-high: dark-light-diff($header_primary, $secondary, 20%, 20%);
+$header_primary-high: dark-light-diff(
+  $header_primary,
+  $header_background,
+  30%,
+  -10%
+);
 
 //secondary
 $secondary-low: dark-light-diff($secondary, $primary, 70%, -70%);

app/assets/stylesheets/mobile/topic-list.scss

@@ -208,10 +208,6 @@
     }
   }
 
-  .visited .topic-item-stats .category {
-    opacity: 0.6;
-  }
-
   .age {
     white-space: nowrap;
     a {