[#66233] add active line indicator to the main CodeMirror component

antmicro · Sep 24, 2024 · 777a7b0 · 777a7b0
1 parent 52036c1
commit 777a7b0
Showing 1 changed file with 18 additions and 0 deletions.
diff --git a/src/components/CodeMirror.js b/src/components/CodeMirror.js
@@ -151,6 +151,24 @@ const CodeEditor = styled.div`
   .cm-gutterElement span[title="Unfold line"] {
     user-select: none;
   }
+
+  .cm-line {
+    padding-left: 11px;
+  }
+
+  .cm-activeLine:not(.comment-wrapper *) {
+    position: relative;
+
+    &::before {
+      content: "";
+      display: block;
+      width: 5px;
+      height: 100%;
+      position: absolute;
+      background-color: var(--blue-200);
+      transform: translateX(-11px);
+    }
+  }
 `;
 
 const setEditorText = (editor, text) => {