fix: code editor styles

getezy · Nov 13, 2022 · 0b6d2a5 · 0b6d2a5
1 parent 10ac250
commit 0b6d2a5
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 7 deletions.
diff --git a/src/app/components/code-editor/code-editor.styled.ts b/src/app/components/code-editor/code-editor.styled.ts
@@ -10,7 +10,6 @@ export const StyledCodeMirror = styled(CodeMirror, {
 
   '.cm-content': {
     padding: 0,
-    caretColor: '$selection',
     fontFamily: '$mono',
     fontSize: '$fontSizes$sm',
   },
@@ -23,16 +22,20 @@ export const StyledCodeMirror = styled(CodeMirror, {
     borderLeftColor: '$text',
   },
 
-  '.cm-selectionBackground': {
-    backgroundColor: '$selection !important',
+  '.cm-focused .cm-selectionBackground, .cm-selectionBackground': {
+    backgroundColor: '$selection',
+  },
+
+  '.cm-activeLine': {
+    backgroundColor: '$accents1',
   },
 
   '.cm-selectionMatch': {
-    backgroundColor: '$accents4',
+    backgroundColor: '$green200',
   },
 
-  '.cm-activeLine': {
-    backgroundColor: '$accents1',
+  '.cm-line': {
+    padding: '0 0 0 4px',
   },
 
   '.cm-gutters': {

diff --git a/src/app/themes/dark.ts b/src/app/themes/dark.ts
@@ -6,7 +6,7 @@ export const DarkTheme = createTheme({
     colors: {
       background: '#202225',
       backgroundContrast: '#292b2f',
-      selection: 'rgba(166, 198, 224, 0.2)',
+      selection: 'rgb(49, 54, 62)',
       ezy: '#acc917',
       gradient: 'linear-gradient(112deg, #acc917 -25%, #4f680f 90%)',
     },