10 files changed, 99 insertions, 56 deletions

diff --git a/web/sass-files/sass/partials/_command-box.scss b/web/sass-files/sass/partials/_command-box.scss
deleted file mode 100644
index 184fb55eb..000000000
--- a/web/sass-files/sass/partials/_command-box.scss
+++ /dev/null
@@ -1,35 +0,0 @@
-.command-box {
-    position: absolute;
-    background-color: #fff;
-    width: 100%;
-    border: $border-gray;
-    bottom: 38px;
-    overflow: auto;
-    z-index: 100;
-    @extend %popover-box-shadow;
-    .sidebar--right & {
-        bottom: 100px;
-    }
-}
-
-.command-name {
-    position: relative;
-    width: 100%;
-    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;
-        @include opacity(0.5);
-        line-height: normal;
-    }
-}
-
-.command-desc {
-    color: #a7a8ab;
-}
\ No newline at end of file
diff --git a/web/sass-files/sass/partials/_content.scss b/web/sass-files/sass/partials/_content.scss
index 0570daeb7..817817854 100644
--- a/web/sass-files/sass/partials/_content.scss
+++ b/web/sass-files/sass/partials/_content.scss
@@ -30,6 +30,20 @@
 	width: 100%;
 	z-index: 3;
 }
+
+#archive-link-home {
+    @include flex(0 0 auto);
+	background: #fff;
+	width: 100%;
+	min-height: 50px;
+	z-index: 3;
+	background-color: beige;
+	text-align: center;
+	vertical-align: middle;
+	padding-top: 10px;
+	cursor: pointer;
+}
+
 .post-list {
 	.new-messages-hr {
 		margin-top: 5px;
diff --git a/web/sass-files/sass/partials/_mentions.scss b/web/sass-files/sass/partials/_mentions.scss
index f59cefbc6..ee5b7f6d0 100644
--- a/web/sass-files/sass/partials/_mentions.scss
+++ b/web/sass-files/sass/partials/_mentions.scss
@@ -7,26 +7,9 @@
 	@include border-radius(3px);
 }
 
-.mentions--top {
-	position: absolute;
-	z-index: 1060;
-	@extend %popover-box-shadow;
-	.mentions-box {
- 		width: 100%;
- 		height: 100%;
-		position: absolute;
-		background-color: #fff;
-		border: $border-gray;
-		overflow-x: hidden;
-		overflow-y: scroll;
-		bottom: 0;
-	}
-}
-
 .mentions-name {
 	position:relative;
 	width:100%;
-	background-color:#fff;
 	height:36px;
 	padding:2px;
 	z-index:101;
@@ -57,4 +40,4 @@
 
 .mention-highlight {
 	background-color:#fff2bb;
-}
\ No newline at end of file
+}
diff --git a/web/sass-files/sass/partials/_modal.scss b/web/sass-files/sass/partials/_modal.scss
index 4a56bc6c7..01c9e136c 100644
--- a/web/sass-files/sass/partials/_modal.scss
+++ b/web/sass-files/sass/partials/_modal.scss
@@ -405,3 +405,11 @@
 		@include opacity(0.7);
 	}
 }
+
+.modal-body.edit-modal-body {
+    overflow: visible;
+
+    .suggestion-content {
+        max-height: 150px;
+    }
+}
diff --git a/web/sass-files/sass/partials/_popover.scss b/web/sass-files/sass/partials/_popover.scss
index 7d98935d5..a48bfb22d 100644
--- a/web/sass-files/sass/partials/_popover.scss
+++ b/web/sass-files/sass/partials/_popover.scss
@@ -94,6 +94,8 @@
     }
 
     .popover-content {
+        max-height: 500px;
+        overflow: auto;
         padding: 3px 13px;
     }
 
