gaja-group
/
matrix-bot
2
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

fix up the look & feel for unread messages warning to make it more visible

This commit is contained in:
Matthew Hodgson 2015-08-14 13:53:32 +01:00
parent 9ed5ca3ccb
commit 4851adf3b0
2 changed files with 25 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
skins/base/css/organisms/RoomView.css
View File

@ -165,6 +165,22 @@ limitations under the License.
border-top: 1px solid #a8dbf3;
}
.mx_RoomView_unreadMessagesBar {
margin-top: 13px;
color: #fff;
font-weight: bold;
background-color: #ff0064;
border-radius: 30px;
height: 30px;
line-height: 30px;
cursor: pointer;
}
.mx_RoomView_unreadMessagesBar img {
padding-left: 22px;
padding-right: 22px;
}
.mx_RoomView_typingBar {
margin-top: 17px;
margin-left: 56px;

12
skins/base/views/organisms/RoomView.js
View File

@ -72,7 +72,13 @@ module.exports = React.createClass({
if (!this.state.numUnreadMessages) {
return "";
}
return this.state.numUnreadMessages + " unread messages";
return this.state.numUnreadMessages + " new messages";
},
scrollToBottom: function() {
if (!this.refs.messageWrapper) return;
var messageWrapper = this.refs.messageWrapper.getDOMNode();
messageWrapper.scrollTop = messageWrapper.scrollHeight;
},
render: function() {
@ -138,8 +144,8 @@ module.exports = React.createClass({
// set when you've scrolled up
if (unreadMsgs) {
statusBar = (
<div className="mx_RoomView_typingBar">
<img src="img/typing.png" width="40" height="40" alt=""/>
<div className="mx_RoomView_unreadMessagesBar" onClick={ this.scrollToBottom }>
<img src="img/newmessages.png" width="10" height="12" alt=""/>
{unreadMsgs}
</div>
);