switch to lozenges, and improve overlap behaviour

This commit is contained in:
Matthew Hodgson 2016-05-17 19:52:56 +01:00
parent 5feb31911a
commit 2b3606d44d
1 changed files with 18 additions and 24 deletions

View File

@ -40,7 +40,7 @@ limitations under the License.
vertical-align: middle;
overflow: hidden;
word-break: break-word;
padding-right: 19px;
padding-right: 15px;
color: rgba(69, 69, 69, 0.8);
}
@ -70,12 +70,12 @@ limitations under the License.
right: 16px;
top: 50%;
margin-top: -8px;
border-radius: 3px;
border-radius: 16px;
color: #fff;
font-weight: bold;
font-size: 11px;
text-align: center;
padding: 0px 2px 0px 2px;
padding: 0px 4px 0px 4px;
}
.mx_RoomTile_unreadNotify .mx_RoomTile_badge {
@ -91,26 +91,22 @@ limitations under the License.
font-weight: bold;
}
/* the inner highlight span has 4px of padding on it, so we shrink the _avatar by 4pm and grow the _name by 4pm to fit it in */
.mx_RoomTile_selected .mx_RoomTile_name {
padding-right: 19px;
}
.mx_RoomTile_selected .mx_RoomTile_avatar {
padding-right: 7px;
}
/* leave room for the badge, if present.
N.B. this has to come after the above _selected width tweaks */
.mx_RoomTile_unreadNotify .mx_RoomTile_name,
.mx_RoomTile_highlight .mx_RoomTile_name {
padding-right: 36px;
}
.mx_RoomTile_selected .mx_RoomTile_name {
padding-right: 23px;
}
/*
.mx_RoomTile_highlight .mx_RoomTile_name {
color: #ff0064 ! important;
}
*/
.mx_RoomTile.mx_RoomTile_selected .mx_RoomTile_avatar {
padding-right: 7px;
}
.mx_RoomTile.mx_RoomTile_selected .mx_RoomTile_name span {
.mx_RoomTile_selected .mx_RoomTile_name span {
display: inline-block;
position: relative;
width: 100%;
@ -121,13 +117,11 @@ limitations under the License.
background-color: rgba(118,207,166,0.2);
}
/*
.mx_RoomTile.mx_RoomTile_selected .mx_RoomTile_name {
background: url('img/selected.png');
background-repeat: no-repeat;
background-position: right center;
/* stop the span from overlapping with the badge */
.mx_RoomTile_unreadNotify.mx_RoomTile_selected .mx_RoomTile_name span,
.mx_RoomTile_highlight.mx_RoomTile_selected .mx_RoomTile_name span {
padding-right: 22px;
}
*/
.mx_RoomTile_arrow {
position: absolute;