Fix z-index of VSCode quick opener

Author: CompuIves

packages/app/src/app/components/CodeEditor/VSCode/elements.js

@@ -1,4 +1,4 @@
-import styled from 'styled-components';
+import styled, { createGlobalStyle } from 'styled-components';
 import theme from 'common/theme';
 
 export const Container = styled.div`
@@ -51,3 +51,9 @@ export const CodeContainer = styled.div`
     -webkit-font-smoothing: auto;
   }
 `;
+
+export const GlobalStyles = createGlobalStyle`
+  .monaco-quick-open-widget {
+    z-index: 50 !important;
+  }
+`;

packages/app/src/app/components/CodeEditor/VSCode/index.js

@@ -26,7 +26,7 @@ import LinterWorker from 'worker-loader?publicPath=/&name=monaco-linter.[hash:8]
 import eventToTransform from '../Monaco/event-to-transform';
 import MonacoEditorComponent from './MonacoReactComponent';
 import type { EditorAPI } from './MonacoReactComponent';
-import { Container } from './elements';
+import { Container, GlobalStyles } from './elements';
 import defineTheme from '../Monaco/define-theme';
 import getSettings from '../Monaco/settings';
 
@@ -1214,6 +1214,7 @@ class MonacoEditor extends React.Component<Props, State> implements Editor {
 
     return (
       <Container id="vscode-container">
+        <GlobalStyles />
         <MonacoEditorComponent
           width={width}
           height={height}