created new theme for light mode
This commit is contained in:
@@ -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(){
|
||||||
|
|||||||
Reference in New Issue
Block a user