From 2938c76d2d83300ad807451b7a24ce0c52596f5c Mon Sep 17 00:00:00 2001
From: Eswaraprasadp <peswar1701@gmail.com>
Date: Wed, 25 Mar 2020 19:03:02 +0530
Subject: [PATCH 1/2] Modify dark theme

---
 .../components/_p5-dark-codemirror-theme.scss  | 18 ++++++++++--------
 1 file changed, 10 insertions(+), 8 deletions(-)

diff --git a/client/styles/components/_p5-dark-codemirror-theme.scss b/client/styles/components/_p5-dark-codemirror-theme.scss
index f10cbad9..b76f652b 100644
--- a/client/styles/components/_p5-dark-codemirror-theme.scss
+++ b/client/styles/components/_p5-dark-codemirror-theme.scss
@@ -14,15 +14,15 @@ $p5-dark-lightbrown: #A67F59;
 $p5-light-green: #42F48F;
 $p5-dark-black: #333;
 $p5-dark-pink: #D9328F;
-$p5-dark-gray: #A0A0A0;
-$p5-dark-lightblue: #00A1D3;
-$p5-dark-darkblue: #2D7BB6;
+$p5-dark-gray: #999999;
+$p5-dark-lightblue: #0F9DD7;
+$p5-dark-darkblue: #318094;
 $p5-dark-white: #FDFDFD;
 $p5-dark-orange: #EE9900;
 $p5-dark-lightgray: #E0D7D1;
 $p5-dark-darkgray: #666666;
 $p5-dark-green: #58a10b;
-$p5-dark-goldbrown: #b58317;
+$p5-dark-goldbrown: #b58318;
 
 $p5-dark-gutter: #f4f4f4;
 $p5-dark-number: #b5b5b5;
