diff options
author | Christopher Speller <crspeller@gmail.com> | 2015-08-31 09:03:47 -0400 |
---|---|---|
committer | Christopher Speller <crspeller@gmail.com> | 2015-08-31 09:03:47 -0400 |
commit | 8867e2fe22056cf08364082ced2853b6268a0671 (patch) | |
tree | 33e538cb788141bbd0d2c64b1c3db2d4c8230b90 | |
parent | 3cdd0192dddd9a95bf62940851b14ae1165d1982 (diff) | |
parent | 2b55ffb026559862fabd15e02fc69ac0ecc9dd2f (diff) | |
download | chat-8867e2fe22056cf08364082ced2853b6268a0671.tar.gz chat-8867e2fe22056cf08364082ced2853b6268a0671.tar.bz2 chat-8867e2fe22056cf08364082ced2853b6268a0671.zip |
Merge pull request #493 from asaadmahmoodspin/master
MM-1899 - Updating UI for commands in input box
-rw-r--r-- | web/react/components/command_list.jsx | 6 | ||||
-rw-r--r-- | web/sass-files/sass/partials/_command-box.scss | 16 |
2 files changed, 16 insertions, 6 deletions
diff --git a/web/react/components/command_list.jsx b/web/react/components/command_list.jsx index 5efe98dc6..27264ff6e 100644 --- a/web/react/components/command_list.jsx +++ b/web/react/components/command_list.jsx @@ -48,15 +48,15 @@ module.exports = React.createClass({ if (this.state.suggestions[i].suggestion != this.state.cmd) { suggestions.push( <div key={i} className="command-name" onClick={this.handleClick.bind(this, i)}> - <div className="pull-left"><strong>{ this.state.suggestions[i].suggestion }</strong></div> - <div className="command-desc pull-right">{ this.state.suggestions[i].description }</div> + <div className="command__title"><strong>{ this.state.suggestions[i].suggestion }</strong></div> + <div className="command__desc">{ this.state.suggestions[i].description }</div> </div> ); } } return ( - <div ref="mentionlist" className="command-box" style={{height:(this.state.suggestions.length*37)+2}}> + <div ref="mentionlist" className="command-box" style={{height:(this.state.suggestions.length*56)+2}}> { suggestions } </div> ); diff --git a/web/sass-files/sass/partials/_command-box.scss b/web/sass-files/sass/partials/_command-box.scss index 44eb9b8df..565296fae 100644 --- a/web/sass-files/sass/partials/_command-box.scss +++ b/web/sass-files/sass/partials/_command-box.scss @@ -4,20 +4,30 @@ width: 100%; border: $border-gray; bottom: 38px; + overflow: auto; @extend %popover-box-shadow; + .sidebar--right & { + bottom: 100px; + } } .command-name { position: relative; width: 100%; background-color: #fff; - height: 37px; - line-height: 37px; - padding: 2px 10px 2px 5px; + line-height: 24px; + padding: 5px 10px 8px; z-index: 101; + font-size: 0.95em; + border-bottom: 1px solid #ddd; &:hover { background-color: #e8eaed; } + .command__desc { + margin-left: 5px; + color: #999; + line-height: normal; + } } .command-desc { |