memberinfo look & feel

src/skins/vector/css/molecules/MemberInfo.css

@@ -18,6 +18,45 @@ limitations under the License.
     height: 100%;
 }
 
+.mx_MemberInfo h2 {
+    margin-top: 6px;
+}
+
 .mx_MemberInfo_cancel {
     float: right;
+    margin-right: 18px;
+    cursor: pointer;
+}
+
+.mx_MemberInfo_avatar {
+    clear: both;
+}
+
+.mx_MemberInfo_avatar img {
+    border-radius: 48px;
+}
+
+.mx_MemberInfo_profileField {
+    opacity: 0.6;
+    font-size: 14px;
+}
+
+.mx_MemberInfo_buttons {
+    margin-top: 18px;
+}
+
+.mx_MemberInfo_field {
+    cursor: pointer;
+    width: 100px;
+    text-align: center;
+    font-size: 12px;    
+    background-color: #888;
+    color: #fff;
+    font-weight: bold;
+    border-radius: 20px;
+    padding-left: 6px;
+    padding-right: 6px;
+    padding-top: 4px;
+    padding-bottom: 2px;
+    margin-bottom: 4px;
 }

src/skins/vector/css/molecules/MemberTile.css

@@ -18,6 +18,7 @@ limitations under the License.
     display: table-row;
     position: relative;
     color: #454545;
+    cursor: pointer;
 }
 
 .mx_MemberTile_avatar {

src/skins/vector/views/molecules/MemberInfo.js

@@ -71,7 +71,7 @@ module.exports = React.createClass({
         var MemberAvatar = sdk.getComponent('atoms.MemberAvatar');
         return (
             <div className="mx_MemberInfo">
-                <img className="mx_MemberInfo_cancel" src="img/cancel.png" width="18" height="18" onClick={this.onCancel}/>
+                <img className="mx_MemberInfo_cancel" src="img/cancel-black.png" width="18" height="18" onClick={this.onCancel}/>
                 <div className="mx_MemberInfo_avatar">
                     <MemberAvatar member={this.props.member} width={48} height={48} />
                 </div>
@@ -79,11 +79,13 @@ module.exports = React.createClass({
                 <div className="mx_MemberInfo_profileField">
                     { this.props.member.userId }
                 </div>
-                {interactButton}
+                <div className="mx_MemberInfo_buttons">
-                {muteButton}
+                    {interactButton}
-                {kickButton}
+                    {muteButton}
-                {banButton}
+                    {kickButton}
-                {giveModButton}
+                    {banButton}
+                    {giveModButton}
+                </div>
             </div>
         );
     }