editor background and alignment issue resolved

Author: radhika

packages/ui-kit/src/components/editors/monaco-v2/Editor.tsx

@@ -5,8 +5,7 @@ import { IEditor } from './Editor.interface';
 import MonacoFirecampLangInit, {
   SetCompletionProvider,
 } from '../monaco/lang/init';
-
-import '../monaco/sass/MultiLineIFE.sass';
+import './sass/Editor.sass';
 
 const Editor: FC<IEditor> = ({
   value,

packages/ui-kit/src/components/editors/monaco-v2/SingleLineEditor.tsx

@@ -6,8 +6,6 @@ import MonacoFirecampLangInit, {
   SetCompletionProvider,
 } from '../monaco/lang/init';
 
-import '../monaco/sass/SingleLineIFE.sass';
-
 type TSLEditor = {
   type: 'text' | 'number';
 };

packages/ui-kit/src/components/editors/monaco-v2/sass/Editor.sass

@@ -5,4 +5,10 @@
   font-size: 14px
   left: 66px
   letter-spacing: 0.2px
-  font-family: inherit
+  font-family: inherit
+
+.monaco-editor, .monaco-editor-background, .monaco-editor .inputarea.ime-input
+   background-color: transparent !important
+
+.monaco-editor .margin
+  background-color: var(--focus-level-2) !important     

packages/ui-kit/src/components/editors/monaco/sass/FirecampEditor.sass

@@ -29,7 +29,7 @@ const Url: FC<IUrl> = ({
                 fontWeight: 600,
               }}
               className="without-border without-padding"
-              height={26}
+              height={21}
               path={id}
               type="text"
               onEnter={onEnter}

packages/ui-kit/src/components/editors/monaco/sass/MultiLineIFE.sass

@@ -46,8 +46,10 @@ const Prefix: FC<IPrefix> = ({ children, className }) => {
 
 const Body: FC<IBody> = ({ children, className }) => {
   return (
-    <Column className={className} flex={1} overflow="hidden">
+    <Column className={cx(className, `flex items-center`)} flex={1} overflow="hidden">
+      <div className="flex-1">
       {children}
+      </div>
     </Column>
   );
 };