fix: styles

Author: Kingwl

src/monaco/Monaco.vue

@@ -9,73 +9,73 @@ import * as monaco from 'monaco-editor';
 import { setupThemePromise } from './utils';
 
 interface Props {
-    value?: string
-    language?: string;
-    readonly?: boolean
+  value?: string
+  language?: string;
+  readonly?: boolean
 }
 
 const props = withDefaults(defineProps<Props>(), {
-    value: '',
-    readonly: false
+  value: '',
+  readonly: false
 })
 
 const emits = defineEmits<{
-    (e: 'change', value: string): void,
-    (e: 'save', value: string): void
+  (e: 'change', value: string): void,
+  (e: 'save', value: string): void
 }>()
 
 const containerRef = ref<HTMLDivElement | null>();
 const ready = ref(false);
 const editor = shallowRef<monaco.editor.IStandaloneCodeEditor | undefined>(undefined);
 
 onMounted(async () => {
-    const theme = await setupThemePromise;
-    ready.value = true;
-    await nextTick();
+  const theme = await setupThemePromise;
+  ready.value = true;
+  await nextTick();
 
-    if (!containerRef.value) {
-        throw new Error("Cannot find containerRef");
-    }
+  if (!containerRef.value) {
+    throw new Error("Cannot find containerRef");
+  }
 
-    const editorInstance = monaco.editor.create(containerRef.value, {
-        theme,
-        value: props.value,
-        language: props.language,
-        readOnly: props.readonly,
-        automaticLayout: true,
-        scrollBeyondLastLine: false,
-        minimap: {
-            enabled: false,
-        },
-        inlineSuggest: {
-            enabled: false,
-        },
-    });
-    editor.value = editorInstance
+  const editorInstance = monaco.editor.create(containerRef.value, {
+    theme,
+    value: props.value,
+    language: props.language,
+    readOnly: props.readonly,
+    automaticLayout: true,
+    scrollBeyondLastLine: false,
+    minimap: {
+      enabled: false,
+    },
+    inlineSuggest: {
+      enabled: false,
+    },
+  });
+  editor.value = editorInstance
 
-    await loadGrammars(editorInstance);
+  await loadGrammars(editorInstance);
 
-    editorInstance.addCommand(monaco.KeyMod.CtrlCmd | monaco.KeyCode.KeyS, () => {
-        emits('save', editorInstance.getValue());
-    });
+  editorInstance.addCommand(monaco.KeyMod.CtrlCmd | monaco.KeyCode.KeyS, () => {
+    emits('save', editorInstance.getValue());
+  });
 
-    editorInstance.onDidChangeModelContent(() => {
-        emits('change', editorInstance.getValue());
-    });
+  editorInstance.onDidChangeModelContent(() => {
+    emits('change', editorInstance.getValue());
+  });
 });
 
 watchEffect(() => {
-    if (editor.value && editor.value.getValue() !== props.value) {
-        editor.value.setValue(props.value);
-    }
+  if (editor.value && editor.value.getValue() !== props.value) {
+    editor.value.setValue(props.value);
+  }
 })
 
 onBeforeUnmount(() => {
-    editor.value?.dispose();
+  editor.value?.dispose();
 });
 </script>
 <template>
-    <div class="editor" ref="containerRef"></div>
+  <div class="editor" ref="containerRef"></div>
 </template>
 <style>
 .editor {

src/output/Output.vue

@@ -41,7 +41,6 @@ const mode = ref<OutputModes>(
       readonly
       :language="mode === 'css' ? 'css' : 'javascript'"
       :value="store.state.activeFile.compiled[mode]"
-
     />
   </div>
 </template>