From 93a526f7ed5464e18e11137f798d09c0561b16a8 Mon Sep 17 00:00:00 2001
From: Asaad Mahmood <asaadmahmood@users.noreply.github.com>
Date: Mon, 9 Jan 2017 19:32:27 +0500
Subject: PLT-5179 - Fixing modal overflow for autocomplete (#5002)

* PLT-5179 - Fixing modal overflow for autocomplete

* PLT-5171 - Fixing search bar popover behaviour
---
 webapp/sass/components/_modal.scss   |  5 -----
 webapp/sass/components/_popover.scss | 16 ++++++++++------
 webapp/sass/responsive/_mobile.scss  |  8 +-------
 3 files changed, 11 insertions(+), 18 deletions(-)

(limited to 'webapp/sass')

diff --git a/webapp/sass/components/_modal.scss b/webapp/sass/components/_modal.scss
index 81c241986..ac2c3acd4 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;
     }
 
@@ -24,10 +23,6 @@
             min-height: 8em;
         }
 
-        .suggestion-list {
-            bottom: -149px;
-        }
-
         .suggestion-list__content {
             max-height: 150px;
         }
diff --git a/webapp/sass/components/_popover.scss b/webapp/sass/components/_popover.scss
index 1f5ed7248..b4839bd1f 100644
--- a/webapp/sass/components/_popover.scss
+++ b/webapp/sass/components/_popover.scss
@@ -93,21 +93,20 @@
 }
 
 .search-help-popover {
+    @include single-transition(opacity, .3s, ease-in);
     font-size: em(13px);
-    max-width: 300px;
+    max-width: 350px;
+    top: 36px;
+    visibility: hidden;
     width: 100%;
 
-    &:not(.autocomplete) {
-        margin-top: 17px !important;
-    }
-
     &.autocomplete {
         display: block;
 
         .popover-content {
-            -webkit-overflow-scrolling: touch;
             padding: 10px;
             position: relative;
+            -webkit-overflow-scrolling: touch;
         }
     }
 
@@ -206,6 +205,11 @@
     .tooltip-inner {
         max-width: 100%;
     }
+
+    &.visible {
+        @include opacity(1);
+        visibility: visible;
+    }
 }
 
 .member-list__popover {
diff --git a/webapp/sass/responsive/_mobile.scss b/webapp/sass/responsive/_mobile.scss
index 8fcf2e94e..bd39f6af7 100644
--- a/webapp/sass/responsive/_mobile.scss
+++ b/webapp/sass/responsive/_mobile.scss
@@ -427,14 +427,8 @@
     }
 
     .search-help-popover {
-        left: 0 !important;
-        margin-left: 10px;
+        left: 55px;
         max-width: calc(100% - 80px);
-
-        .focused & {
-            left: 45px !important;
-            margin-top: 50px;
-        }
     }
 
     .modal-direct-channels,
-- 
cgit v1.2.3-1-g7c22