tabs scroll (codesandbox#2725)

yeion7 · CompuIves · commit 6521dcda5319 · 2019-10-12T10:32:10.000+01:00
diff --git a/packages/app/src/app/components/Preview/DevTools/Tabs/elements.ts b/packages/app/src/app/components/Preview/DevTools/Tabs/elements.ts
@@ -4,6 +4,7 @@ export const Container = styled.div`
   display: flex;
   flex: auto;
   margin-right: 1rem;
+  overflow-x: auto;
 `;
 
 export const Tabs = styled.div`
diff --git a/packages/app/src/app/pages/Sandbox/Editor/Content/index.js b/packages/app/src/app/pages/Sandbox/Editor/Content/index.js
@@ -493,8 +493,9 @@ class EditorPreview extends React.Component {
             }
             pane2Style={{
               visibility: windowVisible ? 'visible' : 'hidden',
-              maxWidth: windowVisible ? 'inherit' : 0,
-              width: windowVisible ? 'inherit' : 0,
+              maxWidth: windowVisible ? '100%' : 0,
+              width: windowVisible ? '100%' : 0,
+              overflow: 'hidden',
               zIndex: 0, // For VSCode hovers, beware this is also dynamically changed in PreviewTabs
             }}
           >

Original file line number	Diff line number	Diff line change
`@@ -493,8 +493,9 @@ class EditorPreview extends React.Component {`
`493`	`493`	`}`
`494`	`494`	`pane2Style={{`
`495`	`495`	`visibility: windowVisible ? 'visible' : 'hidden',`
`496`		`- maxWidth: windowVisible ? 'inherit' : 0,`
`497`		`- width: windowVisible ? 'inherit' : 0,`
	`496`	`+ maxWidth: windowVisible ? '100%' : 0,`
	`497`	`+ width: windowVisible ? '100%' : 0,`
	`498`	`+ overflow: 'hidden',`
`498`	`499`	`zIndex: 0, // For VSCode hovers, beware this is also dynamically changed in PreviewTabs`
`499`	`500`	`}}`
`500`	`501`	`>`