Merge branch 'release-3.6'

5 files changed, 80 insertions, 91 deletions

diff --git a/webapp/sass/components/_modal.scss b/webapp/sass/components/_modal.scss
index d17ba1706..83f2ef907 100644
--- a/webapp/sass/components/_modal.scss
+++ b/webapp/sass/components/_modal.scss
@@ -12,7 +12,6 @@
 
     .modal-body {
         max-height: calc(90vh - 62px);
-        overflow: auto;
         padding: 20px 15px;
     }
 
@@ -460,24 +459,10 @@
                 float: right;
                 margin-top: 5px;
             }
-
-            .more-modal__list {
-                max-height: calc(100vh - 270px);
-            }
         }
     }
 
     .more-modal {
-        .more-modal__list {
-            height: 100vh;
-            max-height: calc(100vh - 340px);
-        }
-
-        &.more-direct-channels {
-            .more-modal__list {
-                max-height: calc(100vh - 325px);
-            }
-        }
 
         .user-list {
             margin-top: 10px;
@@ -492,7 +477,6 @@
         }
 
         .filter-row {
-            @include clearfix;
             margin: 5px 0 10px;
             width: 300px;
         }
@@ -557,7 +541,15 @@
 .more-modal__list {
     display: flex;
     flex-direction: column;
-    overflow: auto;
+
+    .browser--ie & {
+        flex: 20;
+    }
+
+    > div {
+        min-height: 100%;
+        overflow: auto;
+    }
 
     .popover & {
         font-size: .95em;
@@ -602,6 +594,7 @@
     .more-modal__actions {
         flex-grow: 0;
         flex-shrink: 0;
+        margin: 5px 0 10px;
         padding-left: 20px;
     }
 
@@ -624,8 +617,7 @@
     .more-modal__row {
         border-bottom: 1px solid $light-gray;
         display: flex;
-        min-height: 70px;
-        padding: 8px 15px;
+        padding: 10px 15px;
     }
 
     p {
@@ -646,16 +638,15 @@
 .filtered-user-list {
     display: flex;
     flex-direction: column;
+    height: calc(90vh - 120px);
     width: 100%;
 
-    .filter-row {
-        flex-grow: 0;
-        flex-shrink: 0;
+    > div {
+        flex: 1 1 auto;
     }
 
-    .user-list {
-        flex-grow: 1;
-        flex-shrink: 1;
+    .more-modal__list {
+        flex-grow: 500;
     }
 
     .filter-button {
@@ -665,9 +656,6 @@
     }
 
     .filter-controls {
-        @include clearfix;
-        flex-grow: 0;
-        flex-shrink: 0;
         padding: 1em 1.5em 0;
 
         .filter-control__next {
@@ -679,10 +667,4 @@
         margin-left: 0;
         padding-left: 0;
     }
-}
-
-.channel-switch-modal {
-    .modal-body {
-        overflow: visible;
-    }
-}
+}
\ No newline at end of file
diff --git a/webapp/sass/components/_popover.scss b/webapp/sass/components/_popover.scss
index 31ef83d6a..b4839bd1f 100644
--- a/webapp/sass/components/_popover.scss
+++ b/webapp/sass/components/_popover.scss
@@ -93,18 +93,20 @@
 }
 
 .search-help-popover {
+    @include single-transition(opacity, .3s, ease-in);
     font-size: em(13px);
-    margin-top: 17px !important;
-    max-width: 300px;
+    max-width: 350px;
+    top: 36px;
+    visibility: hidden;
     width: 100%;
 
     &.autocomplete {
         display: block;
 
         .popover-content {
-            -webkit-overflow-scrolling: touch;
             padding: 10px;
             position: relative;
+            -webkit-overflow-scrolling: touch;
         }
     }
 
@@ -203,6 +205,11 @@
     .tooltip-inner {
         max-width: 100%;
     }
+
+    &.visible {
+        @include opacity(1);
+        visibility: visible;
+    }
 }
 
 .member-list__popover {
diff --git a/webapp/sass/layout/_post.scss b/webapp/sass/layout/_post.scss
index ff2dce422..a04865bd8 100644
--- a/webapp/sass/layout/_post.scss
+++ b/webapp/sass/layout/_post.scss
@@ -1283,6 +1283,10 @@
     min-width: 320px;
 }
 
+.post-reaction-list {
+    min-height: 30px;
+}
+
 .post-reaction {
     @include user-select(none);
     @include border-radius(3px);
diff --git a/webapp/sass/responsive/_mobile.scss b/webapp/sass/responsive/_mobile.scss
index 67f56b8a2..5ade6046e 100644
--- a/webapp/sass/responsive/_mobile.scss
+++ b/webapp/sass/responsive/_mobile.scss
@@ -20,6 +20,12 @@
         }
     }
 
+    .settings-modal {
+        .modal-body {
+            overflow: auto;
+        }
+    }
+
     #header-popover {
         @include single-transition(all, .35s, ease);
         @include translate3d(0, 100%, 0);
@@ -347,10 +353,6 @@
                 }
 
                 .post__img {
-                    .status-wrapper {
-                        display: inline-block;
-                    }
-
                     img {
                         display: block;
                     }
@@ -430,8 +432,8 @@
     }
 
     .search-help-popover {
-        margin-left: 10px;
-        max-width: calc(100% - 20px);
+        left: 55px;
+        max-width: calc(100% - 80px);
     }
 
     .modal-direct-channels,
@@ -1088,7 +1090,7 @@
                 .post-error {
                     top: 0;
                     left: 0;
-              }
+                }
             }
         }
 
