hide scrollbar

it breaks ui

src/SegmentList.jsx

@@ -60,7 +60,7 @@ const SegmentList = memo(({
 
   return (
     <Fragment>
-      <div style={{ padding: '0 10px', overflowY: 'scroll', flexGrow: 1 }}>
+      <div style={{ padding: '0 10px', overflowY: 'scroll', flexGrow: 1 }} className="hide-scrollbar">
         <div style={{ fontSize: 14, marginBottom: 10 }}>
           <FaAngleRight
             title="Close sidebar"

src/StreamsSelector.jsx

@@ -17,7 +17,7 @@ function onInfoClick(s, title) {
   ReactSwal.fire({
     showCloseButton: true,
     title,
-    html: <div style={{ whiteSpace: 'pre', textAlign: 'left', overflow: 'auto', maxHeight: 300, overflowY: 'scroll' }}>{JSON.stringify(s, null, 2)}</div>,
+    html: <div style={{ whiteSpace: 'pre', textAlign: 'left', overflow: 'auto', maxHeight: 300, overflowY: 'auto' }}>{JSON.stringify(s, null, 2)}</div>,
   });
 }
 

src/Timeline.jsx

@@ -117,7 +117,7 @@ const Timeline = memo(({
       <div style={{ position: 'relative' }}>
         <div
           style={{ overflowX: 'scroll' }}
-          id="timeline-scroller"
+          className="hide-scrollbar"
           onWheel={onWheel}
           onScroll={onTimelineScroll}
           ref={timelineScrollerRef}

src/ffmpeg.js

@@ -18,7 +18,6 @@ const isDev = window.require('electron-is-dev');
 const os = window.require('os');
 
 
-
 function getFfCommandLine(cmd, args) {
   const mapArg = arg => (/[^0-9a-zA-Z-_]/.test(arg) ? `'${arg}'` : arg);
   return `${cmd} ${args.map(mapArg).join(' ')}`;

src/main.css

@@ -62,6 +62,6 @@ body {
   color: rgba(0,0,0,0.5);
 }
 
-#timeline-scroller::-webkit-scrollbar {
+.hide-scrollbar::-webkit-scrollbar {
   display: none;
-}
+}