diff --git a/skins/base/css/molecules/MemberTile.css b/skins/base/css/molecules/MemberTile.css index d47768f390..ba64ec9532 100644 --- a/skins/base/css/molecules/MemberTile.css +++ b/skins/base/css/molecules/MemberTile.css @@ -71,14 +71,26 @@ limitations under the License. text-overflow: ellipsis; } +.mx_MemberTile_nameWrapper { + display: table-cell; + vertical-align: middle; + overflow: hidden; + text-overflow: ellipsis; +} + +.mx_MemberTile_nameSpan { +} + .mx_MemberTile_unavailable .mx_MemberTile_avatar, -.mx_MemberTile_unavailable .mx_MemberTile_name +.mx_MemberTile_unavailable .mx_MemberTile_name, +.mx_MemberTile_unavailable .mx_MemberTile_nameSpan { opacity: 0.75; } .mx_MemberTile_offline .mx_MemberTile_avatar, -.mx_MemberTile_offline .mx_MemberTile_name +.mx_MemberTile_offline .mx_MemberTile_name, +.mx_MemberTile_offline .mx_MemberTile_nameSpan { opacity: 0.5; } \ No newline at end of file diff --git a/skins/base/views/molecules/MemberTile.js b/skins/base/views/molecules/MemberTile.js index 8dd3f00ab1..9583c3c4d3 100644 --- a/skins/base/views/molecules/MemberTile.js +++ b/skins/base/views/molecules/MemberTile.js @@ -58,6 +58,21 @@ module.exports = React.createClass({ } mainClassName += presenceClass; + var name; + if (this.state.hover) { + name = +
+ + {this.props.member.name} +
+ } + else { + name = +
+ {this.props.member.name} +
+ } + return (
@@ -66,10 +81,7 @@ module.exports = React.createClass({ width="40" height="40" alt=""/> { power }
-
- { this.state.hover ? : null } - {this.props.member.name} -
+ { name }
); } diff --git a/skins/base/views/organisms/RightPanel.js b/skins/base/views/organisms/RightPanel.js index 5b6477a0d0..e5ca89c909 100644 --- a/skins/base/views/organisms/RightPanel.js +++ b/skins/base/views/organisms/RightPanel.js @@ -33,7 +33,7 @@ module.exports = React.createClass({ getInitialState: function() { return { - phase : this.Phase.None + phase : this.Phase.MemberList } },