Merge branch 'master' into PLT-12

6 files changed, 28 insertions, 20 deletions

diff --git a/web/react/components/post.jsx b/web/react/components/post.jsx
index 37de4ecc0..d3c6befd0 100644
--- a/web/react/components/post.jsx
+++ b/web/react/components/post.jsx
@@ -152,7 +152,7 @@ export default class Post extends React.Component {
         return (
             <div>
                 <div
-                    id={post.id}
+                    id={'post_' + post.id}
                     className={'post ' + sameUserClass + ' ' + rootUser + ' ' + postType + ' ' + currentUserCss}
                 >
                     {profilePic}
diff --git a/web/react/components/post_list.jsx b/web/react/components/post_list.jsx
index 9d95887d9..e6aa3f8df 100644
--- a/web/react/components/post_list.jsx
+++ b/web/react/components/post_list.jsx
@@ -189,9 +189,15 @@ export default class PostList extends React.Component {
             this.scrollToBottom(true);
 
         // the user clicked 'load more messages'
-        } else if (this.gotMorePosts) {
-            var lastPost = oldPosts[oldOrder[prevState.numToDisplay]];
-            $('#' + lastPost.id)[0].scrollIntoView();
+        } else if (this.gotMorePosts && oldOrder.length > 0) {
+            let index;
+            if (prevState.numToDisplay >= oldOrder.length) {
+                index = oldOrder.length - 1;
+            } else {
+                index = prevState.numToDisplay;
+            }
+            const lastPost = oldPosts[oldOrder[index]];
+            $('#post_' + lastPost.id)[0].scrollIntoView();
             this.gotMorePosts = false;
         } else {
             this.scrollTo(this.prevScrollTop);
diff --git a/web/react/package.json b/web/react/package.json
index da55dc2b8..e55722152 100644
--- a/web/react/package.json
+++ b/web/react/package.json
@@ -3,22 +3,22 @@
   "version": "0.0.1",
   "private": true,
   "dependencies": {
-    "autolinker": "^0.18.1",
-    "flux": "^2.1.1",
-    "keymirror": "^0.1.1",
-    "object-assign": "^3.0.0",
-    "react": "^0.13.3",
-    "react-zeroclipboard-mixin": "^0.1.0",
-    "twemoji": "^1.4.1"
+    "autolinker": "0.18.1",
+    "flux": "2.1.1",
+    "keymirror": "0.1.1",
+    "object-assign": "3.0.0",
+    "react": "0.13.3",
+    "react-zeroclipboard-mixin": "0.1.0",
+    "twemoji": "1.4.1"
   },
   "devDependencies": {
-    "browserify": "^11.0.1",
-    "envify": "^3.4.0",
-    "babelify": "^6.1.3",
-    "uglify-js": "^2.4.24",
-    "watchify": "^3.3.1",
-    "eslint": "^1.3.1",
-    "eslint-plugin-react": "^3.3.1"
+    "browserify": "11.0.1",
+    "envify": "3.4.0",
+    "babelify": "6.1.3",
+    "uglify-js": "2.4.24",
+    "watchify": "3.3.1",
+    "eslint": "1.3.1",
+    "eslint-plugin-react": "3.3.1"
   },
   "scripts": {
     "start": "watchify --extension=jsx -o ../static/js/bundle.js -v -d ./**/*.jsx",
diff --git a/web/sass-files/sass/partials/_modal.scss b/web/sass-files/sass/partials/_modal.scss
index d32306cbc..a046cd904 100644
--- a/web/sass-files/sass/partials/_modal.scss
+++ b/web/sass-files/sass/partials/_modal.scss
@@ -123,6 +123,7 @@
 	}
 	.more-channel-table {
 		margin: 0;
+		table-layout: fixed;
 		p {
 			font-size: 0.9em;
 			overflow: hidden;
@@ -154,7 +155,7 @@
 					&.td--action {
 						text-align: right;
 						padding: 8px 15px 8px 8px;
-						width: 70px;
+						width: 80px;
 						vertical-align: middle;
 					}
 				}
diff --git a/web/sass-files/sass/partials/_sidebar--left.scss b/web/sass-files/sass/partials/_sidebar--left.scss
index d4ed41130..3d89e53b3 100644
--- a/web/sass-files/sass/partials/_sidebar--left.scss
+++ b/web/sass-files/sass/partials/_sidebar--left.scss
@@ -49,7 +49,7 @@
         left: 0;
         right: 0;
         width: 72%;
-        color: #777;
+        color: #fff;
         background: #2389D7;
         @include border-radius(50px);
         margin: 0 auto;
diff --git a/web/templates/channel.html b/web/templates/channel.html
index 9bfd1fa35..a732a25ce 100644
--- a/web/templates/channel.html
+++ b/web/templates/channel.html
@@ -52,6 +52,7 @@
 <script>
   window.setup_channel_page('{{ .Props.TeamDisplayName }}', '{{ .Props.TeamType }}', '{{ .Props.TeamId }}', '{{ .Props.ChannelName }}', '{{ .Props.ChannelId }}');
   $('body').tooltip( {selector: '[data-toggle=tooltip]'} );
+  $('.modal-body').css('max-height', $(window).height() * 0.7);
   $('.modal-body').perfectScrollbar();
 </script>
 </body>