diff --git a/Frontend/src/components/common/CodeEditorComponent.vue b/Frontend/src/components/common/CodeEditorComponent.vue index bc233b7..54e8bd7 100644 --- a/Frontend/src/components/common/CodeEditorComponent.vue +++ b/Frontend/src/components/common/CodeEditorComponent.vue @@ -2,7 +2,7 @@ import { onBeforeUpdate, inject } from 'vue' import { Codemirror } from 'vue-codemirror' import { oneDark } from '@codemirror/theme-one-dark' -import { espresso } from 'thememirror'; +import {EditorView} from "@codemirror/view" import {xml} from '@codemirror/lang-xml' import {json} from '@codemirror/lang-json' import {html} from '@codemirror/lang-html' @@ -18,6 +18,20 @@ const props= defineProps({ }, }) +let baseTheme = EditorView.baseTheme({ + ".cm-o-replacement": { + display: "inline-block", + width: ".5em", + height: ".5em", + borderRadius: ".25em" + }, + "&light .cm-o-replacement": { + backgroundColor: "#04c" + }, + "&dark .cm-o-replacement": { + backgroundColor: "#5bf" + } +}) const emit = defineEmits( [ 'update:updatedCode' @@ -37,7 +51,7 @@ function selectTheme() { if (isDarkModeSet()) return oneDark; else - return espresso; + return baseTheme; } function isDarkModeSet(){