diff --git a/src/app/components/code-editor/code-editor.styled.ts b/src/app/components/code-editor/code-editor.styled.ts index b082aa7..43e1614 100644 --- 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 index d8fc346..c2c1f56 100644 --- 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%)', },