diff --git a/app/assets/javascripts/discourse/views/combobox_view_category.js b/app/assets/javascripts/discourse/views/combobox_view_category.js index f930212b8..3fbb6ad05 100644 --- a/app/assets/javascripts/discourse/views/combobox_view_category.js +++ b/app/assets/javascripts/discourse/views/combobox_view_category.js @@ -10,13 +10,14 @@ Discourse.ComboboxViewCategory = Discourse.ComboboxView.extend({ none: 'category.none', classNames: ['combobox category-combobox'], overrideWidths: true, - dataAttributes: ['name', 'color', 'text_color', 'description'], + dataAttributes: ['name', 'color', 'text_color', 'description', 'topic_count'], valueBinding: Ember.Binding.oneWay('source'), template: function(text, templateData) { if (!templateData.color) return text; var result = "<span class='badge-category' style='background-color: #" + templateData.color + '; color: #' + templateData.text_color + ";'>" + templateData.name + "</span>"; + result += " <span class='topic-count'>× " + templateData.topic_count + "</span>"; if (templateData.description && templateData.description !== 'null') { result += '<div class="category-desc">' + Handlebars.Utils.escapeExpression(templateData.description) + '</div>'; } diff --git a/app/assets/stylesheets/application/combobox.css.scss b/app/assets/stylesheets/application/combobox.css.scss index f433bafcd..3676af5c5 100644 --- a/app/assets/stylesheets/application/combobox.css.scss +++ b/app/assets/stylesheets/application/combobox.css.scss @@ -1,4 +1,11 @@ .category-combobox { + .topic-count { + font-size: 11px; + color: #666; + } + .highlighted .topic-count { + color: white; + } .category-desc { margin: 6px 0px 0px 3px; font-size: 12px; diff --git a/app/assets/stylesheets/application/topic.css.scss b/app/assets/stylesheets/application/topic.css.scss index 672948439..a392ba2c7 100644 --- a/app/assets/stylesheets/application/topic.css.scss +++ b/app/assets/stylesheets/application/topic.css.scss @@ -48,7 +48,7 @@ vertical-align: top; } } - .badge-category { + h1 > .badge-category { margin-top: 5px; vertical-align: top; }