Carbon: fix scrollbar style in safari & ff

examples/app.vue

@@ -7,7 +7,13 @@
     margin: 0;
     padding: 0;
     height: 100%;
-    overflow-y: hidden;
+    font-family: 'Helvetica Neue',Helvetica,'PingFang SC','Hiragino Sans GB','Microsoft YaHei',SimSun,sans-serif;
+    font-weight: 400;
+    -webkit-font-smoothing: antialiased;
+
+    &.is-component {
+      overflow: hidden;
+    }
   }
 
   #app {
@@ -22,6 +28,7 @@
         height: 100%;
         min-height: auto;
       }
+
       .headerWrapper {
         position: fixed;
         width: 100%;
@@ -36,13 +43,6 @@
     }
   }
 
-  body {
-    font-family: 'Helvetica Neue',Helvetica,'PingFang SC','Hiragino Sans GB','Microsoft YaHei',SimSun,sans-serif;
-    overflow: auto;
-    font-weight: 400;
-    -webkit-font-smoothing: antialiased;
-  }
-
   a {
     color: #409EFF;
     text-decoration: none;

examples/components/header.vue

@@ -476,7 +476,7 @@
 
     mounted() {
       function scroll(fn) {
-        document.body.addEventListener('scroll', fn, false);
+        window.addEventListener('scroll', fn, false);
       }
       scroll(() => {
         if (this.isHome) {

examples/pages/template/component.tpl

@@ -241,6 +241,10 @@
       this.componentScrollBox = this.componentScrollBar.$el.querySelector('.el-scrollbar__wrap');
       this.throttledScrollHandler = throttle(300, this.handleScroll);
       this.componentScrollBox.addEventListener('scroll', this.throttledScrollHandler);
+      document.body.classList.add('is-component');
+    },
+    destroyed() {
+      document.body.classList.remove('is-component');
     },
     beforeDestroy() {
       this.componentScrollBox.removeEventListener('scroll', this.throttledScrollHandler);