@@ -39,7 +39,7 @@ $p5-dark-activeline: rgb(207, 207, 207);
 }
 
 .cm-s-p5-dark .cm-def {
-  color: $p5-dark-darkblue;
+  color: $p5-dark-lightblue;
 }
 
 .cm-s-p5-dark .cm-string {
@@ -75,7 +75,7 @@ $p5-dark-activeline: rgb(207, 207, 207);
 }
 
 .cm-s-p5-dark .cm-operator {
-  color: $p5-dark-lightbrown;
+  color: $p5-dark-white;
 }
 
 .cm-s-p5-dark .cm-linenumber {
@@ -96,7 +96,7 @@ $p5-dark-activeline: rgb(207, 207, 207);
 }
 
 .cm-s-p5-dark .cm-error {
-  color: #f00;
+  color: #df3a3d;
 }
 
 .cm-s-p5-dark .CodeMirror-matchingbracket {
@@ -115,6 +115,7 @@ $p5-dark-activeline: rgb(207, 207, 207);
 
 .cm-s-p5-dark .cm-builtin {
   color: $p5-dark-lightblue;
+  font-weight: bold;
 }
 
 .cm-s-p5-dark .cm-attribute {
@@ -122,7 +123,8 @@ $p5-dark-activeline: rgb(207, 207, 207);
 }
 
 .cm-s-p5-dark .cm-p5-function {
-  color: $p5-dark-darkblue;
+  color: $p5-dark-lightblue;
+  font-weight: bold !important;
 }
 
 .cm-s-p5-dark .cm-p5-variable {

From c1d0ccec010d2f57f651312afb6aff53f568a535 Mon Sep 17 00:00:00 2001
From: Cassie Tarakajian <ctarakajian@gmail.com>
Date: Wed, 1 Apr 2020 13:22:53 -0400
Subject: [PATCH 2/2] Additional updates to dark theme: specificity changes and
 reorder for proper cascade

---
 .../components/_p5-dark-codemirror-theme.scss | 44 ++++++++++---------
 1 file changed, 23 insertions(+), 21 deletions(-)

diff --git a/client/styles/components/_p5-dark-codemirror-theme.scss b/client/styles/components/_p5-dark-codemirror-theme.scss
index b76f652b..bd073941 100644
--- a/client/styles/components/_p5-dark-codemirror-theme.scss
+++ b/client/styles/components/_p5-dark-codemirror-theme.scss
@@ -29,52 +29,54 @@ $p5-dark-number: #b5b5b5;
 $p5-dark-selected: rgba(45, 123, 182, 25);
 $p5-dark-activeline: rgb(207, 207, 207);
 
+$p5-dark-error: #df3a3d;
+
 .cm-s-p5-dark {
   background-color: $p5-dark-black;
   color: $p5-dark-white;
 }
 
-.cm-s-p5-dark .cm-comment {
+.cm-s-p5-dark span.cm-comment {
   color: $p5-dark-gray;
 }
 
-.cm-s-p5-dark .cm-def {
+.cm-s-p5-dark span.cm-def {
   color: $p5-dark-lightblue;
 }
 
-.cm-s-p5-dark .cm-string {
+.cm-s-p5-dark span.cm-string {
   color: $p5-dark-green;
 }
 
-.cm-s-p5-dark .cm-string-2 {
+.cm-s-p5-dark span.cm-string-2 {
   color: $p5-dark-orange;
 }
 
-.cm-s-p5-dark .cm-number {
+.cm-s-p5-dark span.cm-number {
   color: $p5-dark-white;
 }
 
-.cm-s-p5-dark .cm-keyword {
+.cm-s-p5-dark span.cm-keyword {
   color: $p5-dark-goldbrown;
 }
 
-.cm-s-p5-dark .cm-variable {
+.cm-s-p5-dark span.cm-variable {
   color: $p5-dark-lightblue;
 }
 
-.cm-s-p5-dark .cm-variable-2 {
+.cm-s-p5-dark span.cm-variable-2 {
   color: $p5-dark-white;
 }
 
-.cm-s-p5-dark .cm-property {
+.cm-s-p5-dark span.cm-property {
   color: $p5-dark-white;
 }
 
-.cm-s-p5-dark .cm-atom {
+.cm-s-p5-dark span.cm-atom {
   color: $p5-dark-pink;
 }
 
-.cm-s-p5-dark .cm-operator {
+.cm-s-p5-dark span.cm-operator {
   color: $p5-dark-white;
 }
 
@@ -82,7 +84,7 @@ $p5-dark-activeline: rgb(207, 207, 207);
   color: $p5-dark-number;
 }
 
-.cm-s-p5-dark .CodeMirror-selected {
+.cm-s-p5-dark div.CodeMirror-selected {
   background-color: $p5-dark-selected;
 }
 
@@ -95,30 +97,30 @@ $p5-dark-activeline: rgb(207, 207, 207);
   border-right: 1px solid #949494;
 }
 
-.cm-s-p5-dark .cm-error {
-  color: #df3a3d;
-}
-
-.cm-s-p5-dark .CodeMirror-matchingbracket {
+.cm-s-p5-dark span.CodeMirror-matchingbracket {
   outline: 1px solid $p5-dark-gray;
   outline-offset: 1px;
   color: $p5-dark-white !important;
 }
 
-.cm-s-p5-dark .cm-qualifier {
+.cm-s-p5-dark span.cm-qualifier {
   color: $p5-dark-lightblue;
 }
 
-.cm-s-p5-dark .cm-tag {
+.cm-s-p5-dark span.cm-tag {
   color: $p5-dark-pink;
 }
 
-.cm-s-p5-dark .cm-builtin {
+.cm-s-p5-dark span.cm-error {
+  color: $p5-dark-error;
+}
+
+.cm-s-p5-dark span.cm-builtin {
   color: $p5-dark-lightblue;
   font-weight: bold;
 }
 
-.cm-s-p5-dark .cm-attribute {
+.cm-s-p5-dark span.cm-attribute {
   color: $p5-dark-lightblue;
 }