From 77f52da25512dc6ab80635efaa6c22a2887cd5e2 Mon Sep 17 00:00:00 2001 From: Asaad Mahmood Date: Tue, 4 Aug 2015 19:12:20 +0500 Subject: UI Improvements --- web/react/components/channel_header.jsx | 2 +- web/react/components/mention_list.jsx | 12 ++++++++---- web/react/components/post_list.jsx | 14 ++++++++++++-- web/react/components/user_profile.jsx | 2 +- 4 files changed, 22 insertions(+), 8 deletions(-) (limited to 'web/react') diff --git a/web/react/components/channel_header.jsx b/web/react/components/channel_header.jsx index 76dbe370b..1702175d6 100644 --- a/web/react/components/channel_header.jsx +++ b/web/react/components/channel_header.jsx @@ -59,7 +59,7 @@ var PopoverListMembers = React.createClass({ return (
-
+
{count}
diff --git a/web/react/components/mention_list.jsx b/web/react/components/mention_list.jsx index 71a6083d2..829462456 100644 --- a/web/react/components/mention_list.jsx +++ b/web/react/components/mention_list.jsx @@ -20,6 +20,10 @@ module.exports = React.createClass({ PostStore.addMentionDataChangeListener(this._onChange); var self = this; + $('.post-right__scroll').scroll(function(){ + self.forceUpdate(); + }); + $('body').on('keydown.mentionlist', '#'+this.props.id, function(e) { if (!self.isEmpty() && self.state.mentionText != '-1' && (e.which === 13 || e.which === 9)) { @@ -32,7 +36,7 @@ module.exports = React.createClass({ e.preventDefault(); var tempSelectedMention = -1; - if (e.which === 38) { + if (e.which === 38) { if (self.getSelection(self.state.selectedMention - 1)) self.setState({ selectedMention: self.state.selectedMention - 1, selectedUsername: self.refs['mention' + (self.state.selectedMention - 1)].props.username }); else { @@ -106,13 +110,13 @@ module.exports = React.createClass({ this.setState({ selectedMention: listId, selectedUsername: this.refs['mention' + listId].props.username }); }, getSelection: function(listId) { - if (!this.refs['mention' + listId]) + if (!this.refs['mention' + listId]) return false; else return true; }, addCurrentMention: function() { - if (!this.getSelection(this.state.selectedMention)) + if (!this.getSelection(this.state.selectedMention)) this.addFirstMention(); else this.refs['mention' + this.state.selectedMention].handleClick(); @@ -132,7 +136,7 @@ module.exports = React.createClass({ scrollAmount = $("#mentionsbox").height() * 100; //Makes sure that it scrolls all the way to the bottom else if (direction === "down" && this.state.selectedMention === 0) scrollAmount = 0; - else if (direction === "up") + else if (direction === "up") scrollAmount = "-=" + ($('#'+this.refs['mention' + this.state.selectedMention].props.id +"_mentions").innerHeight() - 5); else if (direction === "down") scrollAmount = "+=" + ($('#'+this.refs['mention' + this.state.selectedMention].props.id +"_mentions").innerHeight() - 5); diff --git a/web/react/components/post_list.jsx b/web/react/components/post_list.jsx index 3f59d5843..0b19d774c 100644 --- a/web/react/components/post_list.jsx +++ b/web/react/components/post_list.jsx @@ -37,15 +37,25 @@ module.exports = React.createClass({ componentDidMount: function() { var user = UserStore.getCurrentUser(); if (user.props && user.props.theme) { - utils.changeCss('a.theme', 'color:'+user.props.theme+'; fill:'+user.props.theme+'!important;'); utils.changeCss('div.theme', 'background-color:'+user.props.theme+';'); utils.changeCss('.btn.btn-primary', 'background: ' + user.props.theme+';'); - utils.changeCss('.btn.btn-primary:hover, .btn.btn-primary:active, .btn.btn-primary:focus', 'background: ' + utils.changeColor(user.props.theme, -10) +';'); utils.changeCss('.modal .modal-header', 'background: ' + user.props.theme+';'); utils.changeCss('.mention', 'background: ' + user.props.theme+';'); utils.changeCss('.mention-link', 'color: ' + user.props.theme+';'); utils.changeCss('@media(max-width: 768px){.search-bar__container', 'background: ' + user.props.theme+';}'); } + if (user.props.theme != "#000000" && user.props.theme != "#585858"){ + utils.changeCss('.btn.btn-primary:hover, .btn.btn-primary:active, .btn.btn-primary:focus', 'background: ' + utils.changeColor(user.props.theme, -10) +';'); + utils.changeCss('a.theme', 'color:'+user.props.theme+'; fill:'+user.props.theme+'!important;'); + } + else if (user.props.theme == "#000000"){ + utils.changeCss('.btn.btn-primary:hover, .btn.btn-primary:active, .btn.btn-primary:focus', 'background: ' + utils.changeColor(user.props.theme, +50) +';'); + $('.team__header').addClass('theme--black'); + } + else if (user.props.theme == "#585858"){ + utils.changeCss('.btn.btn-primary:hover, .btn.btn-primary:active, .btn.btn-primary:focus', 'background: ' + utils.changeColor(user.props.theme, +10) +';'); + $('.team__header').addClass('theme--gray'); + } PostStore.addChangeListener(this._onChange); ChannelStore.addChangeListener(this._onChange); diff --git a/web/react/components/user_profile.jsx b/web/react/components/user_profile.jsx index 65f025919..f7e1a6257 100644 --- a/web/react/components/user_profile.jsx +++ b/web/react/components/user_profile.jsx @@ -57,7 +57,7 @@ module.exports = React.createClass({ if (!config.ShowEmail) { data_content += "
Email not shared
"; } else { - data_content += "
" + this.state.profile.email + "
"; + data_content += "
"; } return ( -- cgit v1.2.3-1-g7c22