From 3e7a59b7b9c6289d71551eedc763188c2a99f6e5 Mon Sep 17 00:00:00 2001
From: Asaad Mahmood <asaadmahmood@users.noreply.github.com>
Date: Wed, 4 Jan 2017 23:40:51 +0500
Subject: Minor UI improvements (#4959)

* PLT-5128 - Fixing channel header responsively

* PLT-4984 - Fixing search popover behaviour
---
 webapp/sass/components/_popover.scss | 13 +++----------
 webapp/sass/responsive/_desktop.scss |  8 ++++++++
 webapp/sass/responsive/_mobile.scss  |  4 ++--
 webapp/sass/responsive/_tablet.scss  | 10 ++--------
 4 files changed, 15 insertions(+), 20 deletions(-)

(limited to 'webapp/sass')

diff --git a/webapp/sass/components/_popover.scss b/webapp/sass/components/_popover.scss
index b4839bd1f..31ef83d6a 100644
--- a/webapp/sass/components/_popover.scss
+++ b/webapp/sass/components/_popover.scss
@@ -93,20 +93,18 @@
 }
 
 .search-help-popover {
-    @include single-transition(opacity, .3s, ease-in);
     font-size: em(13px);
-    max-width: 350px;
-    top: 36px;
-    visibility: hidden;
+    margin-top: 17px !important;
+    max-width: 300px;
     width: 100%;
 
     &.autocomplete {
         display: block;
 
         .popover-content {
+            -webkit-overflow-scrolling: touch;
             padding: 10px;
             position: relative;
-            -webkit-overflow-scrolling: touch;
         }
     }
 
@@ -205,11 +203,6 @@
     .tooltip-inner {
         max-width: 100%;
     }
-
-    &.visible {
-        @include opacity(1);
-        visibility: visible;
-    }
 }
 
 .member-list__popover {
diff --git a/webapp/sass/responsive/_desktop.scss b/webapp/sass/responsive/_desktop.scss
index f5deff302..68b47684e 100644
--- a/webapp/sass/responsive/_desktop.scss
+++ b/webapp/sass/responsive/_desktop.scss
@@ -85,6 +85,14 @@
             }
         }
     }
+
+    .channel-header {
+        .search-bar__container {
+            .search__form {
+                width: 150px;
+            }
+        }
+    }
 }
 
 @media (min-width: 992px) {
diff --git a/webapp/sass/responsive/_mobile.scss b/webapp/sass/responsive/_mobile.scss
index b0302afba..02525aec5 100644
--- a/webapp/sass/responsive/_mobile.scss
+++ b/webapp/sass/responsive/_mobile.scss
@@ -427,8 +427,8 @@
     }
 
     .search-help-popover {
-        left: 55px;
-        max-width: calc(100% - 10px);
+        margin-left: 10px;
+        max-width: calc(100% - 20px);
     }
 
     .modal-direct-channels,
diff --git a/webapp/sass/responsive/_tablet.scss b/webapp/sass/responsive/_tablet.scss
index 5e5e6180a..c9bc1b06b 100644
--- a/webapp/sass/responsive/_tablet.scss
+++ b/webapp/sass/responsive/_tablet.scss
@@ -9,14 +9,8 @@
     }
 
     .channel-header {
-        .search-bar__container {
-            .search__form {
-                width: 150px;
-            }
-        }
-
         .heading {
-            max-width: 110px;
+            max-width: 100px;
         }
     }
 
@@ -39,9 +33,9 @@
             }
 
             .post-error {
-                top: 0;
                 left: 32px;
                 position: relative;
+                top: 0;
 
                 .sidebar--right & {
                     left: 0;
-- 
cgit v1.2.3-1-g7c22