created new theme for light mode

This commit is contained in:
2024-12-19 10:18:40 +01:00
parent ea83e95a00
commit f0fdac9449

View File

@@ -2,7 +2,7 @@
import { onBeforeUpdate, inject } from 'vue' import { onBeforeUpdate, inject } from 'vue'
import { Codemirror } from 'vue-codemirror' import { Codemirror } from 'vue-codemirror'
import { oneDark } from '@codemirror/theme-one-dark' import { oneDark } from '@codemirror/theme-one-dark'
import { espresso } from 'thememirror'; import {EditorView} from "@codemirror/view"
import {xml} from '@codemirror/lang-xml' import {xml} from '@codemirror/lang-xml'
import {json} from '@codemirror/lang-json' import {json} from '@codemirror/lang-json'
import {html} from '@codemirror/lang-html' 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( const emit = defineEmits(
[ [
'update:updatedCode' 'update:updatedCode'
@@ -37,7 +51,7 @@ function selectTheme() {
if (isDarkModeSet()) if (isDarkModeSet())
return oneDark; return oneDark;
else else
return espresso; return baseTheme;
} }
function isDarkModeSet(){ function isDarkModeSet(){