diff --git a/web/sass-files/sass/partials/_search.scss b/web/sass-files/sass/partials/_search.scss
index b7f658114..0debb7e54 100644
--- a/web/sass-files/sass/partials/_search.scss
+++ b/web/sass-files/sass/partials/_search.scss
@@ -95,7 +95,6 @@
 	border-top: $border-gray;
 	padding: 10px 1em;
 	margin: 0;
-	cursor: pointer;
 
 	&:first-child {
 		border: none;
@@ -107,6 +106,10 @@
 	}
 }
 
+.search-item__jump {
+	margin-left: 10px;
+}
+
 .search-item-time {
 	color: #a8adb7;
 }
diff --git a/web/sass-files/sass/partials/_settings.scss b/web/sass-files/sass/partials/_settings.scss
index bacb550af..ad52e0bbb 100644
--- a/web/sass-files/sass/partials/_settings.scss
+++ b/web/sass-files/sass/partials/_settings.scss
@@ -37,7 +37,8 @@
     label {
         font-weight: 600;
     }
-    .no-padding--left {
+
+	.no-padding--left {
         padding-left: 0;
     }
     .padding-top {
diff --git a/web/sass-files/sass/partials/_sidebar--right.scss b/web/sass-files/sass/partials/_sidebar--right.scss
index 43162831d..735b2a99e 100644
--- a/web/sass-files/sass/partials/_sidebar--right.scss
+++ b/web/sass-files/sass/partials/_sidebar--right.scss
@@ -93,6 +93,10 @@
             padding-bottom: 10px;
         }
     }
+
+    .suggestion-content {
+        max-height: 120px;
+    }
 }
 
 .sidebar-right-container {
diff --git a/web/sass-files/sass/partials/_suggestion_list.scss b/web/sass-files/sass/partials/_suggestion_list.scss
new file mode 100644
index 000000000..0cf3fff5f
--- /dev/null
+++ b/web/sass-files/sass/partials/_suggestion_list.scss
@@ -0,0 +1,63 @@
+.suggestion-list {
+	width: 100%;
+	z-index: 100;
+	@extend %popover-box-shadow;
+}
+
+.suggestion-list--top {
+    position: absolute;
+}
+
+.suggestion-content {
+    width: 100%;
+    max-height: 292px;
+    background-color: #fff;
+    border: $border-gray;
+    overflow-x: hidden;
+    overflow-y: scroll;
+}
+
+.suggestion-content--top {
+    position: absolute;
+    bottom: 0;
+}
+
+.suggestion--selected {
+    // set by theme code
+}
+
+.command-name {
+    position: relative;
+    width: 100%;
+    line-height: 24px;
+    padding: 5px 10px 8px;
+    z-index: 101;
+    font-size: 0.95em;
+    border-bottom: 1px solid #ddd;
+
+    .command__desc {
+        margin-left: 5px;
+        @include opacity(0.5);
+        line-height: normal;
+    }
+}
+
+.command-desc {
+    color: #a7a8ab;
+}
+
+.emoticon-suggestion {
+    width: 100%;
+    height: 36px;
+    cursor: pointer;
+    font-size: 13px;
+    line-height: 36px;
+}
+
+.emoticon-suggestion__image {
+    width: 32px;
+    height: 32px;
+    margin-right: 6px;
+    padding: 2px;
+    text-align: center;
+}
diff --git a/web/sass-files/sass/styles.scss b/web/sass-files/sass/styles.scss
index 01f654eec..e7fd7c976 100644
--- a/web/sass-files/sass/styles.scss
+++ b/web/sass-files/sass/styles.scss
@@ -32,7 +32,6 @@
 @import "partials/modal";
 @import "partials/forms";
 @import "partials/mentions";
-@import "partials/command-box";
 @import "partials/error";
 @import "partials/error-bar";
 @import "partials/loading";
@@ -40,6 +39,7 @@
 @import "partials/markdown";
 @import "partials/tutorial";
 @import "partials/statistics";
+@import "partials/suggestion_list";
 
 // Elements
 @import "partials/tooltips";