diff --git a/skins/base/css/molecules/RoomTile.css b/skins/base/css/molecules/RoomTile.css index 6e19395e67..b258ea33e4 100644 --- a/skins/base/css/molecules/RoomTile.css +++ b/skins/base/css/molecules/RoomTile.css @@ -29,8 +29,8 @@ limitations under the License. padding-top: 3px; padding-bottom: 3px; vertical-align: middle; - width: 32px; - height: 32px; + width: 40px; + height: 40px; } .mx_RoomTile_avatar img { @@ -38,6 +38,12 @@ limitations under the License. background-color: #dbdbdb; } +.mx_RoomTile_nameBadge { + display: table; + width: 100%; + height: 50px; +} + .mx_RoomTile_name { display: table-cell; vertical-align: middle; @@ -45,8 +51,13 @@ limitations under the License. text-overflow: ellipsis; } +.mx_RoomTile_badgeCell { + display: table-cell; + vertical-align: middle; + width: 26px; +} + .mx_RoomTile_badge { - float: right; background-color: #80cef4; color: #fff; border-radius: 26px; diff --git a/skins/base/views/molecules/RoomTile.js b/skins/base/views/molecules/RoomTile.js index 00d16cf060..4470957766 100644 --- a/skins/base/views/molecules/RoomTile.js +++ b/skins/base/views/molecules/RoomTile.js @@ -43,10 +43,17 @@ module.exports = React.createClass({ else if (this.props.unread) { badge =
1
; } + var nameCell; + if (badge) { + nameCell =
{name}
{badge}
; + } + else { + nameCell =
{name}
; + } return (
-
{name}{ badge }
+ { nameCell }
); }