Add "None" theme for the Web IDE

Add support for None (lack of a theme) theme for the Web IDE

app/assets/javascripts/ide/lib/themes/index.js

@@ -3,6 +3,7 @@ import dark from './dark';
 import monokai from './monokai';
 import solarizedLight from './solarized_light';
 import solarizedDark from './solarized_dark';
+import none from './none';
 
 export const themes = [
   {
@@ -25,6 +26,10 @@ export const themes = [
     name: 'monokai',
     data: monokai,
   },
+  {
+    name: 'none',
+    data: none,
+  },
 ];
 
 export const DEFAULT_THEME = 'white';

app/assets/javascripts/ide/lib/themes/none.js

+export default {
+  base: 'vs',
+  inherit: false,
+  rules: [],
+  colors: {
+    'editor.foreground': '#2e2e2e',
+    'editor.selectionBackground': '#aad6f8',
+    'editor.lineHighlightBackground': '#fffeeb',
+    'editorCursor.foreground': '#666666',
+    'editorWhitespace.foreground': '#bbbbbb',
+
+    'editorLineNumber.foreground': '#cccccc',
+    'diffEditor.insertedTextBackground': '#a0f5b420',
+    'diffEditor.removedTextBackground': '#f9d7dc20',
+    'editorIndentGuide.activeBackground': '#cccccc',
+  },
+};

app/assets/stylesheets/page_bundles/_ide_monaco_overrides.scss

@@ -76,8 +76,9 @@
   min-height: 0; // firefox fix
 }
 
-// Apply theme related overrides only to the white theme
-.theme-white .blob-editor-container {
+// Apply theme related overrides only to the white theme and none theme
+.theme-white .blob-editor-container,
+.theme-none .blob-editor-container {
   .monaco-diff-editor {
     .editor.modified {
       box-shadow: none;
@@ -139,7 +140,8 @@
   }
 }
 
-.theme-white .multi-file-editor-holder {
+.theme-white .multi-file-editor-holder,
+.theme-none .multi-file-editor-holder {
   &.is-readonly,
   .editor.original {
     .monaco-editor,

changelogs/unreleased/216543-none-syntax-highlighting-theme-for-web-ide.yml

+---
+title: None syntax highlighting theme for Web IDE
+merge_request: 31056
+author:
+type: added