feat(neuron-ui): add custom scrollbar on activity list

nervosnetwork · Aug 10, 2019 · 84d10d2 · 84d10d2
1 parent b357209
commit 84d10d2
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 1 deletion.
diff --git a/packages/neuron-ui/src/components/Overview/index.tsx b/packages/neuron-ui/src/components/Overview/index.tsx
@@ -80,9 +80,11 @@ const ActivityList = ({
       onItemInvoked={item => {
         showTransactionDetails(item.hash)
       }}
+      className="customScrollBar"
       styles={{
         root: {
-          overflow: 'auto',
+          overflowX: 'hidden',
+          overflowY: 'auto',
           height: '100%',
           backgroundColor: 'transparent',
         },

diff --git a/packages/neuron-ui/src/styles/index.scss b/packages/neuron-ui/src/styles/index.scss
@@ -66,6 +66,20 @@ navbar {
   }
 }
 
+
+.customScrollBar {
+  &::-webkit-scrollbar {
+    border-radius: 5px;
+    background-color: #e0e0e0;
+    width: 10px
+  }
+
+  &::-webkit-scrollbar-thumb {
+    border-radius: 5px;
+    background-color: #bdbdbd;
+  }
+}
+
 @keyframes rotate360 {
   from {
     transform: rotate(0)