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

UX: Remove background color from new badge. DRY up lots of repeated code 

for rendering badges on topics.
This commit is contained in:
Robin Ward 2014-09-03 12:22:18 -04:00
parent 6489c1d7e3
commit 0b6c84e292
8 changed files with 44 additions and 53 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
app/assets/javascripts/discourse/components/topic-post-badges.js.es6 Normal file
View File

@ -0,0 +1,22 @@
// Creates a link
function link(buffer, prop, url, cssClass, i18nKey, text) {
if (!prop) { return; }
var title = I18n.t("topic." + i18nKey, {count: prop});
buffer.push("<a href='" + url + "' class='badge " + cssClass + " badge-notification' title='" + title + "'>" + (text || prop) + "</a>\n");
}
export default Ember.Component.extend({
tagName: 'span',
classNameBindings: [':topic-post-badges'],
_shouldRerender: Discourse.View.renderIfChanged('url', 'unread', 'newPosts', 'unseen'),
render: function(buffer) {
var url = this.get('url');
link(buffer, this.get('unread'), url, 'unread', 'unread_posts');
link(buffer, this.get('newPosts'), url, 'new-posts', 'new_posts');
link(buffer, this.get('unseen'), url, 'new-topic', 'new', I18n.t('filters.new.lower_title'));
}
});

13
app/assets/javascripts/discourse/templates/components/basic-topic-list.js.handlebars
View File

