add overflow:hidden on app container to ensure there is no scrollbar

src/components/base/Box/Box.js

@@ -40,6 +40,7 @@ export default styled.div`
   flex-grow: ${p => (p.grow === true ? '1' : p.grow || '')};
   flex-direction: ${p => (p.horizontal ? 'row' : 'column')};
 
+  overflow: ${p => p.overflow};
   overflow-y: ${p => (p.scroll === true ? 'auto' : '')};
   position: ${p => (p.relative ? 'relative' : p.sticky ? 'absolute' : '')};
 

src/components/layout/Default.js

@@ -74,7 +74,7 @@ class Default extends Component<Props> {
           <Box grow horizontal bg="white">
             <SideBar />
 
-            <Box shrink grow bg="lightGrey" color="grey" relative>
+            <Box shrink grow bg="lightGrey" color="grey" overflow="hidden" relative>
               <TopBar />
               <Main innerRef={n => (this._scrollContainer = n)} tabIndex={-1}>
                 <Route path="/" exact component={DashboardPage} />