1 files changed, 18 insertions, 25 deletions

diff --git a/app/assets/stylesheets/new_sidebar.scss b/app/assets/stylesheets/new_sidebar.scss
index d49f23b4f5a..cee5b22adb9 100644
--- a/app/assets/stylesheets/new_sidebar.scss
+++ b/app/assets/stylesheets/new_sidebar.scss
@@ -97,13 +97,16 @@ $new-sidebar-collapsed-width: 50px;
   top: $header-height;
   bottom: 0;
   left: 0;
-  overflow: auto;
   background-color: $gray-normal;
   box-shadow: inset -2px 0 0 $border-color;
+  transform: translate3d(0, 0, 0);
 
   &.sidebar-icons-only {
     width: $new-sidebar-collapsed-width;
-    overflow-x: hidden;
+
+    .nav-sidebar-inner-scroll {
+      overflow-x: hidden;
+    }
 
     .badge,
     .project-title {
@@ -111,7 +114,11 @@ $new-sidebar-collapsed-width: 50px;
     }
 
     .nav-item-name {
-      opacity: 0;
+      display: none;
+    }
+
+    .sidebar-top-level-items > li > a {
+      min-height: 44px;
     }
   }
 
@@ -176,6 +183,12 @@ $new-sidebar-collapsed-width: 50px;
   }
 }
 
+.nav-sidebar-inner-scroll {
+  height: 100%;
+  width: 100%;
+  overflow: auto;
+}
+
 .with-performance-bar .nav-sidebar {
   top: $header-height + $performance-bar-height;
 }
@@ -250,32 +263,13 @@ $new-sidebar-collapsed-width: 50px;
             position: absolute;
             top: -30px;
             bottom: -30px;
-            left: 0;
+            left: -10px;
             right: -30px;
             z-index: -1;
           }
 
-          &::after {
-            content: "";
-            position: absolute;
-            top: 44px;
-            left: -30px;
-            right: 35px;
-            bottom: 0;
-            height: 100%;
-            max-height: 150px;
-            z-index: -1;
-            transform: skew(33deg);
-          }
-
           &.is-above {
             margin-top: 1px;
-
-            &::after {
-              top: auto;
-              bottom: 44px;
-              transform: skew(-30deg);
-            }
           }
 
           > .active {
@@ -322,8 +316,7 @@ $new-sidebar-collapsed-width: 50px;
       }
     }
 
-    &:not(.active):hover > a,
-    > a:hover,
+    &.active > a:hover,
     &.is-over > a {
       background-color: $white-light;
     }