From 1e647cbdfc159d6d3905c5af0ece6ce4255ea80a Mon Sep 17 00:00:00 2001
From: Asaad Mahmood <Unknowngi@live.com>
Date: Thu, 27 Aug 2015 20:46:25 +0500
Subject: MM-1899 - Updating UI for commands in input box

---
 web/react/components/command_list.jsx          |  8 +++++---
 web/sass-files/sass/partials/_command-box.scss | 16 +++++++++++++---
 2 files changed, 18 insertions(+), 6 deletions(-)

(limited to 'web')

diff --git a/web/react/components/command_list.jsx b/web/react/components/command_list.jsx
index 5efe98dc6..8f8f9d08d 100644
--- a/web/react/components/command_list.jsx
+++ b/web/react/components/command_list.jsx
@@ -44,19 +44,21 @@ module.exports = React.createClass({
 
         var suggestions = [];
 
+        console.log(this.state.suggestions.length);
+
         for (var i = 0; i < this.state.suggestions.length; i++) {
             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 {
-- 
cgit v1.2.3-1-g7c22


From 2b55ffb026559862fabd15e02fc69ac0ecc9dd2f Mon Sep 17 00:00:00 2001
From: Asaad Mahmood <Unknowngi@live.com>
Date: Thu, 27 Aug 2015 21:17:45 +0500
Subject: Removing console.log from command_list

---
 web/react/components/command_list.jsx | 2 --
 1 file changed, 2 deletions(-)

(limited to 'web')

diff --git a/web/react/components/command_list.jsx b/web/react/components/command_list.jsx
index 8f8f9d08d..27264ff6e 100644
--- a/web/react/components/command_list.jsx
+++ b/web/react/components/command_list.jsx
@@ -44,8 +44,6 @@ module.exports = React.createClass({
 
         var suggestions = [];
 
-        console.log(this.state.suggestions.length);
-
         for (var i = 0; i < this.state.suggestions.length; i++) {
             if (this.state.suggestions[i].suggestion != this.state.cmd) {
                 suggestions.push(
-- 
cgit v1.2.3-1-g7c22