From 7559985a2ed1974bac3d5c48ecf7698e4f3fc16b Mon Sep 17 00:00:00 2001 From: orangemug Date: Sun, 2 Feb 2020 11:32:58 +0000 Subject: [PATCH] Changed bracket matching color so it doesn't clash with cursor. --- src/codemirror-maputnik.css | 57 --------------------------- src/components/layers/JSONEditor.jsx | 1 - src/styles/_codemirror.scss | 58 ++++++++++++++++++++++++++++ 3 files changed, 58 insertions(+), 58 deletions(-) delete mode 100644 src/codemirror-maputnik.css diff --git a/src/codemirror-maputnik.css b/src/codemirror-maputnik.css deleted file mode 100644 index b43c6c0..0000000 --- a/src/codemirror-maputnik.css +++ /dev/null @@ -1,57 +0,0 @@ -.cm-s-maputnik.CodeMirror { - height: 100%; - font-size: 12px; -} - -.cm-s-maputnik.CodeMirror, .cm-s-maputnik .CodeMirror-gutters { - color: #8e8e8e; - border: none; -} - -.cm-s-maputnik.CodeMirror { - background: transparent; -} - -.cm-s-maputnik .CodeMirror-gutters { - background: #212328; -} - -.cm-s-maputnik .CodeMirror-cursor { - border-left: solid thin #f0f0f0 !important; -} - -.cm-s-maputnik.CodeMirror-focused div.CodeMirror-selected { - background: rgba(255, 255, 255, 0.10); -} - -.cm-s-maputnik .CodeMirror-line::selection, -.cm-s-maputnik .CodeMirror-line > span::selection, -.cm-s-maputnik .CodeMirror-line > span > span::selection { - background: rgba(255, 255, 255, 0.10); -} - -.cm-s-maputnik .CodeMirror-line::-moz-selection, -.cm-s-maputnik .CodeMirror-line > span::-moz-selection, -.cm-s-maputnik .CodeMirror-line > span > span::-moz-selection { - background: rgba(255, 255, 255, 0.10); -} - -.cm-s-maputnik span.cm-string, .cm-s-maputnik span.cm-string-2 { - color: #8f9d6a; -} -.cm-s-maputnik span.cm-number { color: #91675f; } -.cm-s-maputnik span.cm-property { color: #b8a077; } - -.cm-s-maputnik .CodeMirror-activeline-background { - background: rgba(255,255,255,0.1); -} - -.cm-s-maputnik .CodeMirror-matchingbracket { - background-color: #f0f0f0; - color: #565659 !important; -} - -.cm-s-maputnik .CodeMirror-nonmatchingbracket { - background-color: #bb0000; - color: white !important; -} diff --git a/src/components/layers/JSONEditor.jsx b/src/components/layers/JSONEditor.jsx index e0a99ec..77b258c 100644 --- a/src/components/layers/JSONEditor.jsx +++ b/src/components/layers/JSONEditor.jsx @@ -10,7 +10,6 @@ import 'codemirror/addon/lint/lint' import 'codemirror/addon/edit/matchbrackets' import 'codemirror/lib/codemirror.css' import 'codemirror/addon/lint/lint.css' -import '../../codemirror-maputnik.css' import jsonlint from 'jsonlint' // This is mainly because of this issue also the API has changed, see comment in file diff --git a/src/styles/_codemirror.scss b/src/styles/_codemirror.scss index 14cb415..f3f931a 100644 --- a/src/styles/_codemirror.scss +++ b/src/styles/_codemirror.scss @@ -7,3 +7,61 @@ position: relative; overflow: auto; } + +.cm-s-maputnik.CodeMirror { + height: 100%; + font-size: 12px; +} + +.cm-s-maputnik.CodeMirror, .cm-s-maputnik .CodeMirror-gutters { + color: #8e8e8e; + border: none; +} + +.cm-s-maputnik.CodeMirror { + background: transparent; +} + +.cm-s-maputnik .CodeMirror-gutters { + background: #212328; +} + +.cm-s-maputnik .CodeMirror-cursor { + border-left: solid thin #f0f0f0 !important; +} + +.cm-s-maputnik.CodeMirror-focused div.CodeMirror-selected { + background: rgba(255, 255, 255, 0.10); +} + +.cm-s-maputnik .CodeMirror-line::selection, +.cm-s-maputnik .CodeMirror-line > span::selection, +.cm-s-maputnik .CodeMirror-line > span > span::selection { + background: rgba(255, 255, 255, 0.10); +} + +.cm-s-maputnik .CodeMirror-line::-moz-selection, +.cm-s-maputnik .CodeMirror-line > span::-moz-selection, +.cm-s-maputnik .CodeMirror-line > span > span::-moz-selection { + background: rgba(255, 255, 255, 0.10); +} + +.cm-s-maputnik span.cm-string, .cm-s-maputnik span.cm-string-2 { + color: #8f9d6a; +} +.cm-s-maputnik span.cm-number { color: #91675f; } +.cm-s-maputnik span.cm-property { color: #b8a077; } + +.cm-s-maputnik .CodeMirror-activeline-background { + background: rgba(255,255,255,0.1); +} + +.cm-s-maputnik .CodeMirror-matchingbracket { + background: hsla(223, 12%, 35%, 1); + color: $color-white !important; +} + +.cm-s-maputnik .CodeMirror-nonmatchingbracket { + background-color: #bb0000; + color: white !important; +}