From 52948bcbce685aa95cdf56557d61ec2077fd0da7 Mon Sep 17 00:00:00 2001
From: Ben Haynes <ben@rngr.org>
Date: Wed, 27 Jan 2021 18:35:18 -0500
Subject: [PATCH] fixes #3788

---
 app/src/styles/lib/_codemirror.scss | 69 ++++++++++++++---------------
 1 file changed, 34 insertions(+), 35 deletions(-)

diff --git a/app/src/styles/lib/_codemirror.scss b/app/src/styles/lib/_codemirror.scss
index 89f8a2267a..4af0eb5bb4 100644
--- a/app/src/styles/lib/_codemirror.scss
+++ b/app/src/styles/lib/_codemirror.scss
@@ -6,7 +6,6 @@
 	width: 100%;
 	height: 300px;
 	height: auto;
-	color: black;
 	color: var(--foreground-normal);
 	font-weight: inherit;
 	font-family: var(--family-monospace);
@@ -55,43 +54,43 @@
 .CodeMirror-linenumber {
 	min-width: 20px;
 	padding: 0 3px 0 5px;
-	color: #999;
+	color: var(--foreground-subdued);;
 	white-space: nowrap;
 	text-align: right;
 }
 
-.CodeMirror-guttermarker { color: black; }
-.CodeMirror-guttermarker-subtle { color: #999; }
+.CodeMirror-guttermarker { color: var(--foreground-normal-alt); }
+.CodeMirror-guttermarker-subtle { color: var(--foreground-subdued); }
 
 /* CURSOR */
 
 .CodeMirror-cursor {
 	width: 0;
 	border-right: none;
-	border-left: 1px solid black;
+	border-left: 1px solid var(--foreground-normal);
 }
 
 /* Shown when moving in bi-directional text */
 .CodeMirror div.CodeMirror-secondarycursor {
-	border-left: 1px solid silver;
+	border-left: 1px solid var(--foreground-subdued);
 }
 .cm-fat-cursor .CodeMirror-cursor {
 	width: auto;
-	background: #7e7;
+	background: var(--success-75);
 	border: 0 !important;
 }
 .cm-fat-cursor div.CodeMirror-cursors {
 	z-index: 1;
 }
 .cm-fat-cursor-mark {
-	background-color: rgba(20, 255, 20, 0.5);
+	background-color: rgba(93, 194, 136, 0.5);
 	-webkit-animation: blink 1.06s steps(1) infinite;
 	-moz-animation: blink 1.06s steps(1) infinite;
 	animation: blink 1.06s steps(1) infinite;
 }
 .cm-animate-fat-cursor {
 	width: auto;
-	background-color: #7e7;
+	background-color: var(--success-75);
 	border: 0;
 	-webkit-animation: blink 1.06s steps(1) infinite;
 	-moz-animation: blink 1.06s steps(1) infinite;
@@ -126,51 +125,51 @@
 .CodeMirror-ruler {
 	position: absolute;
 	top: 0; bottom: 0;
-	border-left: 1px solid #ccc;
+	border-left: 1px solid var(--border-normal);
 }
 
 /* DEFAULT THEME */
 
-.cm-s-default .cm-header {color: blue;}
-.cm-s-default .cm-quote {color: #090;}
-.cm-negative {color: #d44;}
-.cm-positive {color: #292;}
+.cm-s-default .cm-header {color: var(--primary);}
+.cm-s-default .cm-quote {color: var(--success);}
+.cm-negative {color: var(--danger);}
+.cm-positive {color: var(--success);}
 .cm-header, .cm-strong {font-weight: bold;}
 .cm-em {font-style: italic;}
 .cm-link {text-decoration: underline;}
 .cm-strikethrough {text-decoration: line-through;}
 
-.cm-s-default .cm-keyword {color: #708;}
-.cm-s-default .cm-atom {color: #219;}
-.cm-s-default .cm-number {color: #164;}
-.cm-s-default .cm-def {color: #00f;}
+.cm-s-default .cm-keyword {color: var(--secondary);}
+.cm-s-default .cm-atom {color: var(--primary);}
+.cm-s-default .cm-number {color: var(--success);}
+.cm-s-default .cm-def {color: var(--primary);}
 .cm-s-default .cm-variable,
 .cm-s-default .cm-punctuation,
 .cm-s-default .cm-property,
 .cm-s-default .cm-operator {}
-.cm-s-default .cm-variable-2 {color: #05a;}
-.cm-s-default .cm-variable-3, .cm-s-default .cm-type {color: #085;}
-.cm-s-default .cm-comment {color: #a50;}
-.cm-s-default .cm-string {color: #a11;}
-.cm-s-default .cm-string-2 {color: #f50;}
-.cm-s-default .cm-meta {color: #555;}
-.cm-s-default .cm-qualifier {color: #555;}
-.cm-s-default .cm-builtin {color: #30a;}
-.cm-s-default .cm-bracket {color: #997;}
-.cm-s-default .cm-tag {color: #170;}
-.cm-s-default .cm-attribute {color: #00c;}
-.cm-s-default .cm-hr {color: #999;}
-.cm-s-default .cm-link {color: #00c;}
+.cm-s-default .cm-variable-2 {color: var(--primary);}
+.cm-s-default .cm-variable-3, .cm-s-default .cm-type {color: var(--success);}
+.cm-s-default .cm-comment {color: var(--warning);}
+.cm-s-default .cm-string {color: var(--danger);}
+.cm-s-default .cm-string-2 {color: var(--warning);}
+.cm-s-default .cm-meta {color: var(--foreground-normal);}
+.cm-s-default .cm-qualifier {color: var(--foreground-normal);}
+.cm-s-default .cm-builtin {color: var(--primary);}
+.cm-s-default .cm-bracket {color: var(--foreground-subdued);}
+.cm-s-default .cm-tag {color: var(--success);}
+.cm-s-default .cm-attribute {color: var(--primary);}
+.cm-s-default .cm-hr {color: var(--border-normal);}
+.cm-s-default .cm-link {color: var(--primary);}
 
-.cm-s-default .cm-error {color: #f00;}
-.cm-invalidchar {color: #f00;}
+.cm-s-default .cm-error {color: var(--danger);}
+.cm-invalidchar {color: var(--danger);}
 
 .CodeMirror-composing { border-bottom: 2px solid; }
 
 /* Default styles for common addons */
 
-div.CodeMirror span.CodeMirror-matchingbracket {color: #0b0;}
-div.CodeMirror span.CodeMirror-nonmatchingbracket {color: #a22;}
+div.CodeMirror span.CodeMirror-matchingbracket {color: var(--success);}
+div.CodeMirror span.CodeMirror-nonmatchingbracket {color: var(--danger);}
 .CodeMirror-matchingtag { background: rgba(255, 150, 0, .3); }
 .CodeMirror-activeline-background {background: #e8f2ff;}