CSS fixes to match matrix-org/matrix-react-sdk#30b4b91.

This mostly works, but there is some weirdness with the status bar being too
high by default, and getting smaller when it has content in it.
pull/972/head
Richard van der Hoff 2016-02-09 14:44:59 +00:00
parent 15fec7f27c
commit bab9de1899
2 changed files with 89 additions and 110 deletions

View File

@ -0,0 +1,89 @@
.mx_RoomStatusBar {
margin-top: 5px;
margin-left: 65px;
}
/* position the indicator in the same place horizontally as .mx_EventTile_avatar. */
.mx_RoomStatusBar_indicator {
padding-left: 18px;
padding-right: 12px;
margin-left: -73px;
float: left;
}
.mx_RoomStatusBar_placeholderIndicator {
color: #4a4a4a;
opacity: 0.5;
}
.mx_RoomStatusBar_scrollDownIndicator {
cursor: pointer;
}
.mx_RoomStatusBar_unreadMessagesBar {
color: #ff0064;
cursor: pointer;
}
.mx_RoomStatusBar_connectionLostBar {
margin-top: 19px;
height: 58px;
}
.mx_RoomStatusBar_connectionLostBar img {
padding-left: 10px;
padding-right: 22px;
vertical-align: middle;
float: left;
}
.mx_RoomStatusBar_connectionLostBar_title {
color: #ff0064;
}
.mx_RoomStatusBar_connectionLostBar_desc {
color: #454545;
font-size: 13px;
opacity: 0.5;
}
.mx_RoomStatusBar_resend_link {
color: #454545 ! important;
text-decoration: underline ! important;
cursor: pointer;
}
.mx_RoomStatusBar_tabCompleteBar {
color: #4a4a4a;
}
.mx_RoomStatusBar_typingBar {
color: #4a4a4a;
opacity: 0.5;
overflow-y: hidden;
display: block;
}
.mx_RoomStatusBar_tabCompleteWrapper {
display: flex;
display: -webkit-flex;
height: 24px;
}
.mx_RoomStatusBar_tabCompleteWrapper .mx_TabCompleteBar {
flex: 1 1 auto;
-webkit-flex: 1 1 auto;
}
.mx_RoomStatusBar_tabCompleteEol {
flex: 0 0 auto;
-webkit-flex: 0 0 auto;
color: #76CFA6;
}
.mx_RoomStatusBar_tabCompleteEol object {
vertical-align: middle;
margin-right: 8px;
margin-top: -2px;
}

View File

@ -232,116 +232,6 @@ hr.mx_RoomView_myReadMarker {
pointer-events: none; pointer-events: none;
} }
.mx_RoomView_unreadMessagesBar,
.mx_RoomView_scrollToBottomBar
{
color: #ff0064;
cursor: pointer;
margin-top: 5px;
}
.mx_RoomView_unreadMessagesBar img,
.mx_RoomView_scrollToBottomBar img {
padding-left: 10px;
padding-right: 31px;
vertical-align: middle;
}
.mx_RoomView_scrollToBottomBar {
color: rgba(69,69,69,0.5);
}
.mx_RoomView_callBar {
margin-top: 5px;
}
.mx_RoomView_callBar img {
padding-left: 13px;
padding-right: 30px;
vertical-align: middle;
}
.mx_RoomView_connectionLostBar {
margin-top: 19px;
height: 58px;
}
.mx_RoomView_connectionLostBar img {
padding-left: 10px;
padding-right: 22px;
vertical-align: middle;
float: left;
}
.mx_RoomView_connectionLostBar_title {
color: #ff0064;
}
.mx_RoomView_connectionLostBar_desc {
color: #454545;
font-size: 13px;
opacity: 0.5;
}
.mx_RoomView_resend_link {
color: #454545 ! important;
text-decoration: underline ! important;
cursor: pointer;
}
.mx_RoomView_tabCompleteBar {
margin-top: 5px;
margin-left: 65px;
color: #4a4a4a;
}
.mx_RoomView_typingBar {
margin-top: 6px;
margin-left: 65px;
color: #4a4a4a;
opacity: 0.5;
}
.mx_RoomView_tabCompleteImage,
.mx_RoomView_typingImage {
display: inline;
margin-left: -50px;
margin-top: -4px;
float: left;
}
.mx_RoomView_tabCompleteImage {
opacity: 0.5;
}
.mx_RoomView_typingText {
overflow-y: hidden;
display: block;
}
.mx_RoomView_tabCompleteWrapper {
display: flex;
display: -webkit-flex;
height: 24px;
}
.mx_RoomView_tabCompleteWrapper .mx_TabCompleteBar {
flex: 1 1 auto;
-webkit-flex: 1 1 auto;
}
.mx_RoomView_tabCompleteEol {
flex: 0 0 auto;
-webkit-flex: 0 0 auto;
color: #76CFA6;
}
.mx_RoomView_tabCompleteEol object {
vertical-align: middle;
margin-right: 8px;
margin-top: -2px;
}
.mx_RoomView .mx_MessageComposer { .mx_RoomView .mx_MessageComposer {
-webkit-box-ordinal-group: 5; -webkit-box-ordinal-group: 5;
-moz-box-ordinal-group: 5; -moz-box-ordinal-group: 5;