renamed code editor content css class to avoid collisions

ui/src/base/codeEditor.js

@@ -145,7 +145,7 @@ window.app.components.codeEditor = function(propsArg = {}) {
         autocomplete: "off",
         autocapitalize: "off",
         role: "textbox",
-        className: "editor-content",
+        className: "code-editor-content",
         "html-data-placeholder": () => props.placeholder,
         onmount: (el) => {
             // auto change change textContent only if it props.value was

ui/src/css/form.css

@@ -1091,7 +1091,7 @@ button {
         position: relative;
         width: 100%;
     }
-    .editor-content,
+    .code-editor-content,
     .highlight-overlay {
         display: block;
         width: 100%;
@@ -1119,7 +1119,7 @@ button {
         top: 0;
         pointer-events: none;
     }
-    .editor-content {
+    .code-editor-content {
         color: transparent;
         resize: none;
         caret-color: var(--surfaceTxtHintColor);
@@ -1137,7 +1137,7 @@ button {
         padding-bottom: 9px;
     }
     &.pre-wrap {
-        .editor-content,
+        .code-editor-content,
         .highlight-overlay {
             white-space: pre-wrap;
         }

ui/src/css/ruleField.css

@@ -3,13 +3,13 @@
     .code-editor {
         z-index: 0;
         min-height: 41px;
-        .editor-content:empty::before {
+        .code-editor-content:empty::before {
             font-family: var(--baseFontFamily);
         }
         .highlight-overlay {
             color: var(--surfaceTxtColor);
         }
-        .editor-content, .highlight-overlay {
+        .code-editor-content, .highlight-overlay {
             white-space: pre-wrap;
         }
     }