improve sidebar toggle

elastic · Sep 16, 2020 · 31cf12f · 31cf12f
1 parent e79be95
commit 31cf12f
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 5 deletions.
diff --git a/src/plugins/discover/public/application/_discover.scss b/src/plugins/discover/public/application/_discover.scss
@@ -22,9 +22,12 @@ discover-app {
 
 // SASSTODO: replace the z-index value with a variable
 .dscWrapper {
+  padding-left: $euiSizeXL;
   padding-right: $euiSizeS;
-  padding-left: 22px;
   z-index: 1;
+  @include euiBreakpoint('xs', 's', 'm') {
+    padding-left: $euiSizeS;
+  }
 }
 
 @include euiPanel('.dscWrapper__content');
@@ -128,7 +131,7 @@ discover-app {
   .dscCollapsibleSidebar__collapseButton {
     position: absolute;
     top: 0;
-    right: -20px;
+    right: -$euiSizeXL + 4;
     cursor: pointer;
     z-index: -1;
     min-height: $euiSizeM;
@@ -140,6 +143,9 @@ discover-app {
     width: 0 !important;
     border-right-width: 0;
     border-left-width: 0;
+    .dscCollapsibleSidebar__collapseButton {
+      right: -$euiSizeL + 4;
+    }
   }
 }
 
@@ -154,4 +160,3 @@ discover-app {
     }
   }
 }
-
diff --git a/src/plugins/discover/public/application/components/discover_legacy.tsx b/src/plugins/discover/public/application/components/discover_legacy.tsx
@@ -195,8 +195,8 @@ export function DiscoverLegacy({
                 </div>
               )}
               <EuiButtonIcon
-                iconType={isSidebarClosed ? 'arrowRight' : 'arrowLeft'}
-                iconSize="s"
+                iconType={isSidebarClosed ? 'menuRight' : 'menuLeft'}
+                iconSize="m"
                 size="s"
                 onClick={() => setIsSidebarClosed(!isSidebarClosed)}
                 data-test-subj="collapseSideBarButton"