Fixed euiScrollBar (#989)

CHANGELOG.md

@@ -7,6 +7,7 @@
 **Bug fixes**
 
 - Fixed some IE11 flex box bugs and documented others (modal overflowing, image shrinking, and flex group wrapping) ([#973](https://github.com/elastic/eui/pull/973))
+- Fixed white square that show in double scollbar via `euiScrollBar()` ([989](https://github.com/elastic/eui/pull/989))
 
 ## [`1.1.0`](https://github.com/elastic/eui/tree/v1.1.0)
 

src-docs/src/components/guide_components.scss

@@ -1,35 +1,8 @@
+@import '../../src/global_styling/mixins/_helpers.scss';
+
 $guideSideNavWidth: 240px;
 $guideZLevelHighest: $euiZLevel9 + 1000;
 
-@mixin whenNarrowerThan($browserWidth) {
-  @media only screen and (max-width: #{$browserWidth}) {
-    @content;
-  }
-}
-
-@mixin whenWiderThan($browserWidth) {
-  @media only screen and (min-width: #{$browserWidth}) {
-    @content;
-  }
-}
-
-@mixin scrollbar($color: rgba(#454D58, 0.4)) {
-  &::-webkit-scrollbar {
-    width: 16px;
-    height: 16px;
-  }
-
-  &::-webkit-scrollbar-thumb {
-    background-color: $color;
-    border: 6px solid transparent;
-    background-clip: content-box;
-  }
-
-  &::-webkit-scrollbar-track {
-    background-color: transparent;
-  }
-}
-
 .guideBody {
   background: linear-gradient(90deg, $euiColorLightestShade 50%, $euiColorEmptyShade 50%);
 }
@@ -60,7 +33,7 @@ $guideZLevelHighest: $euiZLevel9 + 1000;
     position: absolute;
     bottom: 0;
     top: 132px;
-    @include scrollbar;
+    @include euiScrollBar;
     overflow-y: auto;
   }
 }

src/global_styling/mixins/_helpers.scss

@@ -44,6 +44,7 @@
     background-clip: content-box;
   }
 
+  &::-webkit-scrollbar-corner,
   &::-webkit-scrollbar-track {
     background-color: transparent;
   }