@@ -1217,6 +1219,16 @@
 }
 
 @media screen and (max-width: 640px) {
+    .filtered-user-list {
+        height: calc(100vh - 80px);
+    }
+
+    .more-modal--action {
+        .filtered-user-list {
+            height: calc(100vh - 110px);
+        }
+    }
+
     .app__body {
         .modal {
             .more-modal {
@@ -1224,10 +1236,6 @@
                     max-height: calc(100vh - 62px);
                     padding-bottom: 5px;
                 }
-
-                .more-modal__list {
-                    max-height: calc(100vh - 230px);
-                }
             }
         }
 
@@ -1388,15 +1396,14 @@
 @media screen and (max-width: 550px) {
     .app__body {
         .more-modal {
-            .filter-row {
-                width: 100%;
-            }
-
-            &.more-direct-channels {
+            &.more-system-members {
                 .filter-row {
-                    padding-bottom: 50px;
+                    min-height: 80px;
+                    width: 100%;
                 }
+            }
 
+            &.more-direct-channels {
                 .member-show {
                     display: none;
                 }
@@ -1454,16 +1461,6 @@
 
     .app__body {
         .modal {
-            &.more-channel__modal {
-                .more-modal__list {
-                    max-height: calc(100vh - 250px);
-                }
-
-                .modal-body {
-                    padding-bottom: 35px;
-                }
-            }
-
             .settings-modal {
                 &.display--content {
                     .modal-body {
diff --git a/webapp/sass/routes/_admin-console.scss b/webapp/sass/routes/_admin-console.scss
index 64fad6aec..56199a545 100644
--- a/webapp/sass/routes/_admin-console.scss
+++ b/webapp/sass/routes/_admin-console.scss
@@ -245,38 +245,37 @@
 
     .more-modal__list {
         .filtered-user-list {
-           .filter-controls {
-            padding-bottom: 1em;
+            .filter-controls {
+                padding-bottom: 1em;
+            }
         }
-    }
 
-    .filter-row {
-        margin: 10px 0;
-        overflow: hidden;
+        .filter-row {
+            margin: 10px 0;
+        }
     }
-}
-
-.member-list-holder {
-    background: $white;
-    margin-bottom: 4em;
-    overflow: visible;
-    padding: 5px 0;
 
-    .more-modal__list {
+    .member-list-holder {
+        background: $white;
+        margin-bottom: 4em;
         overflow: visible;
-    }
+        padding: 5px 0;
+
+        .more-modal__list {
+            overflow: visible;
+        }
 
-    .more-modal__row {
-        &:last-child {
-            border: none;
+        .more-modal__row {
+            &:last-child {
+                border: none;
+            }
         }
     }
-}
 
-.member-count {
-    @include opacity(.7);
-    margin-top: 8px;
-}
+    .member-count {
+        @include opacity(.7);
+        margin-top: 8px;
+    }
 }
 
 .brand-img {
@@ -469,13 +468,13 @@
 }
 
 .cluster-status {
-    width: 24px;
     height: 24px;
+    width: 24px;
 }
 
 .config-hash {
-    width: 130px;
-    white-space: nowrap;
     overflow: hidden;
     text-overflow: ellipsis;
+    white-space: nowrap;
+    width: 130px;
 }