@ -22,15 +22,10 @@
<td class='main-link'>
{{topic-status topic=topic}}
<a class='title' href="{{unbound topic.lastUnreadUrl}}">{{{unbound topic.fancy_title}}}</a>
{{#if unread}}
<a href="{{unbound topic.lastUnreadUrl}}" class='badge unread badge-notification' title='{{i18n topic.unread_posts count="unread"}}'>{{unbound topic.unread}}</a>
{{/if}}
{{#if topic.new_posts}}
<a href="{{unbound topic.lastUnreadUrl}}" class='badge new-posts badge-notification' title='{{i18n topic.new_posts count="new_posts"}}'>{{unbound topic.new_posts}}</a>
{{/if}}
{{#if topic.unseen}}
<a href="{{unbound topic.lastUnreadUrl}}" class='badge new-posts badge-notification' title='{{i18n topic.new}}'>{{i18n filters.new.lower_title}}</a>
{{/if}}
{{topic-post-badges unread=unread
newPosts=topic.new_posts
unseen=topic.unseen
url=topic.lastUnreadUrl}}
</td>
{{#unless controller.hideCategory}}

7
app/assets/javascripts/discourse/templates/discovery/categories.js.handlebars
View File

@ -48,12 +48,7 @@
<div class="featured-topic">
{{topic-status topic=this}}
<a class='title' href="{{unbound lastUnreadUrl}}">{{{unbound fancy_title}}}</a>
{{#if totalUnread}}
<a href="{{unbound lastUnreadUrl}}" class='badge new-posts badge-notification' title='{{i18n topic.total_unread_posts count="totalUnread"}}'>{{totalUnread}}</a>
{{/if}}
{{#if unseen}}
<a href="{{unbound lastUnreadUrl}}" class='badge new-posts badge-notification' title='{{i18n topic.new}}'>{{i18n filters.new.lower_title}}</a>
{{/if}}
{{topic-post-badges unread=totalUnread unseen=unseen url=lastUnreadUrl}}
{{#if controller.latestTopicOnly}}
<div class='last-user-info'>

10
app/assets/javascripts/discourse/templates/list/topic_list_item.js.handlebars
View File

@ -13,15 +13,7 @@
<td class='main-link clearfix' {{bind-attr colspan="titleColSpan"}}>
{{topic-status topic=this.model}}
{{{topic-link this}}}
{{#if unread}}
<a href="{{lastUnreadUrl}}" class='badge unread badge-notification' title='{{i18n topic.unread_posts count="unread"}}'>{{unread}}</a>
{{/if}}
{{#if displayNewPosts}}
<a href="{{lastUnreadUrl}}" class='badge new-posts badge-notification' title='{{i18n topic.new_posts count="displayNewPosts"}}'>{{displayNewPosts}}</a>
{{/if}}
{{#if unseen}}
<a href="{{lastUnreadUrl}}" class='badge new-posts badge-notification' title='{{i18n topic.new}}'>{{i18n filters.new.lower_title}}</a>
{{/if}}
{{topic-post-badges unread=unread newPosts=displayNewPosts unseen=unseen url=lastUnreadUrl}}
{{#if hasExcerpt}}
<div class="topic-excerpt">

15
app/assets/javascripts/discourse/templates/mobile/components/basic-topic-list.js.handlebars
View File

@ -7,15 +7,12 @@
<div class='main-link clearfix'>
{{topic-status topic=this}}
{{{topic-link this}}}
{{#if unread}}
<a href="{{lastUnreadUrl}}" class='badge unread badge-notification' title='{{i18n topic.unread_posts count="unread"}}'>{{unread}}</a>
{{/if}}
{{#if displayNewPosts}}
<a href="{{lastUnreadUrl}}" class='badge new-posts badge-notification' title='{{i18n topic.new_posts count="displayNewPosts"}}'>{{displayNewPosts}}</a>
{{/if}}
{{#if unseen}}
<a href="{{lastUnreadUrl}}" class='badge new-posts badge-notification' title='{{i18n topic.new}}'><i class='fa fa-asterisk'></i></a>
{{/if}}
{{topic-post-badges unread=unread
newPosts=topic.new_posts
unseen=topic.unseen
url=topic.lastUnreadUrl}}
{{#if hasExcerpt}}
<div class="topic-excerpt">
{{excerpt}}

11
app/assets/javascripts/discourse/templates/mobile/discovery/categories.js.handlebars
View File

@ -22,16 +22,7 @@
{{topic-status topic=this}}
{{{topic-link this}}}
{{#if unread}}
<a href="{{unbound lastUnreadUrl}}" class='badge unread badge-notification' title='{{i18n topic.unread_posts count="unread"}}'>{{unbound unread}}</a>
{{/if}}
{{#if new_posts}}
<a href="{{unbound lastUnreadUrl}}" class='badge new-posts badge-notification' title='{{i18n topic.new_posts count="new_posts"}}'>{{unbound new_posts}}</a>
{{/if}}
{{#if unseen}}
<a href="{{unbound lastUnreadUrl}}" class='badge new-posts badge-notification' title='{{i18n topic.new}}'><i class='fa fa-asterisk'></i></a>
{{/if}}
{{topic-post-badges unread=unread newPosts=new_posts unseen=unseen url=lastUnreadUrl}}
{{#if hasExcerpt}}
<div class="topic-excerpt">
{{{excerpt}}}

13
app/assets/javascripts/discourse/templates/mobile/list/topic_list_item.js.handlebars
View File

@ -2,15 +2,10 @@
<div class='main-link clearfix'>
{{topic-status topic=this}}
{{{topic-link this}}}
{{#if unread}}
<a href="{{lastUnreadUrl}}" class='badge unread badge-notification' title='{{i18n topic.unread_posts count="unread"}}'>{{unread}}</a>
{{/if}}
{{#if displayNewPosts}}
<a href="{{lastUnreadUrl}}" class='badge new-posts badge-notification' title='{{i18n topic.new_posts count="displayNewPosts"}}'>{{displayNewPosts}}</a>
{{/if}}
{{#if unseen}}
<a href="{{lastUnreadUrl}}" class='badge new-posts badge-notification' title='{{i18n topic.new}}'><i class='fa fa-asterisk'></i></a>
{{/if}}
{{topic-post-badges unread=unread
newPosts=displayNewPosts
unseen=unseen
url=lastUnreadUrl}}
{{#if hasExcerpt}}
<div class="topic-excerpt">

6
app/assets/stylesheets/common/components/badges.css.scss
View File

@ -80,7 +80,11 @@ h1 a.badge-category div {vertical-align: top;}
font-weight: normal;
}
&.new-topic {
background-color: transparent;
color: scale-color($tertiary, $lightness: 50%);
font-weight: normal;
}
// Click count