custom theme

package.json

@@ -13,8 +13,8 @@
   },
   "dependencies": {
     "@codemirror/lang-javascript": "^6.1.4",
+    "@codemirror/language": "^6.10.8",
     "@codemirror/state": "^6.2.0",
-    "@codemirror/theme-one-dark": "^6.1.1",
     "@codemirror/view": "^6.9.3",
     "@flok-editor/cm-eval": "^1.0.1",
     "@flok-editor/session": "^1.1.0",

src/main.js

@@ -1,6 +1,5 @@
 import { EditorView, basicSetup } from "codemirror";
 import { javascript } from "@codemirror/lang-javascript";
-import { oneDark } from "@codemirror/theme-one-dark";
 import { EditorState, Prec } from "@codemirror/state";
 import { keymap } from "@codemirror/view";
 import { yCollab } from "y-codemirror.next";
@@ -9,6 +8,7 @@ import { flashField, evalKeymap, remoteEvalFlash } from "@flok-editor/cm-eval";
 import { UndoManager } from "yjs";
 import { highlightExtension } from "@strudel/codemirror";
 import { StrudelSession, editorViews } from "./strudel";
+import { kabelsalatTheme } from "./theme";
 
 import "./style.css";
 
@@ -45,10 +45,10 @@ const createEditor = (doc) => {
     doc: doc.content,
     extensions: [
       basicSetup,
+      kabelsalatTheme,
       flokBasicSetup(doc),
       javascript(),
       EditorView.lineWrapping,
-      oneDark,
       Prec.highest(
         keymap.of([
           ...stopKeys.map((key) => ({
@@ -67,7 +67,6 @@ const createEditor = (doc) => {
   const view = new EditorView({
     state,
     parent: editorEl,
-    // extensions: [kabelsalatTheme],
   });
   editorViews.set(doc.id, view);
 
@@ -80,8 +79,6 @@ const createEditor = (doc) => {
   doc.session.on(`change-target:${doc.id}`, () => {
     targetEl.value = doc.target;
   });
-
-  return [state, view];
 };
 
 const handleEvalHydra = (msg) => {

src/style.css

@@ -28,7 +28,7 @@ body {
 }
 
 :root {
-  --foreground: #eeeeee80;
+  --foreground: #ffffff80;
 }
 
 .editor {