memberinfo look & feel

This commit is contained in:
Matthew Hodgson 2015-10-25 22:55:30 +00:00
parent 729babae4f
commit 7fdb82d87f
4 changed files with 49 additions and 7 deletions

View file

@ -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;
}

View file

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

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.1 KiB

View file

@ -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}
{muteButton}
{kickButton}
{banButton}
{giveModButton}
<div className="mx_MemberInfo_buttons">
{interactButton}
{muteButton}
{kickButton}
{banButton}
{giveModButton}
</div>
</div>
);
}