Discource-C
/
discourse
mirror of https://github.com/discourse/discourse.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

UX: add more tag classes to topic view (#7228) 

adds tag classes where there is already category-* class
This commit is contained in:
Maja Komel 2019-03-21 17:49:50 +01:00 committed by Régis Hanol
parent 252e17ea1b
commit 1f1d3909e5
5 changed files with 18 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
app/assets/javascripts/discourse/components/add-category-class.js.es6 → app/assets/javascripts/discourse/components/add-category-tag-classes.js.es6
View File

@ -13,20 +13,24 @@ export default Ember.Component.extend({
return; return;
} }
const slug = this.get("category.fullSlug"); const slug = this.get("category.fullSlug");
const tags = this.get("tags");
this._removeClass(); this._removeClass();
if (slug) {
$("body").addClass(`category-${slug}`); let classes = [];
} if (slug) classes.push(`category-${slug}`);
if (tags) tags.forEach(t => classes.push(`tag-${t}`));
if (classes.length > 0) $("body").addClass(classes.join(" "));
}, },
@observes("category.fullSlug") @observes("category.fullSlug", "tags")
refreshClass() { refreshClass() {
Ember.run.scheduleOnce("afterRender", this, this._updateClass); Ember.run.scheduleOnce("afterRender", this, this._updateClass);
}, },
_removeClass() { _removeClass() {
$("body").removeClass((_, css) => $("body").removeClass((_, css) =>
(css.match(/\bcategory-\S+/g) || []).join(" ") (css.match(/\b(?:category|tag)-\S+/g) || []).join(" ")
); );
}, },

3
app/assets/javascripts/discourse/components/discourse-topic.js.es6
View File

@ -24,7 +24,8 @@ export default Ember.Component.extend(AddArchetypeClass, Scrolling, {
"topic.is_warning", "topic.is_warning",
"topic.category.read_restricted:read_restricted", "topic.category.read_restricted:read_restricted",
"topic.deleted:deleted-topic", "topic.deleted:deleted-topic",
"topic.categoryClass" "topic.categoryClass",
"topic.tagClasses"
], ],
menuVisible: true, menuVisible: true,
SHORT_POST: 1200, SHORT_POST: 1200,

5
app/assets/javascripts/discourse/models/topic.js.es6
View File

@ -225,6 +225,11 @@ const Topic = RestModel.extend({
categoryClass: fmt("category.fullSlug", "category-%@"), categoryClass: fmt("category.fullSlug", "category-%@"),
@computed("tags")
tagClasses(tags) {
return tags.map(t => `tag-${t}`).join(" ");
},
@computed("url") @computed("url")
shareUrl(url) { shareUrl(url) {
const user = Discourse.User.current(); const user = Discourse.User.current();

2
app/assets/javascripts/discourse/templates/navigation/category.hbs
View File

@ -1,5 +1,5 @@
{{#d-section class="navigation-container"}} {{#d-section class="navigation-container"}}
{{add-category-class category=category}} {{add-category-tag-classes category=category}}
<section class='category-heading'> <section class='category-heading'>
{{#if category.uploaded_logo.url}} {{#if category.uploaded_logo.url}}

2
app/assets/javascripts/discourse/templates/topic.hbs
View File

@ -1,6 +1,6 @@
{{#discourse-topic multiSelect=multiSelect enteredAt=enteredAt topic=model hasScrolled=hasScrolled}} {{#discourse-topic multiSelect=multiSelect enteredAt=enteredAt topic=model hasScrolled=hasScrolled}}
{{#if model}} {{#if model}}
{{add-category-class category=model.category}} {{add-category-tag-classes category=model.category tags=model.tags}}
<div class="container"> <div class="container">
{{discourse-banner user=currentUser banner=site.banner overlay=hasScrolled hide=model.errorLoading}} {{discourse-banner user=currentUser banner=site.banner overlay=hasScrolled hide=model.errorLoading}}
</div> </div>