From 67556e63814f3bcef258d2d11b515562b1f80fe0 Mon Sep 17 00:00:00 2001
From: Robin Ward <robin.ward@gmail.com>
Date: Fri, 28 Jul 2017 16:19:33 -0400
Subject: [PATCH] REFACTOR: Category / Tag Dropdown headers had extra classes

---
 .../discourse/components/category-drop.js.es6         |  6 ++++--
 .../javascripts/discourse/components/tag-drop.js.es6  |  2 +-
 .../discourse/templates/components/category-drop.hbs  |  6 +++---
 .../discourse/templates/components/tag-drop.hbs       | 10 +++++-----
 app/assets/stylesheets/common/base/_topic-list.scss   |  2 +-
 app/assets/stylesheets/common/components/badges.scss  | 11 ++++++-----
 app/assets/stylesheets/desktop/topic-list.scss        |  3 +--
 7 files changed, 21 insertions(+), 19 deletions(-)

diff --git a/app/assets/javascripts/discourse/components/category-drop.js.es6 b/app/assets/javascripts/discourse/components/category-drop.js.es6
index 53b49cd61ad..0f51ca5751b 100644
--- a/app/assets/javascripts/discourse/components/category-drop.js.es6
+++ b/app/assets/javascripts/discourse/components/category-drop.js.es6
@@ -35,7 +35,7 @@ export default Ember.Component.extend({
   }.property('category'),
 
   dropdownButtonClass: function() {
-    var result = 'badge-category category-dropdown-button';
+    let result = 'dropdown-header category-dropdown-button';
     if (Em.isNone(this.get('category'))) {
       result += ' home';
     }
@@ -85,7 +85,9 @@ export default Ember.Component.extend({
       }
     }
 
-    return "background-color: #eee; color: #333".htmlSafe();
+    if (categoryStyle === 'box') {
+      return "background-color: #eee; color: #333".htmlSafe();
+    }
   }.property('category'),
 
   clickEventName: function() {
diff --git a/app/assets/javascripts/discourse/components/tag-drop.js.es6 b/app/assets/javascripts/discourse/components/tag-drop.js.es6
index 1a9bf346c3a..698106c061e 100644
--- a/app/assets/javascripts/discourse/components/tag-drop.js.es6
+++ b/app/assets/javascripts/discourse/components/tag-drop.js.es6
@@ -69,7 +69,7 @@ export default Ember.Component.extend({
 
   @computed('tag')
   dropdownButtonClass() {
-    let result = 'badge-category category-dropdown-button';
+    let result = 'dropdown-header category-dropdown-button';
     if (Em.isNone(this.get('tag'))) {
       result += ' home';
     }
diff --git a/app/assets/javascripts/discourse/templates/components/category-drop.hbs b/app/assets/javascripts/discourse/templates/components/category-drop.hbs
index 6ce9703026c..d660be87db3 100644
--- a/app/assets/javascripts/discourse/templates/components/category-drop.hbs
+++ b/app/assets/javascripts/discourse/templates/components/category-drop.hbs
@@ -1,5 +1,5 @@
 {{#if category}}
-  <a href {{action "expand"}} class="badge-category" style={{badgeStyle}} aria-label={{i18n 'categories.category_list'}} aria-expanded={{expanded}}>
+  <a href {{action "expand"}} class="dropdown-header" style={{badgeStyle}} aria-label={{i18n 'categories.category_list'}} aria-expanded={{expanded}}>
     <span class="badge-category-bg" style={{categoryColor}}></span>
     {{#if category.read_restricted}}
       {{d-icon "lock"}}
@@ -8,9 +8,9 @@
   </a>
 {{else}}
   {{#if noSubcategories}}
-    <a href {{action "expand"}} class='badge-category home' style={{badgeStyle}} aria-label={{i18n 'categories.category_list'}} aria-expanded={{expanded}}>{{i18n 'categories.no_subcategory'}}</a>
+    <a href {{action "expand"}} class='dropdown-header home' style={{badgeStyle}} aria-label={{i18n 'categories.category_list'}} aria-expanded={{expanded}}>{{i18n 'categories.no_subcategory'}}</a>
   {{else}}
-    <a href {{action "expand"}} class='badge-category home' style={{badgeStyle}} aria-label={{i18n 'categories.category_list'}} aria-expanded={{expanded}}>{{allCategoriesLabel}}</a>
+    <a href {{action "expand"}} class='dropdown-header home' style={{badgeStyle}} aria-label={{i18n 'categories.category_list'}} aria-expanded={{expanded}}>{{allCategoriesLabel}}</a>
   {{/if}}
 {{/if}}
 
diff --git a/app/assets/javascripts/discourse/templates/components/tag-drop.hbs b/app/assets/javascripts/discourse/templates/components/tag-drop.hbs
index 9303ddb9666..8dc8869f6f0 100644
--- a/app/assets/javascripts/discourse/templates/components/tag-drop.hbs
+++ b/app/assets/javascripts/discourse/templates/components/tag-drop.hbs
@@ -1,12 +1,12 @@
 {{#if showTagDropdown}}
   {{#if tagId}}
     {{#if noTagsSelected}}
-      <a href {{action "expand"}} class="badge-category {{tagClass}} home">{{noTagsLabel}}</a>
+      <a href {{action "expand"}} class="dropdown-header {{tagClass}} home">{{noTagsLabel}}</a>
     {{else}}
-      <a href {{action "expand"}} class="badge-category {{tagClass}}">{{tagId}}</a>
+      <a href {{action "expand"}} class="dropdown-header {{tagClass}}">{{tagId}}</a>
     {{/if}}
   {{else}}
-    <a href {{action "expand"}} class="badge-category {{tagClass}} home">{{allTagsLabel}}</a>
+    <a href {{action "expand"}} class="dropdown-header {{tagClass}} home">{{allTagsLabel}}</a>
   {{/if}}
 
   {{#if tags}}
@@ -14,8 +14,8 @@
       {{d-icon expandedIcon}}
     </a>
     <section class="{{unless expanded 'hidden'}} category-dropdown-menu chooser">
-      <div class='cat'><a href={{allTagsUrl}} data-drop-close="true" class='badge-category home'>{{allTagsLabel}}</a></div>
-      <div class='cat'><a href={{noTagsUrl}}  data-drop-close="true" class='badge-category home'>{{noTagsLabel}}</a></div>
+      <div class='cat'><a href={{allTagsUrl}} data-drop-close="true" class='dropdown-header home'>{{allTagsLabel}}</a></div>
+      <div class='cat'><a href={{noTagsUrl}}  data-drop-close="true" class='dropdown-header home'>{{noTagsLabel}}</a></div>
       {{#if renderTags}}
         {{#each tags as |t|}}
           <div class='cat'>
diff --git a/app/assets/stylesheets/common/base/_topic-list.scss b/app/assets/stylesheets/common/base/_topic-list.scss
index f918da40ee2..73460e47c32 100644
--- a/app/assets/stylesheets/common/base/_topic-list.scss
+++ b/app/assets/stylesheets/common/base/_topic-list.scss
@@ -247,7 +247,7 @@ ol.category-breadcrumb {
     overflow:hidden;
     margin-bottom: 0;
   }
-  a.badge-category {
+  a.badge-category, .dropdown-header {
     font-size: 0.929em;
     font-weight: bold;
     float: none;
diff --git a/app/assets/stylesheets/common/components/badges.scss b/app/assets/stylesheets/common/components/badges.scss
index 065f3c98fba..c26997e4d9c 100644
--- a/app/assets/stylesheets/common/components/badges.scss
+++ b/app/assets/stylesheets/common/components/badges.scss
@@ -149,7 +149,7 @@
 
 .list-controls {
 .category-breadcrumb {
-  a.badge-category {
+  a.badge-category, .dropdown-header {
       display: inline-block;
       padding: 5px 8px;
       line-height: 20px;
@@ -164,16 +164,17 @@
       }
     }
 
-    li.bar>.badge-category:not(.home):first-child {
+    li.bar>.dropdown-header:not(.home):first-child {
       border-left: 5px solid;
+      font-size: 1em;
     }
 
-    li.bar>.badge-category {
+    li.bar>.dropdown-header {
       background: $primary-low;
       color: $primary;
     }
 
-    li.bullet>.badge-category {
+    li.bullet>.dropdown-header {
       background: $primary-low;
       color: $primary;
 
@@ -189,7 +190,7 @@
   }
 
   .category-dropdown-menu {
-    .badge-category {
+    .dropdown-header {
       &.home {
         margin-left: 4px;
         padding-left: 0;
diff --git a/app/assets/stylesheets/desktop/topic-list.scss b/app/assets/stylesheets/desktop/topic-list.scss
index de6b1ef496e..f877f044d6a 100644
--- a/app/assets/stylesheets/desktop/topic-list.scss
+++ b/app/assets/stylesheets/desktop/topic-list.scss
@@ -23,8 +23,7 @@
     float: none;
   }
 
-
-  a.badge-category {
+  a.badge-category, .dropdown-header {
     padding: 3px 12px;
     font-size: 1.143em;
   }