2 files changed, 8 insertions, 3 deletions

diff --git a/language-web/src/main/js/editor/EditorParent.ts b/language-web/src/main/js/editor/EditorParent.ts
index ee1323f6..2d74b863 100644
--- a/language-web/src/main/js/editor/EditorParent.ts
+++ b/language-web/src/main/js/editor/EditorParent.ts
@@ -34,6 +34,9 @@ export const EditorParent = styled('div')(({ theme }) => {
     '&, .cm-editor': {
       height: '100%',
     },
+    '.cm-content': {
+      padding: 0,
+    },
     '.cm-scroller, .cm-tooltip-autocomplete, .cm-completionLabel, .cm-completionDetail': {
       fontSize: 16,
       fontFamily: '"JetBrains MonoVariable", "JetBrains Mono", monospace',
@@ -46,7 +49,7 @@ export const EditorParent = styled('div')(({ theme }) => {
       color: theme.palette.text.secondary,
     },
     '.cm-gutters': {
-      background: theme.palette.background.default,
+      background: 'rgba(255, 255, 255, 0.1)',
       color: theme.palette.text.disabled,
       border: 'none',
     },
@@ -57,7 +60,9 @@ export const EditorParent = styled('div')(({ theme }) => {
       background: 'rgba(0, 0, 0, 0.3)',
     },
     '.cm-activeLineGutter': {
-      background: 'rgba(0, 0, 0, 0.3)',
+      background: 'transparent',
+    },
+    '.cm-lineNumbers .cm-activeLineGutter': {
       color: theme.palette.text.primary,
     },
     '.cm-cursor, .cm-cursor-primary': {
diff --git a/language-web/src/main/js/editor/EditorStore.ts b/language-web/src/main/js/editor/EditorStore.ts
index ba31efcb..059233f4 100644
--- a/language-web/src/main/js/editor/EditorStore.ts
+++ b/language-web/src/main/js/editor/EditorStore.ts
@@ -112,8 +112,8 @@ export class EditorStore {
         }),
         semanticHighlighting,
         // We add the gutters to `extensions` in the order we want them to appear.
-        foldGutter(),
         lineNumbers(),
+        foldGutter(),
         keymap.of([
           ...closeBracketsKeymap,
           ...commentKeymap,