diff --git a/app/assets/javascripts/discourse/components/user-card-contents.js.es6 b/app/assets/javascripts/discourse/components/user-card-contents.js.es6
index dc2f3342e4..a703de698b 100644
--- a/app/assets/javascripts/discourse/components/user-card-contents.js.es6
+++ b/app/assets/javascripts/discourse/components/user-card-contents.js.es6
@@ -1,7 +1,8 @@
 import { wantsNewWindow } from 'discourse/lib/intercept-click';
 import CleansUp from 'discourse/mixins/cleans-up';
 import afterTransition from 'discourse/lib/after-transition';
-import { default as computed } from 'ember-addons/ember-computed-decorators';
+import { propertyNotEqual, setting } from 'discourse/lib/computed';
+import { default as computed, observes } from 'ember-addons/ember-computed-decorators';
 import DiscourseURL from 'discourse/lib/url';
 import User from 'discourse/models/user';
 import { userPath } from 'discourse/lib/url';
@@ -16,6 +17,8 @@ const maxMembersToDisplay = 10;
 export default Ember.Component.extend(CleansUp, {
   elementId: 'user-card',
   classNameBindings: ['visible:show', 'showBadges', 'hasCardBadgeImage', 'user.card_background::no-bg'],
+  allowBackgrounds: setting('allow_profile_backgrounds'),
+  showBadges: setting('enable_badges'),
 
   postStream: Ember.computed.alias('topic.postStream'),
   viewingTopic: Ember.computed.match('currentPath', /^topic\./),
@@ -43,6 +46,21 @@ export default Ember.Component.extend(CleansUp, {
     return cardType === 'group';
   },
 
+  @observes('user.card_background')
+  addBackground() {
+    if (!this.get('allowBackgrounds')) { return; }
+
+    const $this = this.$();
+    if (!$this) { return; }
+
+    const url = this.get('user.card_background');
+    const bg = Ember.isEmpty(url) ? '' : `url(${Discourse.getURLWithCDN(url)})`;
+    $this.css('background-image', bg);
+  },
+
+  @computed('user.card_badge.image')
+  hasCardBadgeImage: image => image && image.indexOf('fa-') !== 0,
+
   _showUser(username, $target) {
     const args = { stats: false };
     args.include_post_count_for = this.get('topic.id');
diff --git a/app/assets/javascripts/discourse/components/user-card-user-contents.js.es6 b/app/assets/javascripts/discourse/components/user-card-user-contents.js.es6
index 7585c07e96..a4cbec5f28 100644
--- a/app/assets/javascripts/discourse/components/user-card-user-contents.js.es6
+++ b/app/assets/javascripts/discourse/components/user-card-user-contents.js.es6
@@ -1,4 +1,4 @@
-import { default as computed, observes } from 'ember-addons/ember-computed-decorators';
+import { default as computed } from 'ember-addons/ember-computed-decorators';
 import { propertyNotEqual, setting } from 'discourse/lib/computed';
 import { durationTiny } from 'discourse/lib/formatter';
 import CanCheckEmails from 'discourse/mixins/can-check-emails';
@@ -6,13 +6,13 @@ import CanCheckEmails from 'discourse/mixins/can-check-emails';
 export default Ember.Component.extend(CanCheckEmails, {
 
   allowBackgrounds: setting('allow_profile_backgrounds'),
+  showBadges: setting('enable_badges'),
 
   enoughPostsForFiltering: Ember.computed.gte('topicPostCount', 2),
   showFilter: Ember.computed.and('viewingTopic', 'postStream.hasNoFilters', 'enoughPostsForFiltering'),
   showName: propertyNotEqual('user.name', 'user.username'),
   hasUserFilters: Ember.computed.gt('postStream.userFilters.length', 0),
   isSuspended: Ember.computed.notEmpty('user.suspend_reason'),
-  showBadges: setting('enable_badges'),
   showMoreBadges: Ember.computed.gt('moreBadgesCount', 0),
   showDelete: Ember.computed.and("viewingAdmin", "showName", "user.canBeDeleted"),
   linkWebsite: Ember.computed.not('user.isBasic'),
@@ -50,21 +50,6 @@ export default Ember.Component.extend(CanCheckEmails, {
   @computed('user.badge_count', 'user.featured_user_badges.length')
   moreBadgesCount: (badgeCount, badgeLength) => badgeCount - badgeLength,
 
-  @computed('user.card_badge.image')
-  hasCardBadgeImage: image => image && image.indexOf('fa-') !== 0,
-
-  @observes('user.card_background')
-  addBackground() {
-    if (!this.get('allowBackgrounds')) { return; }
-
-    const $this = this.$();
-    if (!$this) { return; }
-
-    const url = this.get('user.card_background');
-    const bg = Ember.isEmpty(url) ? '' : `url(${Discourse.getURLWithCDN(url)})`;
-    $this.css('background-image', bg);
-  },
-
   @computed('user.time_read', 'user.recent_time_read')
   showRecentTimeRead(timeRead, recentTimeRead) {
     return timeRead !== recentTimeRead && recentTimeRead !== 0;