Added lilypond edition

folkugat_web/assets/static/css/lilypond.css

@@ -0,0 +1,35 @@
+/* Override background and text color for the entire editor */
+.CodeMirror {
+  background: #1e1e1e;  /* Dark background */
+  color: #f8f8f2;       /* Light text */
+}
+
+/* Optional: Style the gutter (line numbers) */
+.CodeMirror-gutters {
+  background: #1e1e1e;
+  border-right: 1px solid #444;
+}
+
+/* Optional: Style active line */
+.CodeMirror-activeline-background {
+  background: #2a2a2a !important;
+}
+
+/* Make the cursor white */
+.CodeMirror-cursor {
+  border-left: 1px solid white !important;
+}
+
+/* Optional: Change the cursor color when focused/unfocused */
+.CodeMirror-focused .CodeMirror-cursor {
+  border-left: 1px solid white !important;
+}
+
+.cm-keyword {
+    /* Commands like \relative */
+    color: #569cd6;
+}
+.cm-comment    {
+    /* Notes like c4, d'8 */
+    color: #5c5c5c;
+}

folkugat_web/assets/static/js/lilypond.js

@@ -0,0 +1,17 @@
+CodeMirror.defineMode("lilypond", function() {
+  return {
+    token: function(stream) {
+      // Highlight Comments
+      if (stream.match(/%.*$/)) {
+        return "comment";
+      }
+      // Highlight LilyPond commands (e.g., \relative, \time, \key)
+      if (stream.match(/\\[a-zA-Z]+/)) {
+        return "keyword";
+      }
+      // Move to the next character
+      stream.next();
+      return null;
+    }
+  };
+});