From ae3f7dee8bbba5bb1717795fe5ce89f2a9baa1b3 Mon Sep 17 00:00:00 2001
From: Toby Zerner <toby.zerner@gmail.com>
Date: Thu, 23 Jul 2015 20:24:05 +0930
Subject: [PATCH] Fix user page display on mobile

---
 framework/core/js/forum/src/components/UserCard.js | 9 ++++++---
 framework/core/js/forum/src/components/UserPage.js | 3 +--
 framework/core/less/forum/UserCard.less            | 1 +
 framework/core/less/forum/UserPage.less            | 1 -
 4 files changed, 8 insertions(+), 6 deletions(-)

diff --git a/framework/core/js/forum/src/components/UserCard.js b/framework/core/js/forum/src/components/UserCard.js
index 3812930bd..0a2cd28ed 100644
--- a/framework/core/js/forum/src/components/UserCard.js
+++ b/framework/core/js/forum/src/components/UserCard.js
@@ -27,6 +27,7 @@ export default class UserCard extends Component {
     const user = this.props.user;
     const controls = UserControls.controls(user, this).toArray();
     const color = user.color();
+    const badges = user.badges().toArray();
 
     return (
       <div className={'UserCard ' + (this.props.className || '')}
@@ -53,9 +54,11 @@ export default class UserCard extends Component {
                   )}
               </h2>
 
-              <ul className="UserCard-badges badges">
-                {listItems(user.badges().toArray())}
-              </ul>
+              {badges.length ? (
+                <ul className="UserCard-badges badges">
+                  {listItems(badges)}
+                </ul>
+              ) : ''}
 
               <ul className="UserCard-info">
                 {listItems(this.infoItems().toArray())}
diff --git a/framework/core/js/forum/src/components/UserPage.js b/framework/core/js/forum/src/components/UserPage.js
index 775ab1b7f..0554c03fa 100644
--- a/framework/core/js/forum/src/components/UserPage.js
+++ b/framework/core/js/forum/src/components/UserPage.js
@@ -89,8 +89,7 @@ export default class UserPage extends Component {
    * Given a username, load the user's profile from the store, or make a request
    * if we don't have it yet. Then initialize the profile page with that user.
    *
-   * @param {[type]} username [description]
-   * @return {[type]}
+   * @param {String} username
    */
   loadUser(username) {
     const lowercaseUsername = username.toLowerCase();
diff --git a/framework/core/less/forum/UserCard.less b/framework/core/less/forum/UserCard.less
index 309cdbf95..fe10abb26 100644
--- a/framework/core/less/forum/UserCard.less
+++ b/framework/core/less/forum/UserCard.less
@@ -47,6 +47,7 @@
   margin-left: -130px;
 
   @media @phone {
+    display: block;
     float: none;
     margin: 0 auto 20px;
     width: 64px + 8px;
diff --git a/framework/core/less/forum/UserPage.less b/framework/core/less/forum/UserPage.less
index f3b3a98b0..b2a2af3cf 100644
--- a/framework/core/less/forum/UserPage.less
+++ b/framework/core/less/forum/UserPage.less
@@ -1,4 +1,3 @@
-
 .UserPage {
   .UserCard-controls {
     